iOS開發實現轉盤功能
阿新 • • 發佈：2020-04-20
本文例項為大家分享了iOS實現轉盤功能的具體程式碼，供大家參考，具體內容如下
今天給同學們講解一下一個轉盤選號的功能，直接上程式碼直接看
ViewController
#pragma mark - 如果要旋轉那就第一考慮錨點 核心動畫看到的都是假象 真實的位置並沒有發生改變
//
// ViewController.m
// 5-網易轉盤的實現
//
// Created by Jordan zhou on 2018/10/10.
// Copyright © 2018年 Jordan zhou. All rights reserved.
//
#import "ViewController.h"
#import "ZZWheelView.h"
@interface ViewController ()
/** 展示的view */
@property (nonatomic,strong) ZZWheelView *wheelView;
@end
@implementation ViewController
- (IBAction)start:(id)sender {
[self.wheelView start];
}
- (IBAction)stop:(id)sender {
[self.wheelView pause];
}
#pragma mark - 懶載入
- (ZZWheelView *)wheelView
{
if (!_wheelView) {
_wheelView = [ZZWheelView wheelView];
_wheelView.center = self.view.center;
}
return _wheelView;
}
- (void)viewDidLoad {
[super viewDidLoad];
[self.view addSubview:self.wheelView];
}
@endZZWheelView
//
// ZZWheelView.h
// 5-網易轉盤的實現
//
// Created by Jordan zhou on 2018/10/10.
// Copyright © 2018年 Jordan zhou. All rights reserved.
//
#import <UIKit/UIKit.h>
@interface ZZWheelView : UIView
+ (instancetype)wheelView;
- (void)start;
- (void)pause;
@end
// ZZWheelView.m
// 5-網易轉盤的實現
//
// Created by Jordan zhou on 2018/10/10.
// Copyright © 2018年 Jordan zhou. All rights reserved.
//
#import "ZZWheelView.h"
#import "ZZWheelButton.h"
@interface ZZWheelView()<CAAnimationDelegate>
@property (weak,nonatomic) IBOutlet UIImageView *centerView;
@property (nonatomic,weak) UIButton *selBtn;
@property (nonatomic,strong) CADisplayLink *link;
@end
@implementation ZZWheelView
#pragma mark - 懶載入
- (CADisplayLink *)link
{
if (_link == nil) {
_link = [CADisplayLink displayLinkWithTarget:self selector:@selector(angleChange)];
[_link addToRunLoop:[NSRunLoop mainRunLoop] forMode:NSDefaultRunLoopMode];
}
return _link;
}
+ (instancetype)wheelView
{
return [[NSBundle mainBundle] loadNibNamed:@"ZZWheelView" owner:nil options:nil][0];
}
#warning - 注意這個方法只是載入xib的時候會呼叫，但是並沒有連好線
//- (instancetype)initWithCoder:(NSCoder *)aDecoder
//{
// if (self = [super initWithCoder:aDecoder]) {
// NSLog(@"-%@",_centerView);
// }
// return self;
//}
- (void)awakeFromNib
{
[super 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++) {
ZZWheelButton *btn = [ZZWheelButton buttonWithType:UIButtonTypeCustom];
// 設定按鈕的位置
btn.layer.anchorPoint = CGPointMake(0.5,1);
btn.bounds = CGRectMake(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,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
{
self.link.paused = NO;
}
// 1.搞個定時器，每隔一段時間就旋轉一定的角度，1秒旋轉45°
#pragma mark - 暫停旋轉
- (void)pause
{
self.link.paused = YES;
}
#pragma mark - 每隔一段時間旋轉一定的角度
- (void)angleChange
{
// 每一次呼叫旋轉多少 45 \ 60.0
CGFloat angle = (45 / 60.0) * M_PI / 180.0;
_centerView.transform = CGAffineTransformRotate(_centerView.transform,angle);
}
#pragma mark - 點選開始選號的時候
- (IBAction)startPicker:(id)sender {
// 不需要定時器旋轉
self.link.paused = YES;
// 中間的轉盤快速的旋轉，並且不需要與使用者互動
CABasicAnimation *anim = [CABasicAnimation animation];
anim.keyPath = @"transform.rotation";
anim.toValue = @(M_PI * 2 * 3);
anim.duration = 0.5;
anim.delegate = self;
[_centerView.layer addAnimation:anim forKey:nil];
// 點選哪個星座，就把當前星座指向中心點上面
// M_PI 3.14
// 根據選中的按鈕獲取旋轉的度數,// 通過transform獲取角度
CGFloat angle = atan2(_selBtn.transform.b,_selBtn.transform.a);
// 旋轉轉盤
_centerView.transform = CGAffineTransformMakeRotation(-angle);
}
- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag
{
dispatch_after(dispatch_time(DISPATCH_TIME_NOW,(int64_t)(1 * NSEC_PER_SEC)),dispatch_get_main_queue(),^{
self.link.paused = NO;
});
}
@endZZWheelButton
//
// ZZWheelButton.m
// 5-網易轉盤的實現
//
// Created by Jordan zhou on 2018/10/10.
// Copyright © 2018年 Jordan zhou. All rights reserved.
//
#import "ZZWheelButton.h"
@implementation ZZWheelButton
// 尋找最合適的view
- (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event
{
CGFloat btnW = self.bounds.size.width;
CGFloat btnH = self.bounds.size.height;
CGFloat x = 0;
CGFloat y = btnH / 2;
CGFloat w = btnW;
CGFloat h = y;
CGRect rect = CGRectMake(x,y,w,h);
if (CGRectContainsPoint(rect,point)) {
return nil;
}else{
return [super hitTest:point withEvent:event];
}
}
// 設定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,imageH);
}
// 取消高亮狀態
- (void)setHighlighted:(BOOL)highlighted{}
@end以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支援我們。