iOS实战-自定义的横向滚动控件CustomScrollView

CustomScrollView

  使用官方UIScrollView组件定制的一个横向滚动的视图。由于能力有限，暂没有抽象成一个UI组件，如果有大神能进行抽象封装，非常欢迎，大家多多交流！

1.1 说明

  CustomScrollView包括诺干个子视图，可以横向滚动，滚动过程中会根据子视图所在位置进行大小缩放。即最中间的视图最大，两边呈对称状态逐渐减小。且可以通过点击按钮进行滚动，选定某个子视图居中。还可以动态进行新增和删除子视图的操作，其中删除操作为在子视图上进行上滑手势操作。

Github 项目传送门——CustomScrollView

1.2 截图

二、具体实现

接下来我们来看看是怎么一步一步实现这种效果的。

2.1 模型

这里的模型只是我们简单定义的一个数据模型，模型包含了一个名称和对应的logo图标的名字。

//YSModel.h

#import <Foundation/Foundation.h>

@interface YSModel : NSObject

@property (copy, nonatomic) NSString *name;
@property (copy, nonatomic) NSString *logoName;

- (instancetype)initWithName:(NSString *)name logoName:(NSString *)logoName;

@end

//YSModel.m

#import "YSModel.h"

@implementation YSModel

- (instancetype)init
{
    return [self initWithName:@"自定义" logoName:@"custom"];
}

- (instancetype)initWithName:(NSString *)name logoName:(NSString *)logoName
{
    self = [super init];
    if (self)
    {
        _name = name;
        _logoName = logoName;
    }
    return self;
}

@end

2.2 界面实现和控件绑定

  界面直接在xib文件里实现。只需要一个UIScrollView和UILabel就可以了，UILabel是为了当UIScrollView中的子视图滚动式，也会跟着切换。效果如图:

2.3 ViewController的实现

首先我们需要一些宏定义的常量:

//默认scrollView显示的模型数目
#define MODEL_NUMBER 5
//屏幕宽度
#define UISCREEN_WIDTH [[UIScreen mainScreen] bounds].size.width
//默认图标缩放比率
#define SCALE_RATE 0.6

其次我们需要一些变量,比如Outlet变量，数据模型数组等变量，详见demon里的代码。接下来我们主要详细介绍几个重点方法。

2.3.1 计算每个cell的宽高，以及初始化数据和UI视图

- (void)viewDidLoad
{
    [super viewDidLoad];

    //