iOS开发实现转盘功能

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

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

今天给同学们讲解一下一个转盘选号的功能,直接上代码直接看

iOS开发实现转盘功能

viewcontroller

?
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
#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];
}
@end

zzwheelview

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
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
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
//
// 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, 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
{
 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;
 });
}
@end

zzwheelbutton

?
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
//
// 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, imagew, imageh);
}
 
// 取消高亮状态
- (void)sethighlighted:(bool)highlighted{}
@end

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

原文链接:https://blog.csdn.net/ZZ_IOSdeveloper/article/details/82998843