IOS makes a simple artboard

Make a simple artboard

as an iOS beginner, after learning a few simple widgets (Uilable,uitextfield,uibutton) of the UI, you can make a simple drawing board demo, the following is the specific production process (under the MRC), if there are shortcomings, please the gods to teach 0.0.

1. Build the interface, mainly composed of Uibutton,uitextfield, the bottom button is Uitextfield a custom keyboard (Inputview)

。

-(void) Viewdidload {

[Super Viewdidload];

Create a menu button

UIButton *menubutton = [UIButton Buttonwithtype:uibuttontypesystem];

Menubutton.frame = CGRectMake (Cgrectgetwidth (self.view.bounds)-80, 40, 60, 40);

[Menubutton settitle:@ "menu" forstate:uicontrolstatenormal];

[Menubutton addtarget:self Action: @selector (handlemenubuttonaction:) forcontrolevents:uicontroleventtouchupinside ];

[Self.view Addsubview:menubutton];

Add TextField, but don't want him to show up, so frame = Cgrectzero

Uitextfield *textfield = [[Uitextfield Alloc]initwithframe:cgrectzero];

Textfield.tag = 123;

[Self.view Addsubview:textfield];

[TextField release];

UIView *inputview = [[UIView alloc]initwithframe:cgrectmake (0, 0, cgrectgetwidth (self.view.bounds), 60)];

Inputview.backgroundcolor = [Uicolor Whitecolor];

Textfield.inputview = Inputview;

[Inputview release];

Nsarray *titles = @[@ "Decrease", @ "Increase", @ "undo", @ "empty", @ "color"];

CGFloat width = (cgrectgetwidth (self.view.bounds)-20 * 6)/5;

CGFloat height = width;

CGFloat originy = (60-height)/2;

CGFloat Originx = 20;

for (int i = 0; i < titles.count; i + +) {

UIButton *button = [UIButton Buttonwithtype:uibuttontypesystem];

Button.tag = + i;

Button.frame = CGRectMake (Originx + (width + originx) * I, originy, width, height);

[Button settitle:titles[i] forstate:uicontrolstatenormal];

Button.backgroundcolor = [Uicolor colorwithred:arc4random ()%256/255.0 green:arc4random ()%256/255.0 blue:arc4random ( )%256/255.0 alpha:0.6];

Change the color of the title to white.

[Button Settitlecolor:[uicolor Whitecolor] forstate:uicontrolstatenormal];

Set the corner radius of the button to half the width of the button

Button.layer.cornerRadius = width/4.0;

Button.layer.masksToBounds = yes;//cuts The view by the specified radius.

[Button addtarget:self action: @selector (handlebuttonaction:) forcontrolevents:uicontroleventtouchupinside];

[Inputview Addsubview:button];

    }  

}

The following is how the menu button responds.

-(void) Handlemenubuttonaction: (UIButton *) sender{

Get TextField

Uitextfield *textfield = (Uitextfield *) [Self.view viewwithtag:123];

Determine if TextField is currently the first responder, revoke its first responder permission, or make it the first responder.

if (Textfield.isfirstresponder) {

[TextField Resignfirstresponder];

}else{

[TextField becomefirstresponder];//becomes the first responder.

}

}

2. Create a class Linemodel that inherits NSObject, which is used to record lines.

#import <Foundation/Foundation.h>

#import <UIKit/UIKit.h>

Ternary (Trace path color color width) used to record lines

@interface Linemodel:nsobject

@property (nonatomic, retain) Uibezierpath *path;//uses Bezier curves to record touch traces.

@property (nonatomic, retain) uicolor *color;//line Color

@property (nonatomic, assign) cgfloat width;//line width

@end

#import "LineModel.h"

@implementation Linemodel

-(void) dealloc{

[_color release];

[_path release];

[Super Dealloc];

}

@end

3. Create a subclass Paintview that inherits the UI view, and Linemodel the above to implement the drawing board.

@interface Paintview:uiview

The @property (nonatomic, retain) Nsmutablearray *alllines;//is used to save all line objects on the artboard.

