Quartz2D(自定义UIImageView控件)
一、实现思路
Quartz2D最大的用途在于自定义View(自定义UI控件)，当系统的View不能满足我们使用需求的时候，自定义View。
使用Quartz2D自定义View，可以从模仿系统的ImageView的使用开始。
需求驱动开发：模仿系统的imageview的使用过程
1.创建
2.设置图片
3.设置frame
4.把创建的自定义的view添加到界面上（在自定义的View中，需要一个image属性接收image图片参数->5)。
5.添加一个image属性(接下来，拿到image之后，应该把拿到的这个image给渲染出来。怎么渲染？自定义的view怎么把图片显示出来？->把图片给画出来，所以需要重写自定义View的drawRect:方法)。
6.重写自定义View的drawRect:方法，在该方法内部画出图形。
二、代码实现
系统自带的ImageView的使用
#import "YYViewController.h"@interface YYViewController ()@end@implementation YYViewController- (void)viewDidLoad{ [super viewDidLoad]; //系统的UIImageview的使用// 1.创建一个UIImageView UIImageView *iv=[[UIImageView alloc]init];// 2.设置图片 iv.image=[UIImage imageNamed:@"me"];// 3.设置frame iv.frame=CGRectMake(100, 100, 100, 100);// 4.把创建的自定义的view添加到界面上 [self.view addSubview:iv];}@end 实现效果：
使用Quartz2D自定义View，代码如下：
新建一个自定义的类，让其继承自UIView,YYimageView.h文件代码如下：
8 9 #import10 11 @interface YYimageView : UIView12 @property(nonatomic,strong)UIImage *image;13 @end
在自定义类的实现中，重写DrawRect:方法绘制并渲染图形。YYimageView.m文件代码如下：
9 #import "YYimageView.h"10 11 @implementation YYimageView12 13 //重写drawRect:方法14 - (void)drawRect:(CGRect)rect15 {16 [self.image drawInRect:rect];17 }18 19 @end 在主控制器中，模仿系统自带的UIImageView的使用过程，实现同样的效果。
8 9 #import "YYViewController.h"10 #import "YYimageView.h"11 12 @interface YYViewController ()13 14 @end15 16 @implementation YYViewController17 18 - (void)viewDidLoad19 {20 [super viewDidLoad];21 22 // //系统的UIImageview的使用23 1.创建一个UIImageView24 // UIImageView *iv=[[UIImageView alloc]init];25 2.设置图片26 // iv.image=[UIImage imageNamed:@"me"];27 3.设置frame28 // iv.frame=CGRectMake(100, 100, 100, 100);29 4.把创建的自定义的view添加到界面上30 // [self.view addSubview:iv];31 32 33 //自定义UIImageView34 //1.创建35 //2.设置图片36 //3.设置frame37 //4.把创建的自定义的view添加到界面上38 YYimageView *yyiv=[[YYimageView alloc]init];39 yyiv.image=[UIImage imageNamed:@"me"];40 yyiv.frame=CGRectMake(100, 100, 100, 100);41 [self.view addSubview:yyiv];42 43 }44 @end 三、完善
存在的问题？
在界面上，添加一个按钮，要求点击按钮，能够实现图片的切换。
8 9 #import "YYViewController.h"10 #import "YYimageView.h"11 12 @interface YYViewController ()13 @property(nonatomic,strong)UIImageView *imageView;14 @end15 16 @implementation YYViewController17 18 - (void)viewDidLoad19 {20 [super viewDidLoad];21 22 //系统的UIImageview的使用23 // 1.创建一个UIImageView24 UIImageView *iv=[[UIImageView alloc]init];25 // 2.设置图片26 iv.image=[UIImage imageNamed:@"me"];27 // 3.设置frame28 iv.frame=CGRectMake(100, 100, 100, 100);29 // 4.把创建的自定义的view添加到界面上30 [self.view addSubview:iv];31 self.imageView=iv;32 33 34 //自定义UIImageView35 //1.创建36 //2.设置图片37 //3.设置frame38 //4.把创建的自定义的view添加到界面上39 // YYimageView *yyiv=[[YYimageView alloc]init];40 // yyiv.image=[UIImage imageNamed:@"me"];41 // yyiv.frame=CGRectMake(100, 100, 100, 100);42 // [self.view addSubview:yyiv];43 44 //添加一个button按钮，当点击button按钮的时候，切换图片45 UIButton *btn=[[UIButton alloc]initWithFrame:CGRectMake(100, 300, 100, 50)];46 [btn setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];47 [btn setTitle:@"点击切换" forState:UIControlStateNormal];48 [btn addTarget:self action:@selector(btnClick) forControlEvents:UIControlEventTouchUpInside];49 [self.view addSubview:btn];50 51 }52 53 -(void)btnClick54 {55 UIImage *image=[UIImage imageNamed:@"psb.jpeg"];56 self.imageView.image=image;57 }58 @end 点击按钮后，实现图片的切换。
说明：系统的UIimage可以替换。而自定义imageview不会变换，因为自定义的view要想换图片，需要重新绘制并渲染一次图片。所以在拿到替换图片的时候，需要重新绘制一次图片，重写setimage方法。
完善后的代码如下：
主控制器中，YYViewController.m文件的代码：
8 9 #import "YYViewController.h"10 #import "YYimageView.h"11 12 @interface YYViewController ()13 @property(nonatomic,strong)UIImageView *imageView;14 @property(nonatomic,strong)YYimageView *yyimageView;15 @end16 17 @implementation YYViewController18 19 - (void)viewDidLoad20 {21 [super viewDidLoad];22 23 // //系统的UIImageview的使用24 1.创建一个UIImageView25 // UIImageView *iv=[[UIImageView alloc]init];26 2.设置图片27 // iv.image=[UIImage imageNamed:@"me"];28 3.设置frame29 // iv.frame=CGRectMake(100, 100, 100, 100);30 4.把创建的自定义的view添加到界面上31 // [self.view addSubview:iv];32 // self.imageView=iv;33 34 35 //自定义UIImageView36 //1.创建37 //2.设置图片38 //3.设置frame39 //4.把创建的自定义的view添加到界面上40 YYimageView *yyiv=[[YYimageView alloc]init];41 yyiv.image=[UIImage imageNamed:@"me"];42 yyiv.frame=CGRectMake(100, 100, 100, 100);43 [self.view addSubview:yyiv];44 self.yyimageView=yyiv;45 46 //添加一个button按钮，当点击button按钮的时候，切换图片47 UIButton *btn=[[UIButton alloc]initWithFrame:CGRectMake(100, 300, 100, 50)];48 [btn setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];49 [btn setTitle:@"点击切换" forState:UIControlStateNormal];50 [btn addTarget:self action:@selector(btnClick) forControlEvents:UIControlEventTouchUpInside];51 [self.view addSubview:btn];52 53 }54 55 -(void)btnClick56 {57 NSLog(@"按钮被点击了");58 UIImage *image=[UIImage imageNamed:@"psb.jpeg"];59 // self.imageView.image=image;60 self.yyimageView.image=image;61 }62 @end YYimageView.m文件的代码：
8 9 #import "YYimageView.h"10 11 @implementation YYimageView12 13 //重写drawRect:方法14 - (void)drawRect:(CGRect)rect15 {16 [self.image drawInRect:rect];17 }18 19 //重写set方法20 -(void)setImage:(UIImage *)image21 {22 _image=image;23 [self setNeedsDisplay];24 }25 @end