IOS development UI-simple browser viewing program

IOS development UI-simple browser viewing program

IOS development UI-simple browser viewing program

I. Program Implementation requirements

1. Requirements

2. Interface Analysis

(1) You need to set properties for controls that need to read or modify properties.

Serial number label

Image

Image Description

Button on the left

Button on the right

(2) You need to add a listening method to the object that needs to listen for the response to the event.

Button on the left

Button on the right

2. Procedures for implementing basic functions

1 // 2 // YYViewController. m 3 // 03-picture browser preliminary 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 # define POTOIMGW 200 12 # define POTOIMGH 300 13 # define POTOIMGX 60 14 # define POTOIMGY 50 15 16 17 @ interface YYViewController () 18 19 // variable declaration! 20 @ property (nonatomic, strong) UILabel * firstlab; 21 @ property (nonatomic, strong) UILabel * lastlab; 22 @ property (nonatomic, strong) UIImageView * icon; 23 @ property (nonatomic, strong) UIButton * leftbtn; 24 @ property (nonatomic, strong) UIButton * rightbtn; 25 26-(void) change; 27 @ property (nonatomic, assign) int I; 28 @ end 29 30 @ implementation YYViewController 31 32-(void) viewDidLoad 33 {34 [super viewDidL Oad]; 35 self. I = 0; 36 // create a lable control 37 UILabel * headlab = [[UILabel alloc] initWithFrame: CGRectMake (20, 10,300, 30)] to display the serial number. 38 39 // [headlab setText: @ "1/5"]; 40 [headlab setTextAlignment: NSTextAlignmentCenter]; 41 [headlab setTextColor: [UIColor blackColor]; 42 43 [self. view addSubview: headlab]; 44 self. firstlab = headlab; 45 46 47 48 // create a control for image loading 49 UIImageView * potoimg = [[UIImageView alloc] initWit HFrame: CGRectMake (POTOIMGX, POTOIMGY, POTOIMGW, POTOIMGH)]; 50 51 UIImage * image = [UIImage imageNamed: @ "biaoqingdi"]; 52 potoimg. image = image; 53 54 [self. view addSubview: potoimg]; 55 self. icon = potoimg; 56 57 58 59 // create the lable control 60 UILabel * desclab = [[UILabel alloc] initWithFrame: CGRectMake (20,400,300, 30)] at the bottom of the image description; 61 // [desclab setText: @ "weak expression! "]; 62 [desclab setTextAlignment: NSTextAlignmentCenter]; 63 [self. view addSubview: desclab]; 64 self. lastlab = desclab; 65 66 68 // create two arrow keys button 69 // set to custom type 70 // 1. use the class to create the object 71 UIButton * leftbtn = [UIButton buttonWithType: UIButtonTypeCustom]; 72 73 // 2. set object attributes (do not forget to set coordinates) 74 leftbtn. frame = CGRectMake (0, self. view. center. y, 40, 40); 75 [leftbtn setBackgroundImage: [UIImage imageNamed: @ "left_normal"] forState: UIC OntrolStateNormal]; 76 [leftbtn setBackgroundImage: [UIImage imageNamed: @ "left_highlighted"] forState: UIControlStateHighlighted]; 77 78 // 3. submit the object to view 79 [self. view addSubview: leftbtn]; 80 81 self. leftbtn = leftbtn; 82 [leftbtn addTarget: self action: @ selector (leftclick :) forControlEvents: Listener]; 83 84 85 UIButton * rightbtn = [UIButton resume: Listener]; 86 87 rightbt N. frame = CGRectMake (POTOIMGX + POTOIMGW + 10, self. view. center. y, 40, 40); 88 [rightbtn setBackgroundImage: [UIImage imageNamed: @ "right_normal"] forState: UIControlStateNormal]; 89 [rightbtn setBackgroundImage: [UIImage imageNamed: @ "right_highlighted"] forState: UIControlStateHighlighted]; 90 91 [self. view addSubview: rightbtn]; 92 93 self. rightbtn = rightbtn; 94 [rightbtn addTarget: self action: @ selector (righ Tclick :) forControlEvents: UIControlEventTouchUpInside]; 95 96 // This Is An initialization method. Call change to complete initialization. 97 [self change]; 98} 99 100-(void) change101 {102 [self. firstlab setText: [NSString stringWithFormat: @ "% d/5", self. I + 1]; 103 switch (self. i) {104 case self. lastlab. text = @ "all weak expressions! 106 self. icon. image = [UIImage imageNamed: @ "biaoqingdi"]; 107 break; 108 case self. lastlab. text = @ "case"; 110 self. icon. image = [UIImage imageNamed: @ "bingli"]; 111 break; 112 case self. lastlab. text = @ ""; 114 self. icon. image = [UIImage imageNamed: @ "wangba"]; 115 break; 116 case self. lastlab. text = @ "eat steak"; 118 self. icon. image = [UIImage imageNamed: @ "chiniupa"]; 119 break; 120 case 4: 121 self. lastlab. tex T = @ "It hurts! 122 self. icon. image = [UIImage imageNamed: @ "danteng"]; 123 break; 124} 125 // click the control button. If it is 5, the right-click button fails. If it is 1, 126 self. leftbtn. enabled = (self. i! = 0); 127 self. rightbtn. enabled = (self. I! = 4); 128 129} 130 131 // press 132-(void) rightclick (UIButton *) btn133 {134 self. I ++; 135 [self change]; 136 // NSLog (@ "Click me"); 137} 138-(void) leftclick :( UIButton *) btn139 {140 self. I --; 141 [self change]; 142} 143-(void) didReceiveMemoryWarning144 {145 [super didreceivemorywarning]; 146 // Dispose of any resources that can be recreated.147} 148 149 @ end

