美文网首页iOS开发IOS | MACIOS
TableViewCell内嵌ScrollView

TableViewCell内嵌ScrollView

作者: 萌九 | 来源:发表于2016-05-24 11:32 被阅读2001次
    qh_1.gif

    先上效果图。
    在TableViewCell中内嵌scrollView其实就是将可以滑动的scrollView用[cell.contentView add:scrollView]添加
    直接上代码:
    首先创建一个ScrollImage继承UIView
    在ScrollImage.h中添加接口方法

    @interface ScrollImage : UIView
    /**
     *  @frame: 外界传来的frame 即scrollView上每个UIImageView的大小
     *
     *  @Array: 外界存放UIImage的数组
     */
    - (instancetype)initWithFrame:(CGRect)frame withArray:(NSMutableArray *)array;
    @end
    

    在ScrollImage.m中:

    #import "ScrollImage.h"
    @interface ScrollImage ()<UIScrollViewDelegate> {
        CGRect backFrame; // 传来的frame
        CGFloat Margin; // margin为两边空隙宽度
    }
    @property (nonatomic, strong) UIScrollView *scrollView;
    @property (nonatomic, strong) NSMutableArray *imageArr; // 外界传来的图片数组
    @end
    @implementation ScrollImage
    - (UIScrollView *)scrollView {
        if (!_scrollView) {
            _scrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, backFrame.size.height)];
            _scrollView.contentSize = CGSizeMake(backFrame.size.width * _imageArr.count, 0);
            _scrollView.showsHorizontalScrollIndicator = NO;
            _scrollView.bounces = NO;
            _scrollView.delegate = self;
            [self addSubview:_scrollView];
        }
        return _scrollView;
    }
    
    - (instancetype)initWithFrame:(CGRect)frame withArray:(NSMutableArray *)array {
        self = [super initWithFrame:frame];
        if (self) {
            _imageArr = array;
            backFrame = frame;
            CGFloat kWidth = frame.size.width * _imageArr.count;
            CGRect Frame = self.frame;
            Frame.size.width = kWidth;
            self.frame = Frame;
            // 触发懒加载
            self.scrollView.backgroundColor = [UIColor clearColor];
            [self addImageViewArr];
        }
        return self;
    }
    
    - (void)addImageViewArr {
        NSInteger index = 0;
        for (UIImage *image in _imageArr) {
            UIImageView *imageV = [[UIImageView alloc] initWithImage:image];
            imageV.frame = CGRectMake(index * backFrame.size.width, 0, backFrame.size.width, backFrame.size.height);
            // 给图片加手势
            imageV.userInteractionEnabled = YES;
            imageV.tag = index;
            UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(click:)];
            [imageV addGestureRecognizer:tap];
            [_scrollView addSubview:imageV];
            index++;
        }
    }
    - (void)click:(UITapGestureRecognizer *)sender {
        UIImageView *imageVV = (UIImageView *)sender.view;
        NSLog(@"第%ld张图片", imageVV.tag);
    }
    

    然后在ViewController.m中调用

    #import "ViewController.h"
    #import "ScrollImage.h"
    @interface ViewController ()<UITableViewDelegate, UITableViewDataSource>
    @property (nonatomic, strong) UITableView *tableView;
    @end
    
    @implementation ViewController
    - (UITableView *)tableView {
        if (!_tableView) {
            _tableView = [[UITableView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height) style:(UITableViewStylePlain)];
            _tableView.delegate = self;
            _tableView.dataSource = self;
            [self.view addSubview:_tableView];
        }
        return _tableView;
    }
    
    - (void)viewDidLoad {
        [super viewDidLoad];
        
        [self.tableView registerClass:[UITableViewCell class] forCellReuseIdentifier:NSStringFromClass([UITableViewCell class])];
    }
    - (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
        return 200;
    }
    - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
        return 2;
    }
    - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
        UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:NSStringFromClass([UITableViewCell class]) forIndexPath:indexPath];
        // 这里用的是系统的cell 如果自定义的话 要在自定义cell导入头文件ScrollImage 并用cell.contentView 添加scrollView
        UIImage *image1 = [UIImage imageNamed:@"12.jpg"];
        UIImage *image2 = [UIImage imageNamed:@"19.jpg"];
        UIImage *image3 = [UIImage imageNamed:@"25.jpg"];
        UIImage *image4 = [UIImage imageNamed:@"29.jpg"];
        NSMutableArray *array = @[image1, image2, image3, image4, image1, image2, image3, image4].mutableCopy;
        ScrollImage *scrImage = [[ScrollImage alloc] initWithFrame:CGRectMake(0, 10, 100, 180) withArray:array];
        [cell.contentView addSubview:scrImage];
        return cell;
    }
    

    这次的代码就到这啦。

    附上Demo https://github.com/catcups/TableViewAddscrollView

    相关文章

      网友评论

      • JeffreyTaiT:加入下拉刷新,scrollview会重复创建怎么破
      • 小凡凡520:表格视图和scrllowview的手势冲突
        萌九:@小凡凡520 这个效果就是让cell上的每个图片点击都有事件。表格的点击是走didSelectRowAtIndexPath:。所以好像没有冲突。如果是不想看到点击cell后出现选中状态。可以在返回cell中设置cell.accessoryType = UITableViewCellAccessoryDisclosureIndicator;
      • 小凡凡520:出现 手势冲突怎么解决??
        Yealink:左右滑动cell中的scrollView时,tableView有时候会上下滑动,这个楼主如何处理的?
        萌九:@小凡凡520 你说的是不同row上面的点击事件相同吗?

      本文标题:TableViewCell内嵌ScrollView

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