iOS SDWEBImage和collectionView的組合,以及collectionView的隨意間距設定

來源:互聯網
上載者:User

標籤:

轉寄自 http://www.cnblogs.com/pruple/p/5357150.html

 

#import "ViewController.h"#import <ImageIO/ImageIO.h>#import "UIImageView+WebCache.h"@interface ViewController ()<UICollectionViewDataSource, UICollectionViewDelegate, UICollectionViewDelegateFlowLayout>// 資料來源@property (nonatomic, strong)NSMutableArray *arrIcon;// 顯示控制項@property (nonatomic, strong)UICollectionView *clv;@end@implementation ViewController- (void)viewDidLoad{    [super viewDidLoad];        // 擷取資料來源寫成,url寫成plist檔案    /*    [[NSArray arrayWithObjects:     @"http://image.tianjimedia.com/uploadImages/2012/273/M6J97CZGYA4Z_NatGeo01_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/J3ME8ZNAG315_NatGeo02_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/EL9230AP5196_NatGeo03_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/SYJ43SG47PC8_NatGeo04_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/605X52620G0M_NatGeo05_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/7H5RQ1ELP8MZ_NatGeo06_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/Z2W429E0203R_NatGeo07_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/BG011W9LWL77_NatGeo08_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/936FM8NN22J2_NatGeo09_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/H79633PPEFZW_NatGeo10_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/54Z01YZ78050_NatGeo11_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/61V3658UA4IY_NatGeo12_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/H3HL7YILNGKB_NatGeo13_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/1V6797311ZA5_NatGeo14_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/93L81IKN156R_NatGeo15_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/V93E1EGU2G0Z_NatGeo16_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/QC205CD96IWZ_NatGeo17_250.jpg",@"http://image.tianjimedia.com/uploadImages/2012/273/M6J97CZGYA4Z_NatGeo01_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/J3ME8ZNAG315_NatGeo02_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/EL9230AP5196_NatGeo03_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/SYJ43SG47PC8_NatGeo04_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/605X52620G0M_NatGeo05_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/7H5RQ1ELP8MZ_NatGeo06_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/Z2W429E0203R_NatGeo07_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/BG011W9LWL77_NatGeo08_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/936FM8NN22J2_NatGeo09_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/H79633PPEFZW_NatGeo10_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/54Z01YZ78050_NatGeo11_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/61V3658UA4IY_NatGeo12_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/H3HL7YILNGKB_NatGeo13_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/1V6797311ZA5_NatGeo14_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/93L81IKN156R_NatGeo15_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/V93E1EGU2G0Z_NatGeo16_250.jpg",     @"http://image.tianjimedia.com/uploadImages/2012/273/QC205CD96IWZ_NatGeo17_250.jpg",     nil] writeToFile:@"/Users/Mu/Desktop/pic.plist" atomically:YES];   */        self.arrIcon = [NSMutableArray arrayWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"pic" ofType:@"plist"]];    // 設定滾動方向:FlowLayout簡單說是一個直線對齊的layout    UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc] init];    // 滾動方向    layout.scrollDirection = UICollectionViewScrollDirectionVertical;    // 尾部距離螢幕尺寸(豎直模式,x沒有作用)    layout.headerReferenceSize = CGSizeMake(0, 30); //頭部尺寸    layout.footerReferenceSize = CGSizeMake(0, 100); //尾部尺寸    // 縮排:和螢幕上下以及相對於螢幕的左右間距(上左下右):左右會影響到豎直間距    // 預設是10:終於可以改變了    layout.sectionInset = UIEdgeInsetsMake(1, 0, 1, 0);    // 設定圖片的尺寸    //layout.itemSize = CGSizeMake(WID/4.0-1, WID/4.0-1);    //layout.itemSize = CGSizeMake((WID-30)/4.0, (WID-30)/4.0);    // 目前發現:預估尺寸等效于于itemSize    layout.estimatedItemSize = CGSizeMake(WID/4.0-1, WID/4.0-1);    // 前提minimumInteritemSpacing為0(預設為10)    layout.minimumInteritemSpacing = 0;    // 行間距(豎直模式)    layout.minimumLineSpacing = 1;    // 設定頁首和頁尾是否一直存在    layout.sectionHeadersPinToVisibleBounds= NO;        // 建立對象    self.clv = [[UICollectionView alloc] initWithFrame:self.view.frame collectionViewLayout:layout];    // 指定代理    self.clv.delegate = self;    self.clv.dataSource = self;        // 註冊唯一標識    [self.clv registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:@"reuse"];    [self.clv registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"headReuse"];    [self.clv registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionFooter withReuseIdentifier:@"footReuse"];        // 添加到主視圖    [self.view addSubview:self.clv];    self.clv.backgroundColor = [UIColor whiteColor];        // 設定位移量,隱藏UISegmentedControl    self.clv.contentOffset = CGPointMake(0, 30);}#pragma - UICollectionViewDataSource- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView{    return 1;}- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{    [self.arrIcon addObject:[NSNull null]];    [self.arrIcon addObject:[NSNull null]];    return self.arrIcon.count;}// 首先是cell本身作為容器view   然後是一個大小自動適應整個cell的backgroundView,用作cell平時的背景   再其上是selectedBackgroundView,是cell被選中時的背景   最後是一個contentView,自訂內容應被加在這個view上- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{    // 重用隊列標識    UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"reuse" forIndexPath:indexPath];        // 第三方Image請求    UIImageView *imv = [[UIImageView alloc] init];    [imv sd_setImageWithURL:self.arrIcon[indexPath.row] placeholderImage:[UIImage imageNamed:@"u=2312994427,1092373000&fm=21&gp=0.jpg"] options:SDWebImageRetryFailed];    cell.backgroundView = imv;        // 選中更換背景圖_1(點擊選中即更換)    //cell.selectedBackgroundView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"Img361868872.jpg"]];        return cell;}// 頁首和頁尾出現即調用;頁首要第二次出現才會調用// Supplementary Views 追加視圖 如果你對UITableView比較熟悉的話,可以理解為每個Section的Header或者Footer,用來標記每個section的view- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath{    if (kind == UICollectionElementKindSectionHeader)    {        // 重用標識        UICollectionReusableView *ppView = [collectionView dequeueReusableSupplementaryViewOfKind:kind withReuseIdentifier:@"headReuse" forIndexPath:indexPath];        ppView.backgroundColor = [UIColor clearColor];        // 添加子控制項        UISegmentedControl *sgmc = [[UISegmentedControl alloc] initWithItems:@[@"名稱", @"日期", @"大小"]];        sgmc.tintColor = [UIColor purpleColor];        sgmc.bounds = CGRectMake(0, 0, 100, 15);        sgmc.center = ppView.center;        [ppView addSubview:sgmc];                return ppView;    }else    {        // 重用標識        UICollectionReusableView *ppView = [collectionView dequeueReusableSupplementaryViewOfKind:kind withReuseIdentifier:@"footReuse" forIndexPath:indexPath];        ppView.backgroundColor = [UIColor clearColor];                // 添加數量和時間        UILabel *lbl = [[UILabel alloc] init];        lbl.numberOfLines = 2;        lbl.textAlignment = NSTextAlignmentCenter;        lbl.frame = CGRectMake((WID-200)/2, 35, 200, 30);        lbl.font = [UIFont systemFontOfSize:10];                NSDate *date = [NSDate date];        NSTimeZone *zone = [NSTimeZone systemTimeZone];        NSInteger seconds = [zone secondsFromGMTForDate:date];        NSDate *now = [date dateByAddingTimeInterval:seconds];                // 格式化NSDate為NSString:會自動添加28800s即等於now        NSDateFormatter *fm = [NSDateFormatter new];        fm.dateFormat = @"yyyy年MM月dd日HH時mm分ss秒";                // 需要取子串        NSString *time = [[fm stringFromDate:date] substringFromIndex:11];                NSString *num = [NSString stringWithFormat:@"%lu張照片", self.arrIcon.count];        lbl.text = [NSString stringWithFormat:@"%@\r\n%@", num, time];                [ppView addSubview:lbl];        NSLog(@"等效:%@;%@", now, [fm stringFromDate:date]);        return ppView;    }}// 對於Decoration Views,提供方法並不在UICollectionViewDataSource中,而是直接UICollectionViewLayout類中的(因為它僅僅是視圖相關,而與資料無關)// 選中跟換背景圖_2(長按更換鬆開恢複)// 需要允許為YES,不然走發哦這裡就停了不會執行didHighlightItemAtIndexPath- (BOOL)collectionView:(UICollectionView *)collectionView shouldHighlightItemAtIndexPath:(NSIndexPath *)indexPath{    return YES;}- (void)collectionView:(UICollectionView *)colView didHighlightItemAtIndexPath:(NSIndexPath *)indexPath{    // 沒有建立新對象:使用的還是indexPath隊列的cell    UICollectionViewCell* cell = [colView cellForItemAtIndexPath:indexPath];        cell.backgroundView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"Img361868872.jpg"]];}- (void)collectionView:(UICollectionView *)collectionView didUnhighlightItemAtIndexPath:(NSIndexPath *)indexPath{    // 沒有建立新對象:使用的還是indexPath隊列的cell    UICollectionViewCell* cell = [collectionView cellForItemAtIndexPath:indexPath];        UIImageView *imv = [[UIImageView alloc] init];    [imv sd_setImageWithURL:self.arrIcon[indexPath.row] placeholderImage:[UIImage imageNamed:@"u=2312994427,1092373000&fm=21&gp=0.jpg"] options:SDWebImageRetryFailed];    cell.backgroundView = imv;    }UIImageView *imv;// 選中- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{    NSLog(@"%lu", indexPath.row);}@end

iOS SDWEBImage和collectionView的組合,以及collectionView的隨意間距設定

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.