3. Program Optimization

1 // 2 // YYViewController. m 3 // 03-picture browser preliminary 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 # define POTOIMGW 200 12 # define POTOIMGH 300 13 # define POTOIMGX 60 14 # define POTOIMGY 50 15 16 17 @ interface YYViewController () 18 19 // variable declaration! 20 @ property (nonatomic, strong) UILabel * firstlab; 21 @ property (nonatomic, strong) UILabel * lastlab; 22 @ property (nonatomic, strong) UIImageView * icon; 23 @ property (nonatomic, strong) UIButton * leftbtn; 24 @ property (nonatomic, strong) UIButton * rightbtn; 25 26 @ property (nonatomic, strong) NSArray * array; 27 28-(void) change; 29 @ property (nonatomic, assign) int I; 30 @ end 31 32 @ implementation YYViewController 33 34-(void) viewDidLoad 35 {36 [super viewDidLoad]; 37 self. I = 0; 38 // create a lable control 39 UILabel * headlab = [[UILabel alloc] initWithFrame: CGRectMake (20, 10,300, 30)] to display the serial number. 40 41 // [headlab setText: @ "1/5"]; 42 [headlab setTextAlignment: NSTextAlignmentCenter]; 43 [headlab setTextColor: [UIColor blackColor]; 44 45 [self. view addSubview: headlab]; 46 self. firstlab = headlab; 47 48 49 50 // create a widget for image loading 51 UIImageView * potoimg = [[UIImageView alloc] Repository: CGRectMake (POTOIMGX, POTOIMGY, POTOIMGW, POTOIMGH)]; 52 53 UIImage * image = [UIImage imageNamed: @ "repository"]; 54 potoimg. image = image; 55 56 [self. view addSubview: potoimg]; 57 self. icon = potoimg; 58 59 60 61 // create the lable control 62 UILabel * desclab = [[UILabel alloc] initWithFrame: CGRectMake (20,400,300, 30)] at the bottom of the image description; 63 // [desclab setText: @ "weak expression! "]; 64 [desclab setTextAlignment: NSTextAlignmentCenter]; 65 [self. view addSubview: desclab]; 66 self. lastlab = desclab; 67 68 69 70 // create two arrow keys and buttons 71 // set to custom type 72 // 1. create object 73 UIButton * leftbtn = [UIButton buttonWithType: UIButtonTypeCustom]; 74 75 // 2. set object attributes (do not forget to set coordinates) 76 leftbtn. frame = CGRectMake (0, self. view. center. y, 40, 40); 77 [leftbtn setBackgroundImage: [UIImage imageNamed: @ "left_normal"] forState: UIControlStateNormal]; 78 [leftbtn setBackgroundImage: [UIImage imageNamed: @ "left_highlighted"] forState: UIControlStateHighlighted]; 79 80 // 3. submit the object to view 81 [self. view addSubview: leftbtn]; 82 83 self. leftbtn = leftbtn; 84 [leftbtn addTarget: self action: @ selector (leftclick :) forControlEvents: role]; 85 86 87 UIButton * rightbtn = [UIButton buttonWithType Tbtn. frame = CGRectMake (POTOIMGX + POTOIMGW + 10, self. view. center. y, 40, 40); 90 [rightbtn setBackgroundImage: [UIImage imageNamed: @ "right_normal"] forState: UIControlStateNormal]; 91 [rightbtn setBackgroundImage: [UIImage imageNamed: @ "right_highlighted"] forState: UIControlStateHighlighted]; 92 93 [self. view addSubview: rightbtn]; 94 95 self. rightbtn = rightbtn; 96 [rightbtn addTarget: self action: @ selector (r Ightclick :) forControlEvents: UIControlEventTouchUpInside]; 97 // if it is put here, it will only be created once, but this part and [self change]; some have strict order requirements and are not human-friendly, you can consider using the lazy loading feature 98 // NSDictionary * dict1 = @ {@ "name": @ "biaoqingdi", @ "desc": @ "all weak expressions! "}; 99 // NSDictionary * dict2 = @ {@" name ": @" bingli ", @" desc ": @" case "}; 100 // NSDictionary * dict3 ={ @ "name": @ "wangba", @ "desc": @ ""}; 101 // NSDictionary * dict4 ={ @ "name": @ "chiniupa", @ "desc": @" "}; 102 // NSDictionary * dict5 ={ @ "name": @ "danteng", @ "desc": @ "egg pain"}; 103 // 104 // self. array = @ [dict1, dict2, dict3, dict4, dict5]; 105 // This Is An initialization method. Call change to complete initialization. 106 [self change]; 107} 108 109-(void) change110 {1 11 // do I need to create each call? Is there any solution? 112 // NSDictionary * dict1 = @ {@ "name": @ "biaoqingdi", @ "desc": @ "weak expression! "}; 113 // NSDictionary * dict2 = @ {@" name ": @" bingli ", @" desc ": @" case "}; 114 // NSDictionary * dict3 ={ @ "name": @ "wangba", @ "desc": @ ""}; 115 // NSDictionary * dict4 ={ @ "name": @ "chiniupa", @ "desc": @" "}; 116 // NSDictionary * dict5 ={ @ "name": @ "danteng", @ "desc": @ "egg pain "}; 117 // 118 // NSArray * array = @ [dict1, dict2, dict3, dict4, dict5]; 119 120 121 // set photo 122 // first according to self. i. Take out the elements in the array, and then take out the 123 // self value corresponding to the key value of the element (dictionary. icon. image = [UIImage imageNamed: array [self. i] [@ "name"]; 124 // self. lastlab. text = array [self. i] [@ "desc"]; 125 // NSLog (@ "% @", array [self. i] [@ "desc"]); 126 127 self. icon. image = [UIImage imageNamed: self. array [self. i] [@ "name"]; 128 self. lastlab. text = self. array [self. i] [@ "desc"]; 129 130 [self. firstlab setText: [NSString stringWithFormat: @ "% d/5", self. I + 1]; 131 132 // switch (self. i) {133 // case // self. lastlab. te Xt = @ "all weak expressions! & Quot; 135 // self. icon. image = [UIImage imageNamed: @ "biaoqingdi"]; 136 // break; 137 // case // self. lastlab. text = @ "case"; 139 // self. icon. image = [UIImage imageNamed: @ "bingli"]; 140 // break; 141 // case // self. lastlab. text = @ ""; 143 // self. icon. image = [UIImage imageNamed: @ "wangba"]; 144 // break; 145 // case // self. lastlab. text = @ "eat steak"; 147 // self. icon. image = [UIImage imageNamed: @ "chiniupa"]; 14 8 // break; 149 // case 4:150 // self. lastlab. text = @ "It hurts! & Quot; 151 // self. icon. image = [UIImage imageNamed: @ "danteng"]; 152 // break; 153 //} 154 // click the control button. If it is 5, the right-click button fails. If it is 1, 155 self. leftbtn. enabled = (self. i! = 0); 156 self. rightbtn. enabled = (self. I! = 4); 157 158} 159 160 // get method of array 161-(NSArray *) array162 {163 NSLog (@ "array to be retrieved "); 164 // instantiate only once 165 if (_ array = nil) {166 NSLog (@ "instantiate array"); 167 NSDictionary * dict1 = @ {@ "name ": @ "biaoqingdi", @ "desc": @ "all weak expressions! "}; 168 NSDictionary * dict2 =@{@" name ": @" bingli ", @" desc ": @" case "}; 169 NSDictionary * dict3 =@ {@ "name": @ "wangba", @ "desc": @ ""}; 170 NSDictionary * dict4 ={ @ "name ": @ "chiniupa", @ "desc": @ ""}; 171 NSDictionary * dict5 ={ @ "name": @ "danteng", @ "desc ": @ "egg pain"}; 172 _ array = @ [dict1, dict2, dict3, dict4, dict5]; 173} 174 // NSDictionary * dict1 = @ {@ "name ": @ "biaoqingdi", @ "desc": @ "all weak expressions! "}; 175 // NSDictionary * dict2 = @ {@" name ": @" bingli ", @" desc ": @" case "}; 176 // NSDictionary * dict3 ={ @ "name": @ "wangba", @ "desc": @ ""}; 177 // NSDictionary * dict4 ={ @ "name": @ "chiniupa", @ "desc": @" "}; 178 // NSDictionary * dict5 ={ @ "name": @ "danteng", @ "desc": @ "egg pain "}; 179 180 // _ array = @ [dict1, dict2, dict3, dict4, dict5]; 181 return _ array; 182} 183 184 // press 185-(void) to the right) rightclick :( UIButton *) btn186 {187 self. I ++; 188 [self change]; 189} 190 191 // press 192-(void) leftclick (UIButton *) btn193 {194 self. I --; 195 [self change]; 196} 197 198 199-(void) didReceiveMemoryWarning200 {201 [super didReceiveMemoryWarning]; 202} 203 204 @ end

