核心动画12-转盘(了解)

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了核心动画12-转盘(了解)相关的知识,希望对你有一定的参考价值。

 

 

//  WheelButton.m
//  12-转盘(了解)
#import "WheelButton.h"

@implementation WheelButton


// 设置UIImageView的尺寸
// contentRect:按钮的尺寸
- (CGRect)imageRectForContentRect:(CGRect)contentRect
{
    // 计算UIImageView控件尺寸
    CGFloat imageW = 40;
    CGFloat imageH = 46;
    CGFloat imageX = (contentRect.size.width - imageW) * 0.5;
    CGFloat imageY = 20;
    return CGRectMake(imageX, imageY, imageW, imageH);
}

// 取消高亮状态
- (void)setHighlighted:(BOOL)highlighted
{
    
}

@end

技术分享

//
//  WheelView.h
//  12-转盘(了解)

#import <UIKit/UIKit.h>

@interface WheelView : UIView

+ (instancetype)wheelView;

- (void)start;

- (void)pause;

@end
//
//  WheelView.m
//  12-转盘(了解)
#import "WheelView.h"
#import "WheelButton.h"

@interface WheelView ()

@property (weak, nonatomic) IBOutlet UIImageView *centerView;

@property (nonatomic, weak) UIButton *selBtn;


@end

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

// 注意这个方法只是加载xib的时候会调用,但是并没有连好线
//- (id)initWithCoder:(NSCoder *)aDecoder
//{
//    if (self = [super initWithCoder:aDecoder]) {
//        NSLog(@"-%@",_centerView);
//    }
//    return self;
//}

- (void)awakeFromNib
{
    _centerView.userInteractionEnabled = YES;
    CGFloat btnW = 68;
    CGFloat btnH = 143;
    
     CGFloat wh = self.bounds.size.width;
    
    // 加载大图片
    UIImage *bigImage = [UIImage imageNamed:@"LuckyAstrology"];
    
    
    // 加载大图片
    UIImage *selBigImage = [UIImage imageNamed:@"LuckyAstrologyPressed"];
    
    // 获取当前使用的图片像素和点的比例
    CGFloat scale = [UIScreen mainScreen].scale;
    CGFloat imageW = bigImage.size.width / 12 * scale;
    CGFloat imageH = bigImage.size.height * scale;
    // CGImageRef image:需要裁减的图片
    // rect:裁减区域
    // 裁减区域是以像素为基准
//    CGImageCreateWithImageInRect(CGImageRef image, CGRect rect)
    
    // 添加按钮
    for (int i = 0; i < 12; i++) {
        WheelButton *btn = [WheelButton buttonWithType:UIButtonTypeCustom];
        
        // 设置按钮的位置
        btn.layer.anchorPoint = CGPointMake(0.5, 1);
        
        btn.bounds = CGRectMake(0, 0, btnW, btnH);
        
        btn.layer.position = CGPointMake(wh * 0.5, wh * 0.5);
        
        
        // 按钮的旋转角度
        CGFloat radion = (30 * i) / 180.0 * M_PI;
        
        btn.transform = CGAffineTransformMakeRotation(radion);
        
        [_centerView addSubview:btn];
        
        // 加载按钮的图片
        // 计算裁减区域
        CGRect clipR = CGRectMake(i * imageW, 0, imageW, imageH);
        
        // 裁减图片
        CGImageRef imgR =  CGImageCreateWithImageInRect(bigImage.CGImage, clipR);
        
        UIImage *image = [UIImage imageWithCGImage:imgR];
        
        // 设置按钮的图片
        [btn setImage:image forState:UIControlStateNormal];
        
        // 设置选中状态下图片
        imgR = CGImageCreateWithImageInRect(selBigImage.CGImage, clipR);

        image = [UIImage imageWithCGImage:imgR];
        
        // 设置按钮的图片
        [btn setImage:image forState:UIControlStateSelected];
        
        // 设置选中背景图片
        [btn setBackgroundImage:[UIImage imageNamed:@"LuckyRototeSelected"] forState:UIControlStateSelected];
        
        // 监听按钮的点击
        [btn addTarget:self action:@selector(btnClick:) forControlEvents:UIControlEventTouchUpInside];
        
        // 默认选中第一个
        if (i == 0) {
            [self btnClick:btn];
        }
        
    
    }
}

- (void)btnClick:(UIButton *)btn
{
    _selBtn.selected = NO;
    btn.selected = YES;
    _selBtn = btn;
}

#pragma mark - 开始旋转
- (void)start
{
    CABasicAnimation *anim = [CABasicAnimation animation];
    
    anim.keyPath = @"transform.rotation";
    
    anim.toValue = @(M_PI * 2);
    
    anim.duration = 2;
    
    anim.repeatCount = MAXFLOAT;
    
    [_centerView.layer addAnimation:anim forKey:nil];
}

#pragma mark - 暂停旋转
- (void)pause
{
    
}

@end

 

以上是关于核心动画12-转盘(了解)的主要内容,如果未能解决你的问题,请参考以下文章

微信小程序-开心大转盘(圆盘指针)代码分析

objective-c 抽奖转盘(原创)

微信小程序项目实例——幸运大转盘

iOS 使用transform和CABasicAnimation实现视图围绕定点旋转和实现一个旋转的圆的动画 以转盘为例

Core Animation一些Demo总结 (动态切换图片大转盘图片折叠进度条等动画效果)

canvas一个简单粗暴的中奖转盘