quartz2d (custom Uiimageview control)

quartz2d (custom Uiimageview control)

First, the realization of ideas

The biggest purpose of quartz2d is to customize the view (custom UI control) to customize the view when the system view does not meet our usage requirements. Using quartz2d to customize the view, you can start with the use of ImageView that mimics the system. Demand-driven development: the process of imitating the imageview of the System 1. Create 2. Set the picture 3. Set Frame4. Add the created custom view to the interface (in a custom view, an image property is required to receive the image Image parameter->5). 5. Add an Image property (next, after you get the image, you should render the image you got.) How to render? How does the custom view show the picture? Draw the picture, so you need to rewrite the drawrect of the Custom View: method). 6. Rewrite the DrawRect: method of the custom view to draw a graphic inside the method. Second, the code to implement the system comes with the use of ImageView

#import "YYViewController.h" @interface Yyviewcontroller () @end @implementation yyviewcontroller-(void) viewdidload{    [Super Viewdidload];    Use of the system Uiimageview//    1. Create a uiimageview    uiimageview *iv=[[uiimageview alloc]init];//    2. Set Picture    Iv.image=[uiimage imagenamed:@ "Me"];//    3. Set frame Iv.frame=cgrectmake (+, +, +    );//    4. Add custom view created to the interface    [Self.view addsubview:iv];} @end

Implementation results:

Use quartz2d to customize the view with the following code:

Create a new custom class to inherit from the Uiview,yyimageview.h file code as follows:

8  9 #import <uikit/uikit.h>10 @interface yyimageview:uiview12 @property (nonatomic,strong) UIImage *image; @end

In the implementation of the custom class, override the DrawRect: method to draw and render the drawing. The yyimageview.m file code is as follows:

9 #import "YYimageView.h" @implementation YYimageView12 13//Rewrite DrawRect: Method-(void) DrawRect: (CGRect) rect15 {16
   [self.image drawinrect:rect];17}18 @end

In the main controller, imitate the system to bring the uiimageview of the use process, achieve the same effect.

8  9 #import "YYViewController.h" #import "YYimageView.h" @interface Yyviewcontroller () @end15 @impleme Ntation YYViewController17-(void) viewDidLoad19 {     [super viewdidload];21]////    The Uiimageview of the system is used at////    1. Create a UIImageView24//    uiimageview *iv=[[uiimageview alloc]init];25////    2. Set picture of//    iv.image=[uiimage imagenamed:@ "Me"];27////    3. Set frame28//    iv.frame=cgrectmake (100, 100, 100, ////    4. Add the created custom view to the interface.//    [Self.view addsubview:iv];31     // Custom UIImageView34     //1. Create     a//2. Set     the picture to//3. Set Frame37     //4. Add the created custom view to the interface     Yyimageview *yyiv=[[yyimageview alloc]init];39     yyiv.image=[uiimage imagenamed:@ "Me"];40     yyiv.frame= CGRectMake (+, +, +);     [Self.view addsubview:yyiv];42}44 @end

Third, improve

Existing problems?

On the interface, add a button that requires a click of the button to enable the image to be toggled.

 8 9 #import "YYViewController.h" #import "YYimageView.h" @interface Yyviewcontroller () @property (nonatomic,str ONG) Uiimageview *imageview;14 @end15 @implementation YYViewController17-(void) VIEWDIDLOAD19 {[Super Viewdid    load];21 22//Uiimageview use of the system 23//1. Create a UIImageView24 Uiimageview *iv=[[uiimageview alloc]init];25//    2. Set picture Iv.image=[uiimage imagenamed:@ "Me"];27//3. Set Frame28 iv.frame=cgrectmake (100, 100, 100, 100); 29//     4. Add the created custom view to the interface [Self.view addsubview:iv];31 self.imageview=iv;32 33 34//Custom UIIMAGEVIEW35 1. Create 36//2. Set Picture 37//3. Set the Frame38//4. Add the created custom view to the interface.//Yyimageview *yyiv=[[yyimageview Alloc]init] ; yyiv.image=[uiimage///imagenamed:@ "Me"];41//Yyiv.frame=cgrectmake (+, +, +), +//[Self.view Add SUBVIEW:YYIV];43 44//Add a button to toggle the picture UIButton *btn=[[uibutton Alloc]initwithframe:cgrectma When you click the button KE (100, 300, 100, 50)];46 [btn Settitlecolor:[uicolor blackcolor] forstate:uicontrolstatenormal];47 [btn settitle:@ "Click to Toggle" ForState:UIContr     olstatenormal];48 [btn addtarget:self Action: @selector (Btnclick) forcontrolevents:uicontroleventtouchupinside];49 [Self.view addsubview:btn];50 Wuyi}52-(void) btnClick54 {UIImage *image=[uiimage imagenamed:@ "Psb.jpeg"];56 s elf.imageview.image=image;57}58 @end

After clicking on the button, the switch of the picture is realized.

Description: The uiimage of the system can be replaced. Custom ImageView does not change, because a custom view needs to be redrawn and rendered once when it wants to change the image. So when you get the replacement picture, you need to redraw the image again, overriding the SetImage method.

The perfect code is as follows:

The code for the YYVIEWCONTROLLER.M file in the host controller:

 8 9 #import "YYViewController.h" #import "YYimageView.h" @interface Yyviewcontroller () @property (nonatomic,str ONG) Uiimageview *imageview;14 @property (nonatomic,strong) yyimageview *yyimageview;15 @end16 @implementation YYViewController18-(void) VIEWDIDLOAD20 {[Super viewdidload];22 23//////System Uiimageview use 24////1. Create One UIImageView25//Uiimageview *iv=[[uiimageview alloc]init];26////2. Set picture//Iv.image=[uiimage imagenamed:@ "M E "];28////3. Set frame29//Iv.frame=cgrectmake (100, 100, 100, 100); 30////4. Add the created custom view to the interface//[Self.vie W addsubview:iv];32//SELF.IMAGEVIEW=IV;33 34 35//Custom UIIMAGEVIEW36//1. Create 37//2. Set Picture 38//3. Settings Frame39//4. Add the created custom view to the interface. Yyimageview *yyiv=[[yyimageview alloc]init];41 yyiv.image=[uiimage imagenamed : @ "Me"];42 yyiv.frame=cgrectmake (+, +, +); [Self.view addsubview:yyiv];44 self.yyimageview=yyiv;4 5 46//Add a button when clicked ButtOn button, switch picture UIButton *btn=[[uibutton alloc]initwithframe:cgrectmake (+, +, +)];48 [btn settitlecolor:[  Uicolor Blackcolor] forstate:uicontrolstatenormal];49 [btn settitle:@ "Click to Toggle" Forstate:uicontrolstatenormal];50 [btn Addtarget:self Action: @selector (Btnclick) forcontrolevents:uicontroleventtouchupinside];51 [Self.view AddSubview:    btn];52}54-(void) btnClick56 {NSLog (@ "button was clicked"); UIImage *image=[uiimage imagenamed:@ "psb.jpeg"];59// self.imageview.image=image;60 self.yyimageview.image=image;61}62 @end

Code for the yyimageview.m file:

8  9 #import "YYimageView.h" @implementation YYimageView12 13//Rewrite DrawRect: Method-(void) DrawRect: (CGRect) rect15     { [Self.image drawinrect:rect];17}18 19//Override set Method-(void) SetImage: (UIImage *) image21 {_image=image;23     [ Self setneedsdisplay];24}25 @end

quartz2d (custom Uiimageview control)