美文网首页iOS DeveloperiOS 开发
IOS实战(制作模微信SelectView)

IOS实战(制作模微信SelectView)

作者: RDPCode | 来源:发表于2017-01-15 21:41 被阅读250次

    一、开发前言

         平时使用微信时候发现微信的selectview不是系统自带的,而且比系统的漂亮的多的了(具体去看微信图像选择项),所以决定开发出一个模仿微信的selectview而且更加小清新(起码自己的目标是这样)。
    

    二、构思与分析

         猜测微信的selectView 是 一个添加在UIWindows的一个UIView, 它的SubView 是TableView
    

    三、代码分析

    代码说明

    View结构说明

          * Title(标题提示)
          * 内容显示(栏目选择)
          * 取消按键
    

    SelectView 调用周期

          * Show (add 到 window )
          * 根据 内容生成 View
          * Close (remove superView)
    

    类说明

          * RDPSelectView 主要显示View
          * RDPTableViewCell TableView Cell
          * RDPSelectModel 封装Cell显示的一些内容 
    

    四、代码实现

    RDPSelectView 代码实现

    定义部分

    • 声明
    //类调用方法
    + (void)rdp_showSelectViewWithTitle:(NSString *)title
                     cancelButttonTitle:(NSString *)cancelButtonTitle
                          actionContent:(NSArray<RDPSelectModel *>*)actionContent
                            selectBlock:(RDPSelectViewBlock)selectBlock;
    
    - (instancetype)initWithTitle:(NSString *)title
                cancelButtonTitle:(NSString *)cancelButtonTitle
                     actonContent:(NSArray<RDPSelectModel *>*)actionContent
                      selectBlock:(RDPSelectViewBlock)selectBlock; 
                 
    

    *实现

        if (self = [super initWithFrame:RDP_SCREEN_BOUDS]){
            
            _title = title;
            _cancelTitle = cancelButtonTitle;
            _actionContents = actionContent;
            _selectBlock = selectBlock;
    
            
            _contentHeight = (actionContent.count >= MAX_CELL_COUNT ? MAX_CELL_COUNT : actionContent.count) * TABLE_CELL_HEIGHT;
            _viewHeight += _contentHeight;
            _viewHeight += _title ? TITLE_HEIGHT : 0;
            _viewHeight += CANCEL_BUTTON_HEIGHT;
            _viewHeight +=SPACE_HEIGHT;
            
            [self setSubView];
            
        }
        return self;
    
    

    view配置部分

        //设置背景
        [self addSubview:({
            
            UIView *coverView = [[UIView alloc] initWithFrame:self.bounds];
            coverView.backgroundColor = [UIColor colorWithWhite:0 alpha:0.5];
            coverView.alpha = 0;
            
            UITapGestureRecognizer *tapGR = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(close)];
            [coverView addGestureRecognizer:tapGR];
            
            _coverView = coverView;
            
        })];
        
        //设置内容view(内容部分)
        [self addSubview:({
            
            UIView *contentView = [[UIView alloc] init];
            contentView.frame   = CGRectMake(0, self.frame.size.height, self.frame.size.width, _viewHeight);
            contentView.backgroundColor = CONTENT_COLOR;
            
            _contentView = contentView;
            
        })];
        
        
        //设置标题
        if (_title){
            
            [_contentView addSubview:({
                
                UILabel *titleLab = [[UILabel alloc] init];
                titleLab.frame    = CGRectMake(0, 0, self.frame.size.width, TITLE_HEIGHT);
                titleLab = titleLab;
                titleLab.font = [UIFont systemFontOfSize:FONT_DEFAULT_SIZE];
                titleLab.text = _title;
                titleLab.backgroundColor = [UIColor whiteColor];
                titleLab.textColor = [UIColor grayColor];
                [titleLab setTextAlignment:NSTextAlignmentCenter];
                
                _titleLabel = titleLab;
                
            })];
        }
        
        //设置view subivew
        [_contentView addSubview:({
            
            UITableView *contentTableView = [[UITableView alloc] initWithFrame:CGRectMake(0, CGRectGetMaxY(_titleLabel.frame), self.frame.size.width, _contentHeight) style:UITableViewStyleGrouped];
            
            contentTableView.showsVerticalScrollIndicator = NO;
            contentTableView.showsHorizontalScrollIndicator = NO;
            contentTableView.dataSource  = self;
            contentTableView.delegate    = self;
            contentTableView.scrollEnabled = _actionContents.count > MAX_CELL_COUNT;
            contentTableView.separatorStyle = UITableViewCellSeparatorStyleNone;
            contentTableView.bounces = NO;
            _contentTableView = contentTableView;
            
        })];
        
        //取消按键
        [_contentView addSubview:({
            
            UIButton *cancelBtn = [[UIButton alloc] init];
            
            cancelBtn.frame     = CGRectMake(0, _contentView.frame.size.height - CANCEL_BUTTON_HEIGHT, self.frame.size.width, CANCEL_BUTTON_HEIGHT);
            
            [cancelBtn.titleLabel setFont:[UIFont systemFontOfSize:FONT_DEFAULT_SIZE]];
            [cancelBtn setTitle:_cancelTitle ? _cancelTitle : @"取消"  forState:UIControlStateNormal];
            [cancelBtn setTitleColor:[UIColor redColor] forState:UIControlStateNormal];
            [cancelBtn setBackgroundColor:[UIColor whiteColor]];
            [cancelBtn addTarget:self action:@selector(close) forControlEvents:UIControlEventTouchUpInside];
            
            _cancelBtn = cancelBtn;
            
        })];
        
    

    Show Close 部分

    
    - (void)show{
        
        
        [[[UIApplication sharedApplication].windows firstObject] addSubview:self];
        
        [[UIApplication sharedApplication].keyWindow addSubview:self];
        [UIView animateWithDuration:0.5 delay:0 usingSpringWithDamping:0.9f initialSpringVelocity:0.7f
                            options:UIViewAnimationOptionCurveEaseInOut
                         animations:^{
                             
                             _coverView.alpha = 1.0;
                             
                             _contentView.transform = CGAffineTransformMakeTranslation(0,  -_contentView.frame.size.height);
                             
                         } completion:nil];
    }
    
    - (void)close{
    
        [UIView animateWithDuration:0.5 delay:0 usingSpringWithDamping:0.9f initialSpringVelocity:0.7f
                            options:UIViewAnimationOptionCurveEaseInOut
                         animations:^{
                             self.coverView.alpha = 0;
                             self.contentView.transform = CGAffineTransformIdentity;
                         } completion:^(BOOL finished) {
                             [self removeFromSuperview];
                         }];
        
    }
    
    

    RDPSelectModel

    声明部分

    /** titile */
    @property (nonatomic,copy,readonly) NSString *title;
    /** title 标题颜色 */
    @property (nonatomic,strong,readonly) UIColor *titleColor;
    
    /**
     定义view model
    
     @param title 标题
     @param titleColor 颜色
    
     @return 对象
     */
    - (instancetype)initWithTitle:(NSString *)title
                       titleColor:(UIColor *)titleColor;
    /**
     定义view model
     
     @param title 标题
     @param titleColor 颜色
     
     @return 对象
     */
    + (instancetype)rdpSelectModelWithTitle:(NSString *)title
                                 titleColor:(UIColor *)titleColor;
    
    

    实现部分

    - (instancetype)initWithTitle:(NSString *)title titleColor:(UIColor *)titleColor{
        
        if (self = [super  init]){
            
            _title = title;
            _titleColor = titleColor ? titleColor : DEFAULT_TITLE_COLOR;
        }
        return self;
    }
    
    + (instancetype)rdpSelectModelWithTitle:(NSString *)title titleColor:(UIColor *)titleColor{
        
        return [[RDPSelectModel alloc] initWithTitle:title titleColor:titleColor];
    }
    

    实现效果

    demo1 2.png

    结尾

    附上Git 链接
    RDSelectView

    相关文章

      网友评论

        本文标题:IOS实战(制作模微信SelectView)

        本文链接:https://www.haomeiwen.com/subject/xdrubttx.html