iOS实现转盘效果

时间:2022-09-07 20:20:54

本文实例为大家分享了ios实现转盘效果的具体代码,供大家参考,具体内容如下

demo下载地址: ios转盘效果

功能:实现了常用的ios转盘效果,轮盘抽奖效果的实现,转盘可以暂停,旋转,已经快速旋转抽奖,选中的效果指向正上方。

效果图:

iOS实现转盘效果

工程文件目录:

iOS实现转盘效果

核心代码:

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
//
// viewcontroller.m
// 转盘效果
//
// created by llkj on 2017/8/31.
// copyright © 2017年 laynecheung. all rights reserved.
//
 
#import "viewcontroller.h"
#import "wheelview.h"
 
@interface viewcontroller ()
 
@property (nonatomic, weak) wheelview *wheelv;
@end
 
@implementation viewcontroller
 
- (void)viewdidload {
 [super viewdidload];
 
 wheelview *wheelv = [wheelview wheelview];
 wheelv.center = self.view.center;
 self.wheelv = wheelv;
 [self.view addsubview:wheelv];
 
 
}
 
- (ibaction)rotation:(id)sender {
 [self.wheelv rotation];
}
 
- (ibaction)stop:(id)sender {
 [self.wheelv stop];
}
 
- (void)didreceivememorywarning {
 [super didreceivememorywarning];
 // dispose of any resources that can be recreated.
}
 
 
@end

wheelview文件

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
//
// wheelview.h
// 转盘效果
//
// created by llkj on 2017/8/31.
// copyright © 2017年 laynecheung. all rights reserved.
//
 
#import <uikit/uikit.h>
 
@interface wheelview : uiview
 
+ (instancetype)wheelview;
 
- (void)rotation;
- (void)stop;
@end
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
//
// wheelview.m
// 转盘效果
//
// created by llkj on 2017/8/31.
// copyright © 2017年 laynecheung. all rights reserved.
//
 
#import "wheelview.h"
#import "wheelbtn.h"
 
#define angle2rad(angle) ((angle) / 180.0 * m_pi)
 
@interface wheelview ()<caanimationdelegate>
@property (weak, nonatomic) iboutlet uiimageview *contentv;
 
@property (nonatomic, weak) uibutton *selectbtn;
 
@property (nonatomic, strong) cadisplaylink *link;
@end
 
@implementation wheelview
 
- (cadisplaylink *)link {
 
 if (_link == nil) {
 cadisplaylink *link = [cadisplaylink displaylinkwithtarget:self selector:@selector(update)];
 [link addtorunloop:[nsrunloop mainrunloop] formode:nsdefaultrunloopmode];
 _link = link;
 }
 return _link;
}
+ (instancetype)wheelview {
 
 return [[[nsbundle mainbundle] loadnibnamed:@"wheelview" owner:nil options:nil] lastobject];
}
 
 
- (instancetype)initwithframe:(cgrect)frame
{
 self = [super initwithframe:frame];
 if (self) {
 self = [[[nsbundle mainbundle] loadnibnamed:@"wheelview" owner:nil options:nil] lastobject];
 }
 return self;
}
 
