iOS Development UI Basics-handwriting controls, Frame,center and bounds properties

1.16

1.NSBundle

1> a nsbundle represents a folder, with NSBundle access to the corresponding folder

2> can access any resource in the software resource bundle using Mainbundle

Installation path for the 3> emulator application

/users/aplle/Resource Library/application Support/iphone simulator/7.1/applications

2.UIImageView and UIButton

1> Use occasions

* Uiimageview: If you only display pictures, do not need to listen to the image of the click

* UIButton: Both display the picture, but also listen to the image of the click

2> same: can display picture

3> different points

* UIButton can handle click events, Uiimageview cannot handle click events

* UIButton can display both picture and text

* UIButton can display two pictures at the same time

* UIButton inherits from Uicontrol, so events can be handled by default

* Uiimageview inherits from UIView, so events cannot be handled by default

3.Xcode Document Installation Path

/applications/xcode.app/contents/developer/documentation/docsets

4.Xcode Simulator Installation path

/applications/xcode.app/contents/developer/platforms/iphonesimulator.platform/developer/sdks

1. Review
1) Basic iOS project writing steps
Design interface (drag control)
Set properties and Events
Write Logic code
2) Common method of towing line
3) Addition calculator (some common properties, how to exit the keyboard)
4) frame, bounds, center and transform
5) Simple animations
Bneginanimation
Commit ...
6) Manually create the control

2. Homework
Secure

3. Create a button with code
Basic steps: Create objects, set properties, add to view
The Center algorithm
Set Picture background setbackgroundimage:forstate:
To set the text settitle:forstate:
Set Text color settitlecolor:forstate:
...

4. Add Event: AddTarget

5, under what circumstances use storyboard? When do you use code? What are the advantages?
Consider storyboard without changing the layout structure
If the layout structure often transforms, consider the way pure code

Storyboard records what controls are required on the interface, and the properties of the control
While the program is running, the compiler reads the storyboard file
According to the records in this file, restore to code, step by step to create the corresponding control
Set the corresponding property

6, first build the interface
Drag line

if (Self.index = = 0) {
self.btnLeft.enabled = NO;
} else {
self.btnLeft.enabled = YES;
}
if (self.index! = 4) {
self.btnRight.enabled = YES;
} else {
self.btnRight.enabled = NO;
}
============
if (Self.index! = 0) {
self.btnLeft.enabled = YES;
} else {
self.btnLeft.enabled = NO;
}
if (Self.index = = 4) {
self.btnRight.enabled = NO;
} else {
self.btnRight.enabled = YES;
}

The use of pure assignment code in everything If-else structure can be simplified to three-dimensional expression
int num = 1 > 2? 1:2;

7. plist file
Property List

6. Picture Browser Example
-Build interface (one application of buttons, Uiimageview)
Uiimageview and UIButton
UIButton Inheriting child Uicontrol
Default all controls that inherit from Uicontrol have a default event handling method
and Uiimageview directly from the UIView.
The default is no event handling
The picture is the same, but because there is no event handling, Uiimageview performance will be higher
If you only consider displaying pictures, we recommend using Uiimageview
If you have click Processing, use UIButton
--Review the use of arrays, indexes, dictionaries
NSBundle used to get the full path of the file
When you get an array, you can use the full path of file

7, Uiiamgeview
I've already mentioned an animation
UIView beginanimations
。。。。
UIView commitanimatiuons
Sequence Frame Animations

8. Animation memory
UIImage imagenamed:@ ""
Generally loading small images or system images using

9. Complementary Knowledge points
1) UIView is a container in which you can place other UIView
2) When positioning the frame property, the parent container is used as the reference system
3) where is the application loaded?

iOS Development UI Basics-handwriting controls, Frame,center and bounds properties

First, the handwriting control

1. Steps of the handwriting control (1) Use the corresponding control class to create the control object (2) to set various properties of the control (3) Add controls to the view (4) If you are a control such as a button, you also need to consider the control's Click event (5) Note: The relationship between View Contollor and view 2. Note

