【yzc555亚洲城】[iOS UI进阶,iosui进阶

[iOS UI进阶,iosui进阶

A.需求

  • 有幸广场分界面中有二个侥幸转盘,日常能够活动缓缓转动
  • 可见选择星座
  • 点击“开端选号”开速旋转转盘,旋转一定周数
  • 转盘转动速度节奏:开首-慢-块-慢-甘休
  • 设置任何的背景和开关

  code source: 彩票Demo
转盘Demo     1 –
(void)awakeFromNib { 2 //
由于按键是要作为“转盘”控件的子控件,所感觉了能够传递点击事件,要先展开“转盘”(UIImageView)的竞相作用3 self.luckyWheel.userInteractionEnabled = YES; 4 5 // 增添12个星座按钮6 for (int i=0; i<12; i++) { 7 8 // 加多按键 9 HVWLuckyWheelButton
*button = [[HVWLuckyWheelButton alloc] init]; 10
button.backgroundColor = [UIColor redColor]; 11 12 // 设置开关尺寸 13
button.bounds = CGRectMake(0, 0, 68, 143); 14 //
设置按键锚点,用于布满环形10个开关 15 button.layer.anchorPoint =
CGPointMake(0.5, 1); 16 // 一时把富有按键都放在12点地点 17
button.layer.position = CGPointMake(self.center.x, self.center.y); 18 19
[self.luckyWheel addSubview:button]; 20 } 21 }   1 //
环形布满12个星座开关,围绕着锚点旋转 2 button.transform =
CGAffineTransformMakeRotation(M_PI/6 * i);   1 – (void)awakeFromNib {
2 //
由于开关是要作为“转盘”控件的子控件,所认为了能够传递点击事件,要先展开“转盘”(UIImageView)的互动作用3 self.luckyWheel.userInteractionEnabled = YES; 4 5 // 增添拾个星座按钮6 for (int i=0; i<12; i++) { 7 8 // 增添按键 9 HVWLuckyWheelButton
*button = [[HVWLuckyWheelButton alloc] init]; 10
button.backgroundColor = [UIColor redColor]; 11 12 // 设置开关尺寸 13
button.bounds = CGRectMake(0, 0, 68, 143); 14 //
设置开关锚点,用于布满环形10个开关 15 button.layer.anchorPoint =
CGPointMake(0.5, 1); 16 // 一时半刻把具备按键都位于12点地方 17
button.layer.position = CGPointMake(self.center.x, self.center.y); 18 1920 // 收获星座图片总图 21 UIImage *sumImage = [UIImage
imageNamed:@”LuckyAstrology”]; 22 UIImage *sumImageSelected =
[UIImage imageNamed:@”LuckyAstrologyPressed”]; 23 24 //
使用CoreGraphic分割图片,获得独立的星座小图 25 //
这里图片的大小是提须要CGImageCreateWithImageInRect裁剪图片用的,所以要把单位从pt调换来px
26 // 依据显示屏的分辨率来分辨系统是或不是使用了@2x图片 27 CGFloat
conImageWidth = sumImage.size.width / 12 * [UIScreen
mainScreen].scale; 28 CGFloat conImageHeight = sumImage.size.height *
[UIScreen mainScreen].scale; 29 CGFloat conImageX = i *
conImageWidth; 30 CGFloat conImageY = 0; 31 32 //
CGImage是用像素px来衡量的,不是点pt,所以无法自动识别普通图片和@2x图片
33 UIImage *【yzc555亚洲城】[iOS UI进阶,iosui进阶。conImage = [UIImage
imageWithCGImage:CGImageCreateWithImageInRect(sumImage.CGImage,
CGRectMake(conImageX, conImageY, conImageWidth, conImageHeight))]; 34
35 UIImage *conImageSelected = [UIImage
imageWithCGImage:CGImageCreateWithImageInRect(sumImageSelected.CGImage,
CGRectMake(conImageX, conImageY, conImageWidth, conImageHeight))]; 36
37 // 设置按键图片 38 [button setImage:conImage
forState:UIControlStateNormal]; 39 [button setImage:conImageSelected
forState:UIControlStateSelected]; 40 [button
setBackgroundImage:[UIImage imageNamed:@”LuckyRototeSelected”]
forState:UIControlStateSelected]; 41 42 // 开关点击事件 43 [button
addTarget:self action:@selector(conButtonClicked:)
forControlEvents:UIControlEventTouchDown]; 44 45 //
环形布满11个星座按键,围绕着锚点旋转 46 button.transform =
CGAffineTransformMakeRotation(M_PI/6 * i); 47 48 // 私下认可选中第三个开关49 if (0 == i) { 50 [self conButtonClicked:button]; 51 } 52 53
[self.luckyWheel addSubview:button]; 54 } 55 } 56 57 /**
星座开关点击事件 */ 58 – (void) conButtonClicked:(UIButton *) button {
59 self.selectedLuckyWheelButton.selected = NO; 60 button.selected =
YES; 61 self.selectedLuckyWheelButton = button; 62 }   1 // 2 //
HVWLuckyWheelButton.m 3 // LotteryLuckyWheel 4 // 5 // Created by
hellovoidworld on 15/1/16. 6 // Copyright (c) 2015年 hellovoidworld. All
rights reserved. 7 // 8 9 #import “HVWLuckyWheelButton.h” 10 11
@implementation HVWLuckyWheelButton 12 13 /**
按键前景图image的地方尺寸初步化 */ 14 –
(CGRect)imageRectForContentRect:(CGRect)contentRect { 15 CGFloat width =
40; 16 CGFloat height = 47; 17 18 //
这里料定要用contentRect来获取开关的尺码,不可能运用self.frame 19 CGFloat x
= (contentRect.size.width – width)/2; 20 21 CGFloat y = 30; 22 return
CGRectMake(x, y, width, height); 23 } 24 25 /** 撤消选中功用 */ 26 –
(void)setHighlighted:(BOOL)highlighted { 27 // 置空 28 } 29 30 @end   1
/** 初步转盘旋转 */ 2 – (void) startRotate { 3 if (self.displayLink)
return; 4 5 // 成立循环刷新事件 6 CADisplayLink *link = [CADisplayLink
displayLinkWithTarget:self selector:@selector(luckyWheelRotate)]; 7
self.displayLink = link; 8 9 // 参加到主循环 10 [link
addToRunLoop:[NSRunLoop mainRunLoop] forMode:NSDefaultRunLoopMode];
11 } 12 13 /** 转盘旋转完结格局 */ 14 – (void) luckyWheelRotate { 15
self.luckyWheel.transform =
CGAffineTransformRotate(self.luckyWheel.transform, M_PI_4 / 100); 16 }
17 18 /** 截至转盘旋转 */ 19 – (void) stopRotate { 20
[self.displayLink invalidate]; 21 self.displayLink = nil; 22 }   1
/** 初始选号 2 *
因为点击“开头选号”之后仅播放动画,不用设计互动操作,所以可以用CALayer动画来达成3 */ 4 – (IBAction)startChoose { 5 // 禁止再一次点击 6
self.startChooseButton.userInteractionEnabled = NO; 7 8 //
先截至原本的轮盘转动 9 [self stopRotate]; 10 11 // 甘休轮盘的交互作用12 self.luckyWheel.userInteractionEnabled = NO; 13 14 CABasicAnimation
*anim = [[CABasicAnimation alloc] init]; 15 anim.keyPath =
@”transform.rotation”; 16 17 //
选择反余弦函数和矩阵换算总括出转盘以后的团团转角度 18 CGFloat wheelRoate =
acosf(self.luckyWheel.transform.a); 19 if (self.luckyWheel.transform.b
< 0) { // 超越180°的情事 20 wheelRoate = M_PI * 2 – wheelRoate; 21
} 22 23 // 狂转3周,回到原本的岗位 24 anim.toValue = @(wheelRoate +
M_PI * 2 * 3); 25 anim.duration = 2.0; 26 27 // 装置代理 28
anim.delegate = self; 29 30 //使用慢进慢出的卡通片节奏 31
anim.timingFunction = [CAMediaTimingFunction
functionWithName:kCAMediaTimingFunctionEaseInEaseOut]; 32 33
[self.luckyWheel.layer addAnimation:anim forKey:nil]; 34 } 35 36 /**
CALayer动画结束以后 */ 37 – (void)animationDidStop:(CAAnimation *)anim
finished:(BOOL)flag { 38 // 回复轮盘的竞相功能 39
self.luckyWheel.userInteractionEnabled = YES; 40 41
dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(2.0 *
NSEC_PER_SEC)), dispatch_get_main_queue(), ^{ 42 //
稍后恢复生机轮盘自动转动 43 [self startRotate]; 44 45 //
苏醒“开首选号”按键点击 46 self.startChooseButton.userInteractionEnabled
= YES; 47 }); 48 }   1 // 2 // HVWLuckyViewController.m 3 //
HelloLottery 4 // 5 // Created by hellovoidworld on 15/1/16. 6 //
Copyright (c) 二零一六年 hellovoidworld. All rights reserved. 7 // 8 9
#import “HVWLuckyViewController.h” 10 #import “HVWLuckyWheel.h” 11 12
@interface HVWLuckyViewController () 13 14 @end 15 16 @implementation
HVWLuckyViewController 17 18 – (void)viewDidLoad { 19 [super
viewDidLoad]; 20 // Do any additional setup after loading the view. 21
22 [self setEdgesForExtendedLayout:UIRectEdgeNone]; 23 24 // 加载背景
25 // 由于是jpg格式,无法选取imageNamed在iameges.xcassets中查找 26
NSString *imagePath = [[NSBundle mainBundle]
pathForResource:@”LuckyBackground” ofType:@”jpg”]; 27 [self.view
setBackgroundColor:[UIColor colorWithPatternImage:[UIImage
imageWithContentsOfFile:imagePath]]]; 28 29 // 加载转盘 30
HVWLuckyWheel *luckyWheel = [HVWLuckyWheel hvwLuckyWheel]; 31
luckyWheel.center = CGPointMake(self.view.frame.size.width/2, 220); 32
[luckyWheel startRotate]; 33 34 [self.view addSubview:luckyWheel];
35 } 36 37 – (void)didReceiveMemoryWarning { 38 [super
didReceiveMemoryWarning]; 39 // Dispose of any resources that can be
recreated. 40 } 41 42 /* 43 #pragma mark – Navigation 44 45 // In a
storyboard-based application, you will often want to do a little
preparation before navigation 46 –
(void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender { 47
// Get the new view controller using [segue
destinationViewController]. 48 // Pass the selected object to the new
view controller. 49 } 50 */ 51 52 @end  
yzc555亚洲城 1  
注意:此画面撤销了view扩充,所以view的大大小小正是高级中学级可知部分,不含导航栏和状态栏。
yzc555亚洲城 2      

UI进级,iosui进级 A.须要幸运广场分界面中有三个幸运营盘,平时亦可自动缓缓转动 能够挑选星座
点击起首选号开速旋转转盘,旋转一定…