iOS Development UI Chapter-Infinite Carousel (Recycle)

iOS Development UI Chapter-Infinite Carousel (Recycle)

I. Infinite Carousel

1. Brief description

In development, it is often necessary to automate the carousel of ads or some images, which is called infinite scrolling.　　In development, it is common practice to use a uiscrollview, add multiple ImageView on the Uiscrollview, and then set the ImageView's picture, and the ScrollView scroll range. Previous practice:generally speaking, the number of advertisements or pictures is not too much (photos). Therefore, there is not much to consider performance issues. But if there are too many pictures (such as 16 images, you need to create 16 ImageView), then you have to consider performance issues. What's more, if you dive into a small picture-browsing program, you might be dealing with hundreds or thousands of images, which can cause great memory waste and poor performance. 　　The number of images is numerous: when the user is viewing the first picture, the next 7 are created too early, and the user may not have a chance to see (see the previous few photos, no interest in looking at the back of the content). Optimize the idea: only when need to use, re-create, create the ImageView for village recycling.　　Good practice, no matter how many pictures, only need to create 3 imageview is enough. This article describes the use of CollectionView to achieve infinite scrolling recycling. It supports scrolling in both vertical and horizontal directions. Second, the realization1. Description:The usage of Collectioncell is not the same as the usage of Tableviewcell, Collectioncell need to register and tell it what type of cell the cell is, if not in the cache pool, Then it detects what type of cell this identity is registered for and automatically creates this type of cell.　　　　　　2. Implementation step (1) Add a Uicollectionview to storyboard to adjust the width height of the control. (2) set its width height = = The width of a picture = = the width of its one cell sets the size of the cell's lattice.　　　　   　　　　It defaults to scrolling upward, adjusting to horizontal scrolling. (3) Connect, set its data source and proxy implementation code:

1 //2 //YYVIEWCONTROLLER.M3 //07-Infinite Scrolling (recycling)4 //5 //Created by Apple on 14-8-3.6 //Copyright (c) 2014 Yangyong. All rights reserved.7 //8 9 #import "YYViewController.h"Ten  One @interfaceYyviewcontroller () <UICollectionViewDataSource,UICollectionViewDelegate> A@property (Weak, nonatomic) Iboutlet Uicollectionview *Collectinview; -  - @end the  - @implementationYyviewcontroller -  -- (void) Viewdidload + { - [Super Viewdidload];21//Register cell22 static nsstring *[email protected] "cell"; [Self.collectinview Registerclass:[uicollectionv Iewcell class] forcellwithreuseidentifier:id]; -      - } -  - #pragmaMark-uicollectionviewdatasource - //Total number of groups, default to 1 groups in-(Nsinteger) Numberofsectionsincollectionview: (Uicollectionview *) CollectionView - { to     return 1; + } --(Nsinteger) CollectionView: (Uicollectionview *) CollectionView numberofitemsinsection: (nsinteger) section the { *     return  -; $ }Panax Notoginseng  --(Uicollectionviewcell *) CollectionView: (Uicollectionview *) CollectionView Cellforitematindexpath: (NSIndexPath *) Indexpath the { +     StaticNSString *id=@"Cell"; AUicollectionviewcell *cell=[CollectionView dequeuereusablecellwithreuseidentifier:id Forindexpath:indexpath]; theCell.backgroundcolor=Yyrandomcolor; +     returncell; - } $  $ #pragmaMark-uicollectionviewdelegate - @end

Interface display: Print to see if the cell recycling is implemented.　　As you can see, only two cells were created in the entire program.　　　　(4) Display pictures, custom cell (two ways, you can use Xib can also use code).　　　　　　　　Customize a cell to display images. Implementation code:
YYimageCell.h file

1 //2 //YYimageCell.h3 //07-Infinite Scrolling (recycling)4 //5 //Created by Apple on 14-8-3.6 //Copyright (c) 2014 Yangyong. All rights reserved.7 //8 9 #import<UIKit/UIKit.h>Ten  One @interfaceYyimagecell:uicollectionviewcell A@property (nonatomic,copy) NSString *icon; - @end

YYIMAGECELL.M file

1 //2 //YYIMAGECELL.M3 //07-Infinite Scrolling (recycling)4 //5 //Created by Apple on 14-8-3.6 //Copyright (c) 2014 Yangyong. All rights reserved.7 //8 9 #import "YYimageCell.h"Ten  One @interfaceYyimagecell () A@property (nonatomic,strong) Uiimageview *ImageView; - @end - @implementationYyimagecell the  -- (ID) initWithFrame: (CGRect) Frame - { -Self =[Super Initwithframe:frame]; +     if(self) { -         +Uiimageview *imageview=[[Uiimageview alloc]init]; A [self addsubview:imageview]; atself.imageview=ImageView; -     } -     returnSelf ; - } -  --(void) SetIcon: (NSString *) icon in { -_icon=[icon copy]; toSelf.imageview.image=[UIImage Imagenamed:icon]; + } -  the-(void) Layoutsubviews * { $ [Super Layoutsubviews];Panax NotoginsengSelf.imageview.frame=self.bounds; - } the  + @end

YYVIEWCONTROLLER.M file

1 //2 //YYVIEWCONTROLLER.M3 //07-Infinite Scrolling (recycling)4 //5 //Created by Apple on 14-8-3.6 //Copyright (c) 2014 Yangyong. All rights reserved.7 //8 9 #import "YYViewController.h"Ten #import "YYimageCell.h" One  A #defineYycell @ "Cell" -  - @interfaceYyviewcontroller () <UICollectionViewDataSource,UICollectionViewDelegate> the@property (Weak, nonatomic) Iboutlet Uicollectionview *Collectinview; -  - @end -  + @implementationYyviewcontroller -  +- (void) Viewdidload A { at [Super Viewdidload]; -     //Register Cell - //static nsstring *[email protected] "cell"; -[Self.collectinview registerclass:[Yyimagecell class] Forcellwithreuseidentifier:yycell]; -      - } in  - #pragmaMark-uicollectionviewdatasource to //Total number of groups, default to 1 groups +-(Nsinteger) Numberofsectionsincollectionview: (Uicollectionview *) CollectionView - { the     return 1; * } $-(Nsinteger) CollectionView: (Uicollectionview *) CollectionView numberofitemsinsection: (nsinteger) sectionPanax Notoginseng { -     return  -; the } +  A-(Uicollectionviewcell *) CollectionView: (Uicollectionview *) CollectionView Cellforitematindexpath: (NSIndexPath *) Indexpath the { + //static nsstring *[email protected] "cell"; -     Yyimagecell*cell=[CollectionView Dequeuereusablecellwithreuseidentifier:yycell Forindexpath:indexpath]; $Cell.backgroundcolor=Yyrandomcolor; $NSLog (@"%p,%d", Cell,indexpath.item); -Cell.icon=[nsstring stringWithFormat:@"minion_%02d", indexpath.item+1]; -     returncell; the } - Wuyi #pragmaMark-uicollectionviewdelegate the @end

Interface implementation: (5) Detail processing set paging adjust spacing to hide the horizontal scroll bar. Clears its color.