iOS開發UI篇—Quartz2D簡單使用（三）
一、通過slider控制圓的縮放
1.實現過程
新建一個項目，新建一個繼承自UIview的類，並和storyboard中自定義的view進行關聯。
界面搭建，如圖：
代碼示例：
YYViewController.m文件
1 //
2 // YYViewController.m
3 // 04-對圓進行縮放
4 //
5 // Created by apple on 14-6-11.
6 // Copyright (c) 2014年 itcase. All rights reserved.
7 //
8
9 #import "YYViewController.h"
10 #import "YYview.h"
11
12 @interface YYViewController ()
13 @property (weak, nonatomic) IBOutlet YYview *circleView;
14 - (IBAction)valueChange:(UISlider *)sender;
15
16 @end
17
18 @implementation YYViewController
19
20 - (void)viewDidLoad
21 {
22 [super viewDidLoad];
23 // Do any additional setup after loading the view, typically from a nib.
24 }
25
26
27 - (IBAction)valueChange:(UISlider *)sender {
28 //當值改變的時候，把值傳遞給view,改變圓的半徑
29 NSLog(@"%f",sender.value);
30 //把sender的值傳遞給自定義view，設置圓的半徑
31 self.circleView.radius=sender.value;
32 }
33 @endYYview.h文件
1 // 2 // YYview.h 3 // 04-對圓進行縮放 4 // 5 // Created by apple on 14-6-11. 6 // Copyright (c) 2014年 itcase. All rights reserved. 7 // 8 9 #import <UIKit/UIKit.h> 10 11 @interface YYview : UIView 12 //提供一個屬性來接收外界傳入的半徑 13 @property(nonatomic,assign)float radius; 14 @end
YYview.m文件
1 //
2 // YYview.m
3 // 04-對圓進行縮放
4 //
5 // Created by apple on 14-6-11.
6 // Copyright (c) 2014年 itcase. All rights reserved.
7 //
8
9 #import "YYview.h"
10
11 @implementation YYview
12 //自定義view中的圓不顯示
13 //重寫set方法，為半徑賦值
14 -(void)setRadius:(float)radius
15 {
16 _radius=radius;
17 //通知自定義的view重新繪制圖形
18 [self setNeedsDisplay];
19 }
20
21 //如果view是從xib或storyboard中創建出來的會先調用awakefromnib方法
22 - (void)awakeFromNib
23 {
24 //在這裏為圓的半徑設定一個初始的值
25 self.radius = 20;
26 }
27
28 - (void)drawRect:(CGRect)rect
29 {
30 //1.獲取圖形上下文
31 CGContextRef ctx=UIGraphicsGetCurrentContext();
32 //2.繪圖
33 //在自定義的view中畫一個圓
34 CGContextAddArc(ctx, 100, 100, self.radius, 0, 2*M_PI, 0);
35 //設置圓的填充顏色
36 [[UIColor grayColor]set];
37
38 //3.渲染
39 // CGContextStrokePath(ctx);
40 CGContextFillPath(ctx);
41 }
42
43
44 @end效果：
2.註意點：
drawRect:方法不能由我們自己手動調用，只能由系統來調用。
drawRect:調用的時機：當第一次顯示或者一個重繪事件發生時調用。
setNeedsDisplay方法：重新繪制，調用這個方法就會通知自定義的view重新繪制畫面，調用drawRect:。
提示：當一個view從xib或storyboard創建出來時，會調用awakefromnib方法。
3.補充
可以通過slider的value屬性監聽值的改變，當然也可以指定value的取值範圍（這裏設定為0~100）。
二、刷幀效果
說明：把雪花狀的圖片繪制到view上，實現圖片在視圖中下落的效果。
1.實現代碼：
1 //
2 // YYview.m
3 // 05-刷幀動畫
4 //
5 // Created by apple on 14-6-11.
6 // Copyright (c) 2014年 itcase. All rights reserved.
7 //
8
9 #import "YYview.h"
10
11 //私有擴展
12 @interface YYview ()
13 @property(nonatomic,assign)float imageY;
14
15 @end
16 @implementation YYview
17
18
19 -(id)initWithCoder:(NSCoder *)aDecoder
20 {
21 //請註意這裏一定要先初始化父類的構造方法
22 if (self=[super initWithCoder:aDecoder]) {
23 NSLog(@"initWithCoder:");
24
25 //NSTimer一般用於定時的更新一些非界面上的數據,告訴多久調用一次
26 //使用定時器,使用該定時器會出現卡頓的現象
27 // [NSTimer scheduledTimerWithTimeInterval:0.1 target:self selector:@selector(updateImage) userInfo:nil repeats:YES];
28
29 // CADisplayLink刷幀，默認每秒刷新60次
30 //該定時器創建之後，默認是不會執行的，需要把它加載到消息循環中
31 CADisplayLink *display= [CADisplayLink displayLinkWithTarget:self selector:@selector(updateImage)];
32 [display addToRunLoop:[NSRunLoop mainRunLoop] forMode:NSDefaultRunLoopMode];
33
34 }
35 return self;
36 }
37
38 -(void)updateImage
39 {
40 //調用該方法重繪畫面
41 [self setNeedsDisplay];
42 }
43 -(void)awakeFromNib
44 {
45 NSLog(@"awakeFromNib");
46 }
47
48 - (void)drawRect:(CGRect)rect
49 {
50 //把圖片繪制到view上
51
52 //每次調用該方法對畫面進行重繪時，imageY的值就+5
53 self.imageY+=5;
54 //判斷，當雪花超出屏幕的時候，讓圖片從頭開始降落
55 if (self.imageY>rect.size.height) {
56 self.imageY=0;
57 }
58 UIImage *image=[UIImage imageNamed:@"snow"];
59 [image drawAtPoint:CGPointMake(0, self.imageY)];
60
61 UIImage *image2=[UIImage imageNamed:@"me"];
62 [image2 drawAtPoint:CGPointMake(80, self.imageY)];
63
64 }
65
66 @end
實現效果
2.重要說明
（1）下面兩個方法的調用順序
-(void)awakeFromNib
-(id)initWithCoder:(NSCoder *)aDecoder
提示：如果view是從xib或storyboard中創建可以調用awakefromnib方法，歸檔。從文件創建view，其實會先調用initwithcoder這個方法。xib和storyboard也是文件。
上面兩個方法，-(id)initWithCoder:(NSCoder *)aDecoder會先調用。實現該方法需要實現NSCoding協議，由於創建的UIView默認就已經實現了該協議。
可以進入到頭文件查看：
運行新建的程序，通過打印可以驗證上面兩個方法的調用順序。
（2）兩個定時器
第一個：
[NSTimer scheduledTimerWithTimeInterval:0.1 target:self selector:@selector(updateImage) userInfo:nil repeats:YES];
說明： NSTimer一般用於定時的更新一些非界面上的數據,告訴多久調用一次
第二個：
CADisplayLink *display= [CADisplayLink displayLinkWithTarget:selfselector:@selector(updateImage)];
[display addToRunLoop:[NSRunLoopmainRunLoop] forMode:NSDefaultRunLoopMode];
說明： CADisplayLink刷幀，默認每秒刷新60次。該定時器創建之後，默認是不會執行的，需要把它加載到消息循環中
iOS開發UI篇—Quartz2D簡單使用（三）