IOS Development UI Article-xib simple use example _ios

The blog has been applying for some time and it feels like it should write something up. This article is mainly about the simple usage of some xib, hoping to help the novice who just used xib.

What is Xib? What can xib do?

A file used to describe a software interface.

Without xib, all interfaces need to be created manually by code.

With Xib, you can visualize the development in Xib, and then load the Xib file, the system automatically generates the corresponding code to create the interface.

Similar to Xib, there are storyboard files. Comparison of Xib and storyboard, a lightweight one heavyweight.

Common:

are 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, used to describe multiple interfaces of the entire software, and to show the jump relationships between multiple interfaces

Second, the simple use of xib

1. Establishment of XIB documents
The established Xib file is named Appxib.xib
2. Set the Xib

Adjust view to free layout as required by the program
Create a view model (set parameters such as long width)
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:

YYVIEWCONTROLLER.M//10-xib File Usage///Created by Apple on 14-5-24. Copyright (c) 2014 itcase.
All rights reserved. #import "YYViewController.h" #import "YYapp.h" @interface Yyviewcontroller () @property (nonatomic,strong) Nsarray *ap
P @end @implementation yyviewcontroller//1. Load Data Information-(Nsarray *) app {if (!_app) {nsstring *path=[[nsbundle mainbund
    le]pathforresource:@ "App.plist" oftype:nil];
    
    Nsarray *temparray=[nsarray Arraywithcontentsoffile:path];
    Dictionary transfer Model Nsmutablearray *arraym=[nsmutablearray array];
    For (Nsdictionary *dict in Temparray) {[Arraym Addobject:[yyapp appwithdict:dict]];
  } _app=arraym;
return _app;
  //Create interface prototype-(void) viewdidload {[Super viewdidload];
  
  NSLog (@ "%d", self.app.count);
  Nine Sudoku layout int totalloc=3;
  CGFloat appvieww=80;
  CGFloat appviewh=90;
  
  CGFloat margin= (SELF.VIEW.FRAME.SIZE.WIDTH-TOTALLOC*APPVIEWW)/(totalloc+1);
  int count=self.app.count;
   for (int i=0; i<count; i++) { 
    int row=i/totalloc;
    int loc=i%totalloc;
    CGFloat Appviewx=margin + (margin +appvieww) *loc;
    CGFloat Appviewy=margin + (margin +appviewh) *row;
    
    Yyapp *app=self.app[i];
    Take out the Xib view Nsarray *apparray= [[NSBundle mainbundle]loadnibnamed:@ "Appxib" Owner:nil Options:nil];
    UIView *appview=[apparray Firstobject];
    
    Load View Appview.frame=cgrectmake (Appviewx, Appviewy, APPVIEWW, APPVIEWH);
    Uiimageview *appviewimg= (Uiimageview *) [Appview viewwithtag:1];
    
    Appviewimg.image=app.image;
    Uilabel *appviewlab= (Uilabel *) [Appview viewwithtag:2];
    
    Appviewlab.text=app.name;
    UIButton *appviewbtn= (UIButton *) [Appview Viewwithtag:3];
    [Appviewbtn addtarget:self Action: @selector (Appviewbtnclick:) forcontrolevents:uicontroleventtouchupinside];
    
    Appviewbtn.tag=i;
  [Self.view Addsubview:appview];
  }/** button's Click event/-(void) Appviewbtnclick: (UIButton *) btn {Yyapp *apps=self.app[btn.tag]; Uilabel *showlab=[[uilabel Alloc]initwiThframe:cgrectmake (60, 450, 200, 20)];
  [Showlab settext:[nsstring stringWithFormat: @ "%@ download Successful", Apps.name]];
  [Showlab Setbackgroundcolor:[uicolor Lightgraycolor]];
  [Self.view Addsubview:showlab];
  
  showlab.alpha=1.0;
  Simple animation effect [UIView animatewithduration:2.0 animations:^{showlab.alpha=0;
  } completion:^ (BOOL finished) {[Showlab Removefromsuperview];
}];

 } @end

Operation Effect:

Third, connect to the Xib sample

1. Wiring Example

Creates a new xib corresponding view class that inherits from UIView
To associate with a newly created view class in the upper-right corner of the Xib interface
Connect the xib with the view class
Note: Change the weak into a strong reference in use. Otherwise...

2. code example after wiring

The yyviewcontroller.m file code is as follows:

YYVIEWCONTROLLER.M//10-xib File Usage///Created by Apple on 14-5-24. Copyright (c) 2014 itcase.
All rights reserved. #import "YYViewController.h" #import "YYapp.h" #import "YYappview.h" @interface Yyviewcontroller () @property (nonatom
Ic,strong) Nsarray *app; @end @implementation yyviewcontroller//1. Load Data Information-(Nsarray *) app {if (!_app) {nsstring *path=[[nsbundle mainbund
    le]pathforresource:@ "App.plist" oftype:nil];
    
    Nsarray *temparray=[nsarray Arraywithcontentsoffile:path];
    Dictionary transfer Model Nsmutablearray *arraym=[nsmutablearray array];
    For (Nsdictionary *dict in Temparray) {[Arraym Addobject:[yyapp appwithdict:dict]];
  } _app=arraym;
return _app;
  //Create interface prototype-(void) viewdidload {[Super viewdidload];
  
  NSLog (@ "%d", self.app.count);
  Nine Sudoku layout int totalloc=3;
  CGFloat appvieww=80;
  CGFloat appviewh=90;
  
  CGFloat margin= (SELF.VIEW.FRAME.SIZE.WIDTH-TOTALLOC*APPVIEWW)/(totalloc+1);
  int count=self.app.count; for (int i=0;i<count;
    i++) {int row=i/totalloc;
    int loc=i%totalloc;
    CGFloat Appviewx=margin + (margin +appvieww) *loc;
    CGFloat Appviewy=margin + (margin +appviewh) *row;
    
    Yyapp *app=self.app[i];
    
    Take out the Xib view Nsarray *apparray= [[NSBundle mainbundle]loadnibnamed:@ "Appxib" Owner:nil Options:nil];
    Note the type name here!
    UIView *appview=[apparray Firstobject];
    
    Yyappview *appview=[apparray Firstobject];
     Load View Appview.frame=cgrectmake (Appviewx, Appviewy, APPVIEWW, APPVIEWH);
    
    [Self.view Addsubview:appview];
    Appview.appimg.image=app.image;
    Appview.applab.text=app.name;
    
    Appview.appbtn.tag=i;
    
  [Appview.appbtn addtarget:self Action: @selector (Appviewbtnclick:) forcontrolevents:uicontroleventtouchupinside];
  }/** button's Click event/-(void) Appviewbtnclick: (UIButton *) btn {Yyapp *apps=self.app[btn.tag];
  Uilabel *showlab=[[uilabel Alloc]initwithframe:cgrectmake (60, 450, 200, 20)]; [Showlab settext:[nsstring STRINGWITHFORmat: @ "%@ download Successful", Apps.name];
  [Showlab Setbackgroundcolor:[uicolor Lightgraycolor]];
  [Self.view Addsubview:showlab];
  
  showlab.alpha=1.0;
  Simple animation effect [UIView animatewithduration:2.0 animations:^{showlab.alpha=0;
  } completion:^ (BOOL finished) {[Showlab Removefromsuperview];
}];

 } @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

The above is the entire content of this article, I hope to help you learn, but also hope that we support the cloud habitat community.