当前位置: 萬仟网 > IT编程>移动开发>IOS > iOS开发实现转盘功能

iOS开发实现转盘功能

2020年06月23日  | 萬仟网IT编程  | 我要评论

本文实例为大家分享了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];
}
@end

zzwheelview

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

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

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

如对本文有疑问,请在下面进行留言讨论,广大热心网友会与你互动!! 点击进行留言回复

相关文章:

  • ios uicollectionview实现横向滚动

    现在使用卡片效果的app很多,之前公司让实现一种卡片效果,就写了一篇关于实现卡片的文章。文章最后附有demo实现上我选择了使用uicollectionview ... [阅读全文]
  • iOS UICollectionView实现横向滑动

    本文实例为大家分享了ios uicollectionview实现横向滑动的具体代码,供大家参考,具体内容如下uicollectionview的横向滚动,目前我使... [阅读全文]
  • iOS13适配深色模式(Dark Mode)的实现

    iOS13适配深色模式(Dark Mode)的实现

    好像大概也许是一年前, mac os系统发布了深色模式外观, 看着挺刺激, 时至今日用着也还挺爽的终于, 随着iphone11等新手机的发售, ios 13系统... [阅读全文]
  • ios 使用xcode11 新建项目工程的步骤详解

    ios 使用xcode11 新建项目工程的步骤详解

    xcode11新建项目工程,新增了scenedelegate这个类,转而将原appdelegate负责的对ui生命周期的处理担子接了过来。故此可以理解为:ios... [阅读全文]
  • iOS实现转盘效果

    本文实例为大家分享了ios实现转盘效果的具体代码,供大家参考,具体内容如下demo下载地址: ios转盘效果功能:实现了常用的ios转盘效果,轮盘抽奖效果的实现... [阅读全文]
  • iOS开发实现转盘功能

    本文实例为大家分享了ios实现转盘功能的具体代码,供大家参考,具体内容如下今天给同学们讲解一下一个转盘选号的功能,直接上代码直接看viewcontroller#... [阅读全文]
  • iOS实现轮盘动态效果

    本文实例为大家分享了ios实现轮盘动态效果的具体代码,供大家参考,具体内容如下一个常用的绘图,主要用来打分之类的动画,效果如下。主要是ios的绘图和动画,本来想... [阅读全文]
  • iOS实现九宫格连线手势解锁

    本文实例为大家分享了ios实现九宫格连线手势解锁的具体代码,供大家参考,具体内容如下demo下载地址:效果图:核心代码://// clockview.m// 手... [阅读全文]
  • iOS实现卡片堆叠效果

    本文实例为大家分享了ios实现卡片堆叠效果的具体代码,供大家参考,具体内容如下如图,这就是最终效果。去年安卓5.0发布的时候,当我看到安卓全新的material... [阅读全文]
  • iOS利用余弦函数实现卡片浏览工具

    iOS利用余弦函数实现卡片浏览工具

    本文实例为大家分享了ios利用余弦函数实现卡片浏览工具的具体代码,供大家参考,具体内容如下一、实现效果通过拖拽屏幕实现卡片移动,左右两侧的卡片随着拖动变小,中间... [阅读全文]
验证码:
Copyright © 2020  萬仟网 保留所有权利. 粤ICP备17035492号-1
站长QQ:2386932994 | 联系邮箱:2386932994@qq.com