In OC Development, all operations in storyboard can be implemented by code, and programmers must be proficient in the ability of the code layout interface!

The sample code for setting the control listener method is as follows:

[Btn addtarget:self Action: @selector (click:) forcontrolevents:uicontroleventtouchupinside];

Tips:

The 1> Addtarget method is defined in the Uicontrol class, which means that you can add a listening method to all objects that inherit from the Uicontrol class

The first parameter of the 2> listener method is the object itself

The second parameter of the 3> listener method is the event that listens to the control

3. Code examples

 1//1. Create a button object using a Class 2//UIButton *headbtn=[[uibutton alloc] initwithframe:cgrectmake (100, 100, 100, 100)]; 3 Set button object to custom type 4 UIButton *headbtn=[uibutton Buttonwithtype:uibuttontypecustom]; 5 6//2. Set the properties of the object 7//(1) position and other common property settings 8 headbtn.frame=cgrectmake (100, 100, 100, 100); 9 10//(2) Set the properties of the button in the normal state one by one [headbtn setbackgroundimage:[uiimage imagenamed:@ "I"] forstate:uicontrolstatenormal]; [headbtn settitle:@] dot me!      "Forstate:uicontrolstatenormal];13 [headbtn settitlecolor:[uicolor Redcolor] forstate:uicontrolstatenormal];14 15     (3) Set the properties of the button in the highlighted state [headbtn setbackgroundimage:[uiimage imagenamed:@ "a"] forstate:uicontrolstatehighlighted];17 [Headbtn settitle:@ "OK ~" forstate:uicontrolstatehighlighted];18 [headbtn settitlecolor:[uicolor BlueColor] ForSta te:uicontrolstatehighlighted];19 20//3. Add the object to the view and show it. [Self.view addsubview:headbtn];22//Attention point! SELF.HEADIMAGEVIEW=HEADBTN; 

Second,frame,center and bounds attributes

1.frame, center, and bounds Properties frame: Control position and Size Center: Control position (center point) Bounds: Control size (in its own upper left corner as the origin) 2. Attention Point

(1) The position of the control can be modified by the following properties

Frame.origin

Center

(2) The size of the control can be modified by the following properties

Frame.size

Bounds.size

3. Code examples

