iOS Development UI Chapter-quartz2d simple use (iii)

One, the slider to control the scale of the circle

1. Implementation process

Create a new project, create a new class that inherits from UIView, and associate with the custom view in storyboard.

Interface Construction,

code example:

YYVIEWCONTROLLER.M file

1 //2 //YYVIEWCONTROLLER.M3 //04-Scale The Circle4 //5 //Created by Apple on 14-6-11.6 //Copyright (c) 2014 itcase. All rights reserved.7 //8 9 #import "YYViewController.h"Ten #import "YYView.h" One  A @interfaceYyviewcontroller () -@property (Weak, nonatomic) Iboutlet Yyview *Circleview; --(Ibaction) ValueChange: (UISlider *) sender; the  - @end -  - @implementationYyviewcontroller +  -- (void) Viewdidload + { A [Super Viewdidload]; at     //additional setup after loading the view, typically from a nib. - } -  -  --(Ibaction) ValueChange: (UISlider *) Sender { -     // when the value changes, pass the values to view and change the radius of the circle inNSLog (@"%f", sender.value); -     // Pass the value of sender to a custom view, set the radius of the circle toSelf.circleView.radius =Sender.value; + } - @end

YYView.h file

// //   YYView.h//  04-Scaling The Circle ////  Created by Apple on 14-6-11.//  Copyright (c) 2014 itcase. All rights reserved. // #import <UIKit/UIKit.h>@interface  yyview:uiview   Provides a property to receive external incoming RADIUS @property (nonatomic,assign)float  radius; @end

YYVIEW.M file

1 //2 //yyview.m3 //04-Scale The Circle4 //5 //Created by Apple on 14-6-11.6 //Copyright (c) 2014 itcase. All rights reserved.7 //8 9 #import "YYView.h"Ten  One @implementationYyview A // a circle in a custom view does not appear - // override the Set method to assign a value to a radius --(void) Setradius: (float) Radius the { -_radius =radius; -     // to notify a custom view redraw graphic - [self setneedsdisplay]; + } -  + // If view is created from Xib or storyboard, the Awakefromnib method is called first A- (void) awakefromnib at { -     // set an initial value for the radius of the circle here -Self.radius = -; - } -  -- (void) DrawRect: (cgrect) Rect in { -     // 1. Get the graphics context toCgcontextref CTX =Uigraphicsgetcurrentcontext (); +     // 2. Drawing -     // draw a circle in a custom view theCgcontextaddarc (CTX, -, -, Self.radius,0,2*M_PI,0); *     // set the fill color of a circle $[[Uicolor Graycolor]Set];Panax Notoginseng      -     // 3. Rendering the //Cgcontextstrokepath (CTX); + Cgcontextfillpath (CTX); A } the  +  - @end

Effect:

2. Note the point:

DrawRect: Methods cannot be called manually by ourselves, only by the system. DrawRect: Called when the first display or a redraw event occurs. Setneedsdisplay method: Redraw, call this method will notify the custom view redraw screen, call DrawRect:. Tip: When a view is created from Xib or storyboard, the Awakefromnib method is called. 3. Supplements can be monitored by the Value property of the slider and, of course, the value range (set to 0~100) can be specified.　　Second, the brush frame effect Description: The snowflake-like picture drawn to the view, to achieve the picture in the view of the effect of falling. 1. Implementation code:

1 //2 //yyview.m3 //05-Brush Frame animation4 //5 //Created by Apple on 14-6-11.6 //Copyright (c) 2014 itcase. All rights reserved.7 //8 9 #import "YYView.h"Ten  One // Private Extension A @interfaceYyview () -@property (nonatomic, assign)floatImagey; -  the @end - @implementationYyview -  -  +-(ID) Initwithcoder: (Nscoder *) Adecoder - { +     // Please note that it is important to initialize the constructor of the parent class first A     if(self =[Super Initwithcoder:adecoder]) { atNSLog (@"Initwithcoder:"); -          -         // Nstimer is typically used to periodically update some non-interface data to tell how often to call once -         // Using the timer, the use of the timer will be the phenomenon of stuttering - //[Nstimer scheduledtimerwithtimeinterval:0.1 target:self selector: @selector (updateimage) Userinfo:nil Repeats:Y ES]; -          in         //Cadisplaylink brush Frame, default refresh 60 times per second -         // after the timer is created, it is not executed by default and needs to be loaded into the message loop toCadisplaylink *display =[Cadisplaylink displaylinkwithtarget:self selector: @selector (updateimage)]; + [Display Addtorunloop:[nsrunloop mainrunloop] formode:nsdefaultrunloopmode]; -       the     } *     returnSelf ; $ }Panax Notoginseng  --(void) UpdateImage the { +     // call this method to redraw the screen A [self setneedsdisplay]; the } +-(void) awakefromnib - { $NSLog (@"awakefromnib"); $ } -  -- (void) DrawRect: (cgrect) Rect the { -     // draw the picture onto the viewWuyi  the     // each time the method is called to redraw the screen, the value of Imagey is +5 -Self.imagey + =5; Wu       // judging, when snowflakes go out of the screen, let the picture begin to land from the beginning -     if(Self.imagey >rect.size.height) { AboutSelf.imagey =0; $     } -UIImage *image = [UIImage imagenamed:@"Snow"]; -[Image Drawatpoint:cgpointmake (0, Self.imagey)]; -  AUIImage *image2 = [UIImage imagenamed:@"Me"]; +[Image2 Drawatpoint:cgpointmake ( the, Self.imagey)]; the      - } $  the @end

Achieve results

2. Important Notes

(1) Sequence of calls to the following two methods

-(void) awakefromnib

-(ID) Initwithcoder: (Nscoder *) Adecoder

Tip: If view is created from Xib or storyboard, you can call the Awakefromnib method to archive. Creating a view from a file will actually call the Initwithcoder method first. Xib and storyboard are also documents.

Above two methods,-(ID) Initwithcoder: (Nscoder *) Adecoder will be called first. Implementing this method requires implementing the Nscoding protocol, which is already implemented by default because of the UIView created.

You can go to the head file to view:

Run the new program and print to verify the sequence of calls to the above two methods.

(2) two timers

The first one:

[Nstimer scheduledtimerwithtimeinterval:0.1 target:self selector: @selector (updateimage) Userinfo:nil Repeats:YES];

Description: Nstimer is typically used to periodically update some non-interface data to tell how often to call once

The second one:

Cadisplaylink *display= [Cadisplaylink displaylinkwithtarget:self selector: @selector (updateimage)];

[Display Addtorunloop:[nsrunloopmainrunloop] formode:nsdefaultrunloopmode];

　　Description: Cadisplaylink brush frames, which are refreshed by default 60 times per second. After the timer is created, it is not executed by default and needs to be loaded into the message loop

iOS Development UI Chapter-quartz2d simple use (iii)