当前位置: 萬仟网 > 移动技术>移动开发>IOS > iOS实现转盘效果

iOS实现转盘效果

2020年06月23日  | 萬仟网移动技术  | 我要评论

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

demo下载地址: ios转盘效果

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

效果图:

工程文件目录:

核心代码:

//
// 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文件

//
// 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
//
// 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

//
// 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

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

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
Copyright © 2017-2020  萬仟网 保留所有权利. 粤ICP备17035492号-1
站长QQ:2386932994 | 联系邮箱:2386932994@qq.com