A program (frame, center, and bounds properties) that controls how the picture is shifted up or down, scaled

  1//2//YYVIEWCONTROLLER.M 3//01-Practice using the button's frame and Center Properties 4//5//Created by Apple on 14-5-21. 6//Copyright (c) 2014 itcase.  All rights reserved. 7//8 9 #import "YYViewController.h" 10 11//Private extension @interface Yyviewcontroller () @property (nonatomic,weak) I Boutlet UIButton *headimageview; @end @implementation Yyviewcontroller 18 19//enumeration type, starting from 1 typedef enum {ktopbtntag=1, KDOWNB Tntag, Krightbtntag, Kleftbtntag-}btntag; //viewdidload is the method that is called after the view is loaded, typically performing the initialization of the view controller in this method (void) Viewdidload 30 {31 32//In the Viewdidload method, do not forget to call Method implementation of the parent class [Super Viewdidload]; 34 35 36//Handwriting Control Code 37//One, write a button control, there is a picture 38 39//1. Create a button object using a class//UIButton *headbtn=[[uibutto N alloc] Initwithframe:cgrectmake (100, 100, 100, 100)]; 41//Set button object for custom type UIButton *headbtn=[uibutton Buttonwithtype:uibuttontypecustom]; 43 44//2. Set the properties of the object 45//(1) Position Common properties set headbtn.frame=CGRectMake (100, 100, 100, 100); 47 48//(2) Set the properties of the button in the normal state [headbtn setbackgroundimage:[uiimage imagenamed:@ "I"] Forstate:uicontrolstatenorma L]; [headbtn settitle:@] dot me! [Forstate:uicontrolstatenormal]; Wuyi [headbtn Settitlecolor:[uicolor Redcolor] forstate:uicontrolstatenormal]; 52 53//(3) Set the properties of the button in the Highlight state [headbtn setbackgroundimage:[uiimage imagenamed:@ "a"] Forstate:uicontrolstatehighl Ighted]; [Headbtn settitle:@] is OK ~ "forstate:uicontrolstatehighlighted"; [Headbtn Settitlecolor:[uicolor Bluecolor] forstate:uicontrolstatehighlighted]; 57 58//3. Add the object to the view and show it. [Self.view addsubview:headbtn]; 60//Attention point! SELF.HEADIMAGEVIEW=HEADBTN; 62 63 64//Two, write four control the picture up and down move direction of the button control 65 66/**================ up Button =====================*/67//1. Create button Object UIButton *topbtn=[uibutton Buttonwithtype:uibuttontypecustom]; 69 70//2. Setting the properties of an object Topbtn.frame=cgrectmake (100, 250, 40, 40); [Topbtn SEtbackgroundimage:[uiimage imagenamed:@ "Top_normal"] forstate:uicontrolstatenormal]; [Topbtn setbackgroundimage:[uiimage imagenamed:@ "top_highlighted"] forstate:uicontrolstatehighlighted]; [Topbtn settag:1]; 75//3. Adding controls to the view [Self.view addsubview:topbtn]; 77 78//4. Click Control event for Button [topbtn addtarget:self Action: @selector (click:) forcontrolevents:uicontroleventtouchup Inside]; 80 81 82/**================ down button =====================*/83//1. Create button Object UIButton *downbtn=[uibut Ton Buttonwithtype:uibuttontypecustom]; 85//2. Setting the properties of an object Downbtn.frame=cgrectmake (100, 350, 40, 40); [Downbtn setbackgroundimage:[uiimage imagenamed:@ "Bottom_normal"] forstate:uicontrolstatenormal]; [Downbtn setbackgroundimage:[uiimage imagenamed:@ "bottom_highlighted"] forstate:uicontrolstatehighlighted]; [Downbtn Settag:2]; 90//3. Adding controls to the view [Self.view addsubview:downbtn]; 92 93//4 Click Control Event 94 [Downbtn AddTArget:self Action: @selector (Click:) forcontrolevents:uicontroleventtouchupinside]; 95 96 97/**================ Left button =====================*/98//1. Create button object UIButton *leftbtn=[uibutton b uttonwithtype:uibuttontypecustom];100//2. Setting the properties of an Object 101 Leftbtn.frame=cgrectmake ((), 102 [Leftbtn SE Tbackgroundimage:[uiimage imagenamed:@ "Left_normal"] forstate:uicontrolstatenormal];103 [leftbtn Setbackgroundimage:[uiimage imagenamed:@ "left_highlighted"] forstate:uicontrolstatehighlighted];104 [leftbtn settag:4];105//3. Add the control to the View 106 [Self.view addsubview:leftbtn];107 108//4. Click Control Events 109 [leftbtn Addtar Get:self Action: @selector (Click:) forcontrolevents:uicontroleventtouchupinside];110 111 112 113/**======= ========= right button =====================*/114//1. Create a Button object UIButton *rightbtn=[uibutton buttonwithtype:uibuttontypecus tom];116//2. Setting the properties of an object 117 Rightbtn.frame=cgrectmake (118 Setbackgroundimage:[uiimage imagenamed:@ "Right_normal"] forstate:uicontrolstatenormal];119 [rightbtn Setbackgroundimage:[uiimage imagenamed:@ "right_highlighted"] forstate:uicontrolstatehighlighted];120 [rightbtn settag:3];121//3. Add the control to the view 122 [Self.view addsubview:rightbtn];123 124//4. Click Control event for button [Rightbtn AddT        Arget:self Action: @selector (Click:) forcontrolevents:uicontroleventtouchupinside];126 127//Three, write two zoom button 128 /**================ enlarged button =====================*/129//1. Creating Objects UIButton *plusbtn=[uibutton Buttonwithtype:uibutton  typecustom];131//2. Setting Properties Plusbtn.frame=cgrectmake (------), 133 [Plusbtn Setbackgroundimage:[uiimage imagenamed:@ "Plus_normal"] forstate:uicontrolstatenormal];134 [plusbtn setbackgroundimage:[uiimage imageNamed:@] plus_highlighted "] forstate:uicontrolstatehighlighted];135 [plusbtn settag:1];136//3. Add to view 137 [Self.view AddS ubview:plusbtn];138//4. Click event 139 [plusbtn AddTarget:self Action: @selector (Zoom:) forcontrolevents:uicontroleventtouchupinside];140 141 142/**============= = = = Reduced button =====================*/143 UIButton *minusbtn=[uibutton buttonwithtype:uibuttontypecustom];144 minusbtn.fr Ame=cgrectmake, 145 [minusbtn setbackgroundimage:[uiimage imagenamed:@ "Minus_normal"] ForState:UICon trolstatenormal];146 [minusbtn setbackgroundimage:[uiimage imagenamed:@ "minus_highlighted"] forState: uicontrolstatehighlighted];147 [Minusbtn settag:0];148 [Self.view addsubview:minusbtn];149 [Minusbtn addTarget : Self action: @selector (Zoom:) forcontrolevents:uicontroleventtouchupinside];150}151 152//Control direction multiple buttons call the same method 153-(     void) Click: (UIButton *) button154 {155 156//Practice using the Frame Property 157//cgrect frame=self.headimageview.frame;158 159 /** Note that if you control the position of the two properties frame and center at the same time, there will be a very interesting effect, pay attention to analysis */160//Practice using the Center property 161 Cgpoint Center=self.headimageview.cen ter;162 switch (button.tag) {163 case Ktopbtntag:164 center.y-=30;165 break;166 Case kdownbtntag:167 center.y+=30;168            break;169 case kleftbtntag:170//found a bug, before the problem is because less write break, resulting in their sequential execution, sorry171 center.x=center.x-30;172 center.x-=50;173 break;174 Case krightbtntag:175 CE     nter.x+=50;176 break;177}178 179//SELF.HEADIMAGEVIEW.FRAME=FRAME;180 181//Set animation effect 182 [UIView beginanimations:nil context:nil];183 self.headimageview.center=center;184//Set time 185 [UIView Setanim ationduration:2.0];186 [UIView commitanimations];187 NSLog (@ "Move!"); 188 189}190-(void) Zoom: (UIButton *) btn191 {192//use frame in its own upper left corner (own origin) for Origin 193//CGRect Frame=self.headimagev     iew.frame;194//if (Btn.tag) {195//frame.size.height+=30;196//frame.size.width+=30;197//}198// else199//{$//frame.size.width-=50;201//FRAme.size.height-=50;202//}203//self.headimageview.frame=frame;204 205 206//Use bounds to scale with center point Origin 207 CGRect bounds = self.headimageview.bounds;208 if (btn.tag) {209 bounds.size.height+=30;210 BOUNDS.S ize.width+=30;211}212 else213 {214 bounds.size.height-=50;215 bounds.size.width-=50;216}     217 218//Set animation 219 [UIView Beginanimations:nil context:nil];220 self.headimageview.bounds=bounds;221 [UIView setanimationduration:2.0];222 [UIView commitanimations];223}224 @end

Implementation results:

Three, simple animation effect

A brief introduction to the end-to-end animation (1) Start animation (2) Set animation-related time, etc. (3) action to participate in animation (4) Commit animation Note: Implement code reference above

iOS Development UI Basics-handwriting controls, Frame,center and bounds properties