如何增加cell卡片的点击率

462 阅读3分钟

支持功能

在UITableview的cell中支持在当前屏幕中上下滑动触发自定义事件

在UITableview的cell中监听用户对某个cell的滑动,达到一定距离之后触发自定义事件,比如点击事件(比如增加某个cell的点击率,比如ad)

需求

需要在 UITableViewCellUICollectionViewCell 中支持滑动触发事件,并且每个 cellitem 都有自己的触发策略(如最短间隔时间和滑动距离)。为了满足这一需求,我们可以进一步封装功能代码,提供一个高度可复用的工具类,同时允许每个 cell 独立配置自己的触发策略。

实现思路

  1. 封装滑动事件处理器

    • 创建一个独立的工具类(如 CellSwipeHandler),用于处理滑动事件。

    • 每个 cell 可以持有一个 CellSwipeHandler 实例,并配置自己的触发策略。

  2. 支持自定义触发策略

    • 每个 cell 可以设置自己的滑动距离阈值和触发间隔。
  3. 事件回调

  • 通过 Block 或代理模式将滑动事件回调给 cell,由 cell 处理具体的业务逻辑。

代码实现

1. 封装滑动事件处理器 

#import <UIKit/UIKit.h>

// 定义事件回调的 Block 类型
typedef void (^CellSwipeEventHandler)(void);

@interface CellSwipeHandler : NSObject

// 初始化方法,传入需要监听手势的视图
- (instancetype)initWithView:(UIView *)view;

// 设置向下滑动事件的回调
@property (nonatomic, copy) CellSwipeEventHandler onScrollDown;

// 设置向上滑动事件的回调
@property (nonatomic, copy) CellSwipeEventHandler onScrollUp;

// 设置滑动距离阈值(默认 100px)
@property (nonatomic, assign) CGFloat scrollThreshold;

// 设置触发间隔(默认 2 秒)
@property (nonatomic, assign) NSTimeInterval triggerInterval;

@end

#import "CellSwipeHandler.h"

@interface CellSwipeHandler ()

@property (nonatomic, weak) UIView *view; // 弱引用视图
@property (nonatomic, assign) CGPoint startPanPoint; // 记录滑动手势的起始点
@property (nonatomic, strong) NSDate *lastTriggerTime; // 记录上次触发事件的时间

@end

@implementation CellSwipeHandler

- (instancetype)initWithView:(UIView *)view {
    self = [super init];
    if (self) {
        _view = view;
        _scrollThreshold = 100.0; // 默认滑动距离阈值
        _triggerInterval = 2.0;    // 默认触发间隔
        [self setupPanGesture];
    }
    return self;
}

- (void)setupPanGesture {
    // 添加滑动手势识别器
    UIPanGestureRecognizer *panGesture = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(handlePanGesture:)];
    [self.view addGestureRecognizer:panGesture];
}

- (void)handlePanGesture:(UIPanGestureRecognizer *)gesture {
    if (gesture.state == UIGestureRecognizerStateBegan) {
        // 记录滑动的起始点
        self.startPanPoint = [gesture locationInView:self.view];
    } else if (gesture.state == UIGestureRecognizerStateEnded) {
        // 获取手势结束时的位置
        CGPoint endPoint = [gesture locationInView:self.view];
        
        // 计算滑动的垂直距离
        CGFloat verticalDistance = endPoint.y - self.startPanPoint.y;
        
        // 判断是否超过滑动距离阈值
        if (fabs(verticalDistance) > self.scrollThreshold) {
            // 检查触发间隔
            NSDate *now = [NSDate date];
            if (!self.lastTriggerTime || [now timeIntervalSinceDate:self.lastTriggerTime] > self.triggerInterval) {
                if (verticalDistance > 0) {
                    // 向下滑动超过阈值
                    if (self.onScrollDown) {
                        self.onScrollDown();
                    }
                } else {
                    // 向上滑动超过阈值
                    if (self.onScrollUp) {
                        self.onScrollUp();
                    }
                }
                // 更新上次触发时间
                self.lastTriggerTime = now;
            } else {
                NSLog(@"触发间隔不足 %.1f 秒,忽略本次事件", self.triggerInterval);
            }
        }
    }
}

@end

2. 在 UITableViewCell 或 UICollectionViewCell 中使用 CellSwipeHandler

#import "CustomTableViewCell.h"
#import "CellSwipeHandler.h"

@interface CustomTableViewCell ()

@property (nonatomic, strong) CellSwipeHandler *swipeHandler; // 强引用滑动事件处理器

@end

@implementation CustomTableViewCell

- (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier {
    self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
    if (self) {
        // 初始化滑动事件处理器
        self.swipeHandler = [[CellSwipeHandler alloc] initWithView:self.contentView];
        
        // 设置滑动距离阈值(例如 150px)
        self.swipeHandler.scrollThreshold = 150.0;
        
        // 设置触发间隔(例如 3 秒)
        self.swipeHandler.triggerInterval = 3.0;
        
        // 设置向下滑动事件的回调
        __weak typeof(self) weakSelf = self;
        self.swipeHandler.onScrollDown = ^{
            [weakSelf handleScrollDown];
        };
        
        // 设置向上滑动事件的回调
        self.swipeHandler.onScrollUp = ^{
            [weakSelf handleScrollUp];
        };
    }
    return self;
}

- (void)handleScrollDown {
    NSLog(@"Cell %@ 向下滑动超过 %.1fpx,触发自定义事件", self, self.swipeHandler.scrollThreshold);
    // 在这里添加你的自定义事件代码
}

- (void)handleScrollUp {
    NSLog(@"Cell %@ 向上滑动超过 %.1fpx,触发自定义事件", self, self.swipeHandler.scrollThreshold);
    // 在这里添加你的自定义事件代码
}

@end

代码说明

  1. CellSwipeHandler

    • 封装了滑动手势的处理逻辑,支持自定义滑动距离阈值和触发间隔。

    • 通过 Block 回调将滑动事件传递给 cell

  2. CustomTableViewCell

    • 每个 cell 持有一个 CellSwipeHandler 实例,并配置自己的触发策略。

    • handleScrollDownhandleScrollUp 方法中处理具体的业务逻辑。

  3. 高度可复用

  • CellSwipeHandler 可以在任何 UITableViewCellUICollectionViewCell 中使用。

  • 每个 cell 可以独立配置滑动距离阈值和触发间隔。

优点

  • 高度可配置:每个 cell 可以独立设置滑动距离阈值和触发间隔。

  • 模块化设计:将滑动逻辑封装到 CellSwipeHandler 中,便于维护和扩展。

  • 复用性强CellSwipeHandler 可以在任何 cell 中使用,支持多种业务场景。