Note:

1> define control properties. Note: The properties must be strong. The sample code is as follows:

@ Property (nonatomic, strong) UIImageView * icon;

2> implement lazy loading in the getter method of the attribute. The sample code is as follows:

1-(UIImageView *) icon 2 3 {4 5 if (! _ Icon) {6 7 // The calculated location parameter 8 9 CGFloat imageW = 200; 10 11 CGFloat imageX = (320-imageW)/2; 12 13 CGFloat imageH = 200; 14 15 CGFloat imageY = 80; 16 17 // instantiate the Image view 18 19 _ icon = [[UIImageView alloc] initWithFrame: CGRectMake (imageX, imageY, imageW, imageH)]; 20 21 // Add the image View to the main view 22 23 [self. view addSubview: _ icon]; 24 25} 26 27 return _ icon; 28 29}

4. Use plist files

(1) The purpose of using the Plist file: To separate data from code

(2) Loading Method:

NSString * path = [[NSBundle mainBundle] pathForResource: @ "ImageData" ofType: @ "plist"];

_ ImageList = [NSArray arrayWithContentsOfFile: path];

Tip: File is usually used in the method, and the full path of the File must be passed as a parameter.

(3) Sample Code

1 // 2 // YYViewController. m 3 // 03-picture browser preliminary 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 # define POTOIMGW 200 12 # define POTOIMGH 300 13 # define POTOIMGX 60 14 # define POTOIMGY 50 15 16 17 @ interface YYViewController () 18 19 // variable declaration! 20 @ property (nonatomic, strong) UILabel * firstlab; 21 @ property (nonatomic, strong) UILabel * lastlab; 22 @ property (nonatomic, strong) UIImageView * icon; 23 @ property (nonatomic, strong) UIButton * leftbtn; 24 @ property (nonatomic, strong) UIButton * rightbtn; 25 26 @ property (nonatomic, strong) NSArray * array; 27 28-(void) change; 29 @ property (nonatomic, assign) int I; 30 @ end 31 32 @ implementation YYViewController 33 34-(void) viewDidLoad 35 {36 [super viewDidLoad]; 37 self. I = 0; 38 // create a lable control 39 UILabel * headlab = [[UILabel alloc] initWithFrame: CGRectMake (20, 10,300, 30)] to display the serial number. 40 41 // [headlab setText: @ "1/5"]; 42 [headlab setTextAlignment: NSTextAlignmentCenter]; 43 [headlab setTextColor: [UIColor blackColor]; 44 45 [self. view addSubview: headlab]; 46 self. firstlab = headlab; 47 48 49 50 // create a widget for image loading 51 UIImageView * potoimg = [[UIImageView alloc] Repository: CGRectMake (POTOIMGX, POTOIMGY, POTOIMGW, POTOIMGH)]; 52 53 UIImage * image = [UIImage imageNamed: @ "repository"]; 54 potoimg. image = image; 55 56 [self. view addSubview: potoimg]; 57 self. icon = potoimg; 58 59 // create the lable control of the bottom Description Image 60 UILabel * desclab = [[UILabel alloc] initWithFrame: CGRectMake (20,400,300, 30)]; 61 // [desclab setText: @ "weak expression! "]; 62 [desclab setTextAlignment: NSTextAlignmentCenter]; 63 [self. view addSubview: desclab]; 64 self. lastlab = desclab; 65 66 67 // create two arrow buttons 68 // set to custom type 69 // 1. use the class to create an object 70 UIButton * leftbtn = [UIButton buttonWithType: UIButtonTypeCustom]; 71 72 // 2. set object attributes (do not forget to set coordinates) 73 leftbtn. frame = CGRectMake (0, self. view. center. y, 40, 40); 74 [leftbtn setBackgroundImage: [UIImage imageNamed: @ "left_normal"] forState: UIC OntrolStateNormal]; 75 [leftbtn setBackgroundImage: [UIImage imageNamed: @ "left_highlighted"] forState: UIControlStateHighlighted]; 76 77 // 3. submit the object to view 78 [self. view addSubview: leftbtn]; 79 80 self. leftbtn = leftbtn; 81 [leftbtn addTarget: self action: @ selector (leftclick :) forControlEvents: Listener]; 82 83 84 UIButton * rightbtn = [UIButton resume: Listener]; 85 86 rightbt N. frame = CGRectMake (POTOIMGX + POTOIMGW + 10, self. view. center. y, 40, 40); 87 [rightbtn setBackgroundImage: [UIImage imageNamed: @ "right_normal"] forState: UIControlStateNormal]; 88 [rightbtn setBackgroundImage: [UIImage imageNamed: @ "right_highlighted"] forState: UIControlStateHighlighted]; 89 90 [self. view addSubview: rightbtn]; 91 92 self. rightbtn = rightbtn; 93 [rightbtn addTarget: self action: @ selector (righ Tclick :) forControlEvents: UIControlEventTouchUpInside]; 94 [self change]; 95} 96 97-(void) change 98 {99 self. icon. image = [UIImage imageNamed: self. array [self. i] [@ "name"]; 100 self. lastlab. text = self. array [self. i] [@ "desc"]; 101 102 [self. firstlab setText: [NSString stringWithFormat: @ "% d/5", self. I + 1]; 103 104 self. leftbtn. enabled = (self. i! = 0); 105 self. rightbtn. enabled = (self. I! = 4); 106 107} 108 109 // get method of array 110-(NSArray *) array111 {112 NSLog (@ "get array required "); 113 // instantiate only once 114 if (_ array = nil) {115 116 NSString * path = [[NSBundle mainBundle] pathForResource: @ "data" ofType: @ "plist"]; 117 // obtain data from the array 118 // _ array = [NSArray arrayWithContentsOfFile: path]; 119 _ array = [[NSArray alloc] initWithContentsOfFile: path]; 120 // print the position of the View package 121 NSLog (@ "% @", path); 122 123 NSLog (@ "instantiate array "); 124} 125 126 return _ array; 127} 128 129 // press 130-(void) rightclick (UIButton *) btn131 {132 self. I ++; 133 [self change]; 134} 135 136 // press 137-(void) leftclick (UIButton *) btn138 {139 self. I --; 140 [self change]; 141} 142 143-(void) didReceiveMemoryWarning144 {145 [super didReceiveMemoryWarning]; 146} 147 148 @ end

(4) plist File

(5) Effects <喎?http: www.bkjia.com kf ware vc " target="_blank" class="keylink"> VcD4KPHA + CjxpbWcgc3JjPQ = "http://www.2cto.com/uploadfile/Collfiles/20141009/2014100908182476.png" alt = "\" width = "290" height = "435">

5. Supplement

Development ideas:

1. Complete basic functions

2. Consider Performance

(1) (initialization operation, you can directly call change)

(2) to control the sequence number and image variables, use a dictionary instead of a switch.

(3) Each time you click, the dictionary needs to be created once, and the efficiency is low. You can consider creating this part to get the initialization method, so that you only need to create it once.

(4) Consider disadvantages (extremely strict code order requirements)

(5) lazy loading (loading only when needed, when is needed, and when the get method is called)

(6) Every time? Low Efficiency-only blank when the get method is called for the first time. In this case, an array is instantiated and created, and member variables are directly returned at other times (only once executed)

Note:

1. Call Stack (sequence) of methods ).

2. Use plist: to make data operations more flexible, to get data out, to remove coupling, so that coupling is not too strong. It is actually an xml, which is a special format defined by Apple.

3. bundle-package (read-only)