- (void)awakefromnib {
 [super awakefromnib];
 
 cgfloat btnw = 68;
 cgfloat btnh = 143;
 cgfloat angle = 0;
 
 //加载原始大图片
 uiimage *oriimage = [uiimage imagenamed:@"luckyastrology"];
 //加载原始选中的大图片
 uiimage *oriselimg = [uiimage imagenamed:@"luckyastrologypressed"];
 
 cgfloat x = 0;
 cgfloat y = 0;
 cgfloat sacle = [uiscreen mainscreen].scale;
 cgfloat clipw = oriimage.size.width / 12.0 * sacle;
 cgfloat cliph = oriimage.size.height * sacle;
 
 for (int i = 0; i < 12; i ++) {
 
 wheelbtn *btn = [wheelbtn buttonwithtype:uibuttontypecustom];
 btn.bounds = cgrectmake(0, 0, btnw, btnh);
 
 //按钮正常状态图片
 x = i * clipw;
 //给定一张图片截取指定区域内的图片
 cgimageref clipimg = cgimagecreatewithimageinrect(oriimage.cgimage, cgrectmake(x, y, clipw, cliph));
 [btn setimage:[uiimage imagewithcgimage:clipimg] forstate:uicontrolstatenormal];
 
 //按钮选中状态图片
 cgimageref clipselimg = cgimagecreatewithimageinrect(oriselimg.cgimage, cgrectmake(x, y, clipw, cliph));
 [btn setimage:[uiimage imagewithcgimage:clipselimg] forstate:uicontrolstateselected];
 
 [btn setbackgroundimage:[uiimage imagenamed:@"luckyrototeselected"] forstate:uicontrolstateselected];
 btn.layer.anchorpoint = cgpointmake(0.5, 1);
 btn.layer.position = cgpointmake(self.bounds.size.width * 0.5, self.bounds.size.height * 0.5);
 
 btn.transform = cgaffinetransformmakerotation(angle2rad(angle));
 angle += 30;
 
 [btn addtarget:self action:@selector(btnclick:) forcontrolevents:uicontroleventtouchupinside];
 [self.contentv addsubview:btn];
 
 //默认第一个按钮选中
 if (i == 0) {
  [self btnclick:btn];
 }
 }
}
 
- (void)btnclick:(uibutton *)btn {
 
 //1.让当前选中的按钮取消选中
 self.selectbtn.selected = no;
 //2.让当前点击的按钮成为选中状态
 btn.selected = yes;
 //3.当前点击的按钮成为选中状态
 self.selectbtn = btn;
 
 
}
- (void)rotation {
 
 self.link.paused = no;
}
 
- (void)stop {
 
 self.link.paused = yes;
}
 
- (void)update {
 
 self.contentv.transform = cgaffinetransformrotate(self.contentv.transform, m_pi / 300.0);
 
}
 
- (ibaction)start:(id)sender {
 
 //快速转几圈
 cabasicanimation *anim = [cabasicanimation animation];
 anim.keypath = @"transform.rotation";
 anim.tovalue = @(m_pi * 4);
 anim.duration = 0.5;
 anim.repeatcount = 1;
 anim.delegate = self;
 [self.contentv.layer addanimation:anim forkey:nil];
 
}
 
- (void)animationdidstop:(caanimation *)anim finished:(bool)flag {
 
 cgaffinetransform transform = self.selectbtn.transform;
 //获取当前选中按钮的旋转角度
 cgfloat angle = atan2(transform.b, transform.a);
 
 //动画结束时当前选中的按钮指向最上方
 self.contentv.transform = cgaffinetransformmakerotation(-angle);
}
 
@end

wheelbtn.m

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
//
// wheelbtn.m
// 转盘效果
//
// created by llkj on 2017/8/31.
// copyright © 2017年 laynecheung. all rights reserved.
//
 
#import "wheelbtn.h"
 
@implementation wheelbtn
 
- (uiview *)hittest:(cgpoint)point withevent:(uievent *)event {
 
 cgrect rect = cgrectmake(0, 0, self.bounds.size.width, self.bounds.size.height * 0.5);
 
 if (cgrectcontainspoint(rect, point)) {
 // 在指定的范围内
 return [super hittest:point withevent:event];
 } else {
 return nil;
 }
}
//取消按钮高亮状态做的事
- (void)sethighlighted:(bool)highlighted {
 
 
}
 
//返回当前按钮中的image位置和尺寸
- (cgrect)imagerectforcontentrect:(cgrect)contentrect {
 
 return cgrectmake((contentrect.size.width - 40) *0.5, 20, 40, 48);
}
 
//返回当前按钮中的label位置和尺寸
//- (cgrect)titlerectforcontentrect:(cgrect)contentrect{
//
//}
@end

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持服务器之家。

原文链接:https://blog.csdn.net/u010981736/article/details/77747555