iOS開發UI篇—無限輪播（新聞資料展示）

標籤：

一、實現效果

　　      

二、實現步驟

1.前期準備

　　（1）匯入資料轉模型的第三方架構MJExtension

　　（2）向項目中添加儲存有“新聞”資料的plist檔案

　　　　

　　（3）匯入用到的圖片素材

2.步驟和代碼

（1）建立一個資料模型

　　　

　　該模型的代碼設計如下：　　　　

　　YYnews.h檔案

 1 // 2 //  YYnews.h 3 //  08-無限滾動（新聞資料展示） 4 // 5  6 #import <Foundation/Foundation.h> 7  8 @interface YYnews : NSObject 9 @property(nonatomic,copy)NSString *title;10 @property(nonatomic,copy)NSString *icon;11 @end

（2）建立一個繼承自UICollectionViewCell的類，用於自訂cell。

　　

（3）建立一個xib檔案，和自訂的cell做關聯

　　   

　　代碼設計如下：

　　 YYcell.h檔案

 1 // 2 //  YYcell.h 3 //  08-無限滾動（新聞資料展示） 4 // 5  6 #import <UIKit/UIKit.h> 7  8 @class YYnews; 9 @interface YYcell : UICollectionViewCell10 @property(nonatomic,strong)YYnews *news;11 @end

 YYcell.m檔案

 1 // 2 //  YYcell.m 3 //  08-無限滾動（新聞資料展示） 4 // 5  6 #import "YYcell.h" 7 #import "YYnews.h" 8  9 @interface YYcell ()10 @property (weak, nonatomic) IBOutlet UILabel *label;11 @property (weak, nonatomic) IBOutlet UIImageView *imageView;12 13 @end14 @implementation YYcell15 16 -(void)setNews:(YYnews *)news17 {18     _news=news;19     self.label.text=news.title;20     self.imageView.image=[UIImage imageNamed:news.icon];21 }22 23 @end

（4）在主控制器中的代碼處理

　　YYViewController.m檔案

 1 // 2 //  YYViewController.m 3 //   4 // 5 //  Created by apple on 14-8-3. 6 //  Copyright (c) 2014年 yangyong. All rights reserved. 7 // 8  9 #import "YYViewController.h"10 #import "MJExtension.h"11 #import "YYnews.h"12 #import "YYcell.h"13 14 #define YYIDCell @"cell"15 16 @interface YYViewController ()<UICollectionViewDataSource,UICollectionViewDelegate>17 @property (weak, nonatomic) IBOutlet UICollectionView *collectinView;18 @property(nonatomic,strong)NSArray *news;19 @end20 21 @implementation YYViewController22 23 #pragma mark-懶載入24 -(NSArray *)news25 {26     if (_news==nil) {27         _news=[YYnews objectArrayWithFilename:@"newses.plist"];28     }29     return _news;30 }31 - (void)viewDidLoad32 {33     [super viewDidLoad];34     //註冊cell35 //    [self.collectinView registerClass:[YYimageCell class] forCellWithReuseIdentifier:YYCell];36     [self.collectinView registerNib:[UINib nibWithNibName:@"YYcell" bundle:nil] forCellWithReuseIdentifier:YYIDCell];37     38 }39 40 #pragma mark- UICollectionViewDataSource41 //一共多少組，預設為1組42 -(NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView43 {44     return 1;45 }46 -(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section47 {48     return self.news.count;49 }50 51 -(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath52 {53     YYcell *cell=[collectionView dequeueReusableCellWithReuseIdentifier:YYIDCell forIndexPath:indexPath];54     cell.news=self.news[indexPath.item];55     return cell;56 }57 58 #pragma mark-UICollectionViewDelegate59 @end

 

3.補充說明

（1）如果collectionCell是以xib的方式自訂的，那麼在註冊cell的時候，需要使用另外一種方式。[self.collectinView registerClass:[YYimageCell class] forCellWithReuseIdentifier:YYCell];[self.collectinView registerNib:[UINib nibWithNibName:@"YYcell" bundle:nil] forCellWithReuseIdentifier:YYIDCell];（2）在自訂xib的時候，使用collectionViewCell。並設定其標識為cell.　　（3）列印查看cell的利用情況　　

iOS開發UI篇—無限輪播（新聞資料展示）