@property (nonatomic, retain) Uicolor *linecolor;//the current line color.

@property (nonatomic, assign) CGFloat linewidth;//the width of the current line

-(void) undolastdrawing;//undo last Draw

-(void) allclean;//empty the artboard.

@end

#import "PaintView.h"

#import "LineModel.h"

@implementation Paintview

-(void) dealloc{

[_alllines release];

[_linecolor release];

[Super Dealloc];

}

-(Nsmutablearray *) alllines{

if (!_alllines) {

Self.alllines = [Nsmutablearray array];

}

return _alllines;

}

-(void) Touchesbegan: (Nsset *) touches withevent: (uievent *) event{

Uitouch *atouch = Touches.anyobject;

Cgpoint startPoint = [Atouch LocationInView:self.superview];

Creates a Bezier object and sets the starting point of the curve.

Uibezierpath *bezierpath = [Uibezierpath Bezierpath];

Sets the starting point.

[Bezierpath Movetopoint:startpoint];

Create a line model object and save three data for the current line

Linemodel *line = [[[Linemodel alloc]init]autorelease];

Line.path = Bezierpath;

Line.color = Self.linecolor;

Line.width = Self.linewidth;

Add to array waiting to be used

[Self.alllines Addobject:line];

}

-(void) touchesmoved: (Nsset *) touches withevent: (uievent *) event{

Uitouch *atouch = Touches.anyobject;

Cgpoint cuttentpoint = [Atouch LocationInView:self.superview];

Gets the corresponding line model (the last object of the array corresponds to the curve currently being drawn during the touch move)

Linemodel *aline = Self.allLines.lastObject;

Adds a point on the touch track.

[Aline.path Addlinetopoint:cuttentpoint];

[Self setneedsdisplay];//Call this method is to inform the view, draw the interface, once this method is called, the system will automatically call the DrawRect: method to draw the interface.

}

-(void) DrawRect: (CGRect) rect{

For (Linemodel *aline in Self.alllines) {

Set Fill Color

[Aline.color Setstroke];

Set the line width when drawing

[Aline.path SetLineWidth:aLine.width];

Start Drawing Curves

[Aline.path stroke];

}

}

-(void) undolastdrawing{

[Self.alllines Removelastobject];

[Self setneedsdisplay];//The last Curve object in the divisor group and redraws the interface.]

}

-(void) allclean{

[Self.alllines removeallobjects];

[Self setneedsdisplay];//clears all curves.

}

@end

4. Introduce the Paintview into the view controller and implement the button's method call.

overriding Loadview to view Paintview as a view controller

-(void) loadview{

Paintview *paintview = [[Paintview alloc]initwithframe:[[uiscreen Mainscreen]bounds]];

Paintview.backgroundcolor = [Uicolor Whitecolor];

Self.view = Paintview;

Sets the default width and color.

Paintview.linewidth = 10;

Paintview.linecolor = [Uicolor blackcolor];

[Paintview release];

}

How each button is implemented.

-(void) Handlebuttonaction: (UIButton *) sender{

Paintview *paintview = (Paintview *) Self.view;

Switch (Sender.tag) {

Case 100:

if (Paintview.linewidth > 2) {

Paintview.linewidth-= 1;

}

Break

Case 101:{

Paintview.linewidth + = 1;

Break

}

Case 102:{

[Paintview undolastdrawing];

Break

}

Case 103:{

[Paintview Allclean];

Break

}

Case 104:{

Sender.backgroundcolor = [Uicolor colorwithred:arc4random ()% 256/255.0 green:arc4random ()% 256/255.0 Blue:arc4rando m ()% 256/255.0 alpha:1];

Set Brush color

Paintview.linecolor = Sender.backgroundcolor;

Break

}

Default

Break

}    

}

such a simple graffiti version of the production, there must be many shortcomings, Beau first write Bo, just contact experience is insufficient, but also ask you to point to suggestions, I will continue to improve. Thank you.

IOS makes a simple artboard