Simple use of the OS Development UI Chapter-xib

Simple use of the OS Development UI Chapter-xib

First, Brief introduction

Comparison of Xib and storyboard, a lightweight one heavyweight.

Common:

is used to describe the software interface

are edited using the Interface Builder tool.

Different points:

Xib is lightweight and is used to describe the local UI interface

Storyboard is a heavyweight, a multi-interface for describing the entire software, and the ability to show jump relationships between multiple interfaces

Second, the simple use of xib

1. Create a Xib file

The created Xib file is named Appxib.xib

2. Set the Xib

Adjust the view to a free layout, depending on the needs of the program

Create a view model (set length and width parameters)

Adjust the layout and internal controls

Single View after completion

3. code example using the Xib file

The yyviewcontroller.m file code is as follows:

 1//2//YYVIEWCONTROLLER.M 3//10-xib File use 4//5//Created by Apple on 14-5-24. 6//Copyright (c) 2014 itcase. All rights reserved. 7//8 9 #import "YYViewController.h" #import "YYapp.h" @interface Yyviewcontroller () @property (Nonatomic,stron         g) Nsarray *app;14 @end15 @implementation YYViewController17 18//1. Load Data Information-(Nsarray *) App20 {+ if (!_app) {22  NSString *path=[[nsbundle mainbundle]pathforresource:@ "app.plist" oftype:nil];23 NSArray *temparray=[NSArray         Arraywithcontentsoffile:path];24 25//dictionary to model Nsmutablearray *arraym=[nsmutablearray array];27         For (Nsdictionary *dict in Temparray) {[Arraym Addobject:[yyapp appwithdict:dict]];29}30     _app=arraym;31}32 return _app;33}34 35//Create interface prototype-(void) viewDidLoad37 {[+] [Super viewdidload];39 NSLog (@ "%d", self.app.count); 40 41//Nine grid layout int totalloc=3;43 cgfloat appvieww=80;44 cgfloat APPVIEWH =90;45 cgfloat margin= (SELF.VIEW.FRAME.SIZE.WIDTH-TOTALLOC*APPVIEWW)/(totalloc+1); int Count=self.app.count         ; i<count; for (int i=0; i++) {$ int row=i/totalloc;51 int loc=i%totalloc;52 CGFloat Appviewx=margin + (margin +appvieww) *loc;53 cgfloat appviewy=margin + (margin +appviewh) *row;54 YY App *app=self.app[i];55 56//Take out xib view Nsarray *apparray= [[NSBundle mainbundle]loadnibnamed:@] App Xib "Owner:nil options:nil];58 UIView *appview=[apparray firstobject];59//Load View APPVIEW.FRAME=CG Rectmake (Appviewx, Appviewy, APPVIEWW, APPVIEWH); Uiimageview *appviewimg= (Uiimageview *) [Appview vie wwithtag:1];63 appviewimg.image=app.image;64 UILabel *appviewlab= (UILabel *) [Appview Viewwithta          g:2];66 appviewlab.text=app.name;67 UIButton *appviewbtn= (UIButton *) [Appview viewwithtag:3];69 [APPVIEWBTN AddTarget:self Action: @selector (Appviewbtnclick:) forcontrolevents:uicontroleventtouchupinside];70 appviewbtn.tag=i; [Self.view addsubview:appview];73}74}75 76/** button click event */77-(void) Appviewbtnclick: (UIButton *) b tn78 {yyapp *apps=self.app[btn.tag];80 UILabel *showlab=[[uilabel alloc]initwithframe:cgrectmake (60, 450, 200,  ];81 [Showlab settext:[nsstring stringWithFormat: @ "%@ download succeeded", apps.name]];82 [Showlab Setbackgroundcolor:[uicolor lightgraycolor]];83 [Self.view addsubview:showlab];84 showlab.alpha=1.0;85 86//simple animated effect [UIView ANI] matewithduration:2.0 animations:^{88 showlab.alpha=0;89} completion:^ (BOOL finished) {[Showlab REM] ovefromsuperview];91}];92}93 94 @end

