Copy of NetEase News Client Homepage News Carousel iOS Component

I. Demand analysis

1, can be horizontal circulation rolling news pictures

2, scrolling to the corresponding picture display news headlines

3, each news picture can click

4, there are Pagecontrol tips

5, with the ability to expand the control

Second, the design realizes

1, display pictures using Sdwebimage Third-party library, can cache pictures, through the URL to load pictures asynchronously

2, using a horizontal scrolling uitableview to achieve circular scrolling

3, the use of a black translucent background, white text Uilabel display title

4, define the data structure of each news:

/** @brief default to use the local address, if not local, use the network picture * *

@interface Photonewsmodel:nsobject

/** @brief the pictures displayed when loading * *
@property (nonatomic, strong) UIImage *loadingimage;

/** @brief Picture Local address * *
@property (nonatomic, strong) NSString *localpath;

/** @brief News Picture Address * *
@property (nonatomic, strong) NSString *photourl;

/** @brief News Title * *
@property (nonatomic, strong) NSString *title;


@end

5. Agency Agreement:

@protocol uiphotonewsviewdelegate <NSObject>

/**
* How many pictures to get news
*
* @param photonews control itself
*
* @return The number of picture news
*/
-(Nsuinteger) Photonewscount: (Uiphotonewsview *) photonews;



/**
* Back to the first few pictures of the news model
*
* @param photonews control itself
* @param index
*
* @return return to the model describing the picture news
*/
-(Photonewsmodel *) Photonews: (Uiphotonewsview *) photonews
Photomodelatindex: (nsuinteger) index;



/**
* Picture News Click on the callback
*
* @param photonews control itself
* @param model click on the news corresponding model
*/
-(void) Photonews: (Uiphotonewsview *) photonews
Photodidclick: (Photonewsmodel *) model;




@end

6. How to implement the cyclic scrolling

A a copy of the data to be presented will be equivalent to 1, 2, 3, 4|1, 2, 3, 4

b When data is initialized, navigate to the second part of 1 here

c) Scroll to the front 1 or 2 o'clock, set to jump to the second part of 1 and 2

d) Key code:

-(void) Makecyclescroll
{
if (Self.realcount >= 2)
{
CGFloat currentoffsetx = self.contenttableview.contentoffset.x;
CGFloat currentoffsety = Self.contenttableview.contentoffset.y;
CGFloat contentheight = self.contentTableView.contentSize.height;

if (Currentoffsety < (contentheight/8.0)) {
Self.contentTableView.contentOffset = Cgpointmake (Currentoffsetx, (Currentoffsety + (CONTENTHEIGHT/2)));
}
if (currentoffsety >= (contentheight * 6)/8.0)) {
Self.contentTableView.contentOffset = Cgpointmake (Currentoffsetx, (Currentoffsety-(CONTENTHEIGHT/2)));
}
}
}

Third, the realization effect

(Can be left and right loop scrolling)