转盘功能的详细实现

最新推荐文章于 2022-10-17 17:40:30 发布

ITcontend

最新推荐文章于 2022-10-17 17:40:30 发布

阅读量1.6k

点赞数

CC 4.0 BY-SA版权

分类专栏： Object-C 文章标签：转盘功能的详细实现

本文链接：https://blog.youkuaiyun.com/ITcontend/article/details/41700183

Object-C 专栏收录该内容

31 篇文章

订阅专栏

本文介绍了一种自定义转盘视图的方法，包括XIB文件的使用、按钮的添加及布局、按钮点击事件监听、定时器的定义、开始选号功能的实现等关键步骤。

转盘功能的详细实现

一、自定义转盘XIB

+ (instancetype)wheelView
{
return [[NSBundle mainBundle] loadNibNamed:@"HMWheelView" owner:nil options:nil][0];
}

二、添加按钮

#warning 添加按钮
- (void)awakeFromNib
{

// 加载完XIB就开始启动转盘

self.link.paused = NO;
    _rotationView.userInteractionEnabled = YES;

    // 裁剪的大图片
    UIImage *bigImage = [UIImage imageNamed:@"LuckyAstrology"];
    UIImage *selectedImage = [UIImage imageNamed:@"LuckyAstrologyPressed"];

    // 图片的尺寸
    CGFloat imageW = 40 * [UIScreen mainScreen].scale;
    CGFloat imageH = 47 * [UIScreen mainScreen].scale;

    for (int i = 0; i < 12; i++) {
        // 创建按钮
        HMWheelButton *button = [HMWheelButton buttonWithType:UIButtonTypeCustom];

        // 锚点
        button.layer.anchorPoint = CGPointMake(0.5, 1);
        // 位置
        button.layer.position = CGPointMake(self.bounds.size.width * 0.5, self.bounds.size.height * 0.5);

        // 旋转按钮
        button.layer.transform = CATransform3DMakeRotation(angle2radian(i * 30), 0, 0, 1);

        // 尺寸
        button.bounds = CGRectMake(0, 0, 68, 143);

        // 设置选中时候的背景图片
        [button setBackgroundImage:[UIImage imageNamed:@"LuckyRototeSelected"] forState:UIControlStateSelected];

        // 设置按钮的图片
        // image:裁剪的图片
        // rect:裁剪的尺寸
       CGRect clipRect = CGRectMake(i * imageW, 0, imageW, imageH);
       CGImageRef smallImage = CGImageCreateWithImageInRect(bigImage.CGImage, clipRect);
        [button setImage:[UIImage imageWithCGImage:smallImage] forState:UIControlStateNormal];

        // 设置选中的图片
        CGImageRef selectedSmallImage = CGImageCreateWithImageInRect(selectedImage.CGImage, clipRect);
        [button setImage:[UIImage imageWithCGImage:selectedSmallImage] forState:UIControlStateSelected];

        // 监听点击事件
        [button addTarget:self action:@selector(btnClick:) forControlEvents:UIControlEventTouchDown];

// 默认选中第一个
        if (i == 0) {
            [self btnClick:button];
        }
        [_rotationView addSubview:button];
    }
}

三、实现监听方法

#warning 监听按钮点击
- (void)btnClick:(UIButton *)button
{
    _selectedButton.selected = NO;
    button.selected = YES;
    _selectedButton = button;
}

四、定义定时器

- (CADisplayLink *)link
{

    if (_link == nil) {
        CADisplayLink *link = [CADisplayLink displayLinkWithTarget:self selector:@selector(update)];
        [link addToRunLoop:[NSRunLoop mainRunLoop] forMode:NSDefaultRunLoopMode];
        _link = link;
    }
    return _link;
}
- (void)update
{
    _rotationView.transform = CGAffineTransformRotate(_rotationView.transform, ((45 / 60.0) / 180.0 * M_PI));

}

五、实现开始选号功能

- (IBAction)start:(id)sender {

    // 1.不要和用户交互
    _rotationView.userInteractionEnabled = NO;
    // 2.取消慢慢的旋转
   _link.paused = YES;

    CABasicAnimation *anim = [CABasicAnimation animation];

    anim.keyPath = @"transform.rotation";

    anim.toValue = @(M_PI * 2 * 3);

    anim.duration = 0.5;

    anim.delegate = self;

    [_rotationView.layer addAnimation:anim forKey:nil];
}

六、实现 CAAnimationDelegate的代理方法
- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag
{
    _rotationView.userInteractionEnabled = YES;

    // 让选中按钮回到最在上面的中间位置:
    CGFloat angle = atan2(_selectedButton.transform.b, _selectedButton.transform.a);

    // 把我们的转盘反向旋转这么多°
    _rotationView.transform = CGAffineTransformMakeRotation(-angle);

    dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(2 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
        [self startRotating];
    });
}