Operating effect:

III. Wiring examples for xib

1. Wiring Example

Create a new view class for Xib, inherited from UIView

Associating the new view class in the upper-right corner of the Xib interface

Connect the xib with the view class

Note: In use, change the weak to a strong reference. Otherwise...

2. Code samples after wiring

The yyviewcontroller.m file code is as follows:

 1//2//YYVIEWCONTROLLER.M 3//10-xib File use 4//5//Created by Apple on 14-5-24. 6//Copyright (c) 2014 itcase. All rights reserved. 7//8 9 #import "YYViewController.h" #import "YYapp.h" #import "YYappview.h" @interface Yyviewcontroller () 14 @ Property (Nonatomic,strong) Nsarray *app;15 @end16 @implementation YYViewController18 19//1. Load Data Information-(Nsarray *)         APP21 {!_app) {nsstring *path=[[nsbundle mainbundle]pathforresource:@ "App.plist" oftype:nil];24 Nsarray *temparray=[nsarray arraywithcontentsoffile:path];25 26//Dictionary to model Nsmutablearray *arra Ym=[nsmutablearray array];28 for (nsdictionary *dict in Temparray) {Arraym Addobject:[yyapp appwi      thdict:dict]];30}31 _app=arraym;32}33 return _app;34}35 36//Create Interface prototype PNS-(void) VIEWDIDLOAD38 {39 [Super Viewdidload];40 NSLog (@ "%d", Self.app.count); 41 42//Nine grid layout int totalloc=3;44 cgfloat APPV Ieww=80;45 cgfloat appviewh=90;46 cgfloat margin= (SELF.VIEW.FRAME.SIZE.WIDTH-TOTALLOC*APPVIEWW)/(totalloc+1); 47 48 int count=self.app.count;49 for (int i=0; i<count; i++) {n. int row=i/totalloc;52 int Lo c=i%totalloc;53 cgfloat Appviewx=margin + (margin +appvieww) *loc;54 cgfloat appviewy=margin + (margin +app VIEWH) *row;55 Yyapp *app=self.app[i];56 57//Take out xib view Nsarray *apparray= [[NSBundle mainb undle]loadnibnamed:@ "Appxib" Owner:nil options:nil];59 60//Note here the type name!61//uiview *appview=[apparra Y firstobject];62 yyappview *appview=[apparray firstobject];63 64//Load View x appview.frame=c Grectmake (Appviewx, Appviewy, APPVIEWW, APPVIEWH); [Self.view addsubview:appview];67] Appvie w.appimg.image=app.image;69 appview.applab.text=app.name;70 appview.appbtn.tag=i;71 [A PPVIEW.APPBTN AddTarget:Self action: @selector (Appviewbtnclick:) forcontrolevents:uicontroleventtouchupinside];73 74}75}76 77/** button click Event */78-(void) Appviewbtnclick: (UIButton *) btn79 {Yyapp *apps=self.app[btn.tag];81 UILabel *showlab=[[uilabel al Loc]initwithframe:cgrectmake (Max,];82, max) [Showlab settext:[nsstring stringWithFormat: @ "%@ download Successful", Apps.name] ; [Showlab setbackgroundcolor:[uicolor lightgraycolor]];84 [Self.view addsubview:showlab];85 showlab.alpha=1 .0;86 87//Simple animation effect of [UIView animatewithduration:2.0 animations:^{89 showlab.alpha=0;90} completi on:^ (BOOL finished) {Showlab removefromsuperview];92}];93}94 @end

YYappview.h file code (already wired)

#import <UIKit/UIKit.h> @interface Yyappview:uiview@property (Strong, nonatomic) Iboutlet Uiimageview *appimg;@ Property (Strong, Nonatomic) Iboutlet UILabel *applab; @property (Strong, nonatomic) Iboutlet UIButton *appbtn; @end

Simple use of the OS Development UI Chapter-xib