iOS开发——新特性界面（UICollectionView）

绝地灬酷狼 2022-07-24 05:09 258阅读 0赞

没一款app在刚下载或者更新之后，app有些特色功能需要向用户传递，这个时候我们就要使用新特新界面，用户刚打开软件能看到各种展示图片，左右滑动还可以切换图片，那么新特性界面是如何实现的呢，下面我就用介绍下用如何代码去实现性特性界面，用的是iOS中的UICollectionView,自定义cell去实现的。

CollectionViewCell.h中

#import <UIKit/UIKit.h>
    
    @interface CollectionViewCell : UICollectionViewCell
    
    @property(nonatomic,strong)UIImage *image;
    
    @end

CollectionViewCell.m中

#import "CollectionViewCell.h"
    
    @interface CollectionViewCell ()
    
    @property(nonatomic,weak)UIImageView *imageView;
    
    
    @end
    
    @implementation CollectionViewCell
    
    //设置子控件的位置
    -(void)layoutSubviews
    {
        [super layoutSubviews];
        self.imageView.frame = self.bounds;
    }
    
    //懒加载
    -(UIImageView *)imageView
    {
        if (_imageView == nil) {
            UIImageView *imageView = [[UIImageView alloc] init];
            _imageView = imageView;
            [self.contentView addSubview:_imageView];
        }
        return _imageView;
    }
    
    
    
    -(void)setImage:(UIImage *)image
    {
        _image = image;
        self.imageView.image = _image;
    }
    
    @end

CollectionViewController.m中

#import "CollectionViewController.h"
    #import "CollectionViewCell.h"
    
    
    @interface CollectionViewController ()
    
    @property(nonatomic,weak)UIPageControl *pageControl;
    
    @end
    
    @implementation CollectionViewController
    
    static NSString * const reuseIdentifier = @"Cell";
    
    
    -(instancetype)init
    {
        UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc] init];
    
        //设置cell的尺寸
        layout.itemSize = [UIScreen mainScreen].bounds.size;
    
        //设置行间距
        layout.minimumLineSpacing = 0;
    
        //设置滚动方向
        layout.scrollDirection = UICollectionViewScrollDirectionHorizontal;
    
        return [super initWithCollectionViewLayout:layout];
    
    }
    
    // 使用UICollectionViewController
    // 1.初始化的时候设置布局参数
    // 2.必须collectionView要注册cell
    // 3.自定义cell
    
    - (void)viewDidLoad {
        [super viewDidLoad];
    
        //注册cell
        [self.collectionView registerClass:[CollectionViewCell class] forCellWithReuseIdentifier:reuseIdentifier];
    
        self.collectionView.pagingEnabled = YES;
        self.collectionView.bounces = NO;
        self.collectionView.showsHorizontalScrollIndicator = NO;
    
        //添加pageController
        UIPageControl *pageControl = [[UIPageControl alloc] init];
        pageControl.numberOfPages = 3;
        pageControl.pageIndicatorTintColor = [UIColor blackColor];
        pageControl.currentPageIndicatorTintColor = [UIColor blueColor];
        pageControl.center = CGPointMake(self.view.frame.size.width*0.5, self.view.frame.size.height-100);
        self.pageControl = pageControl;
        [self.view addSubview:self.pageControl];
    }
    
    
    //滚动就会调用
    -(void)scrollViewDidScroll:(UIScrollView *)scrollView
    {
        // 获取当前的偏移量，计算当前第几页
        int number = scrollView.contentOffset.x/scrollView.bounds.size.width+0.5;
    
        self.pageControl.currentPage = number;
    }
    
    #pragma mark <UICollectionViewDataSource>
    
    - (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView {
    
        return 1;
    }
    
    
    - (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {
    
        return 3;
    }
    
    - (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
        CollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:reuseIdentifier forIndexPath:indexPath];
    
        cell.image = [UIImage imageNamed:@"cloud"];
    
        return cell;
    }

运行代码，最终效果如下，左右可以滑动，底部的点表示是第几页。  
![这里写图片描述][20160513212143679]

[20160513212143679]: /images/20220722/a42116c6c2d84476863816817c662f26.png