iOS開發UI篇—xib的簡單使用

一、簡單介紹

xib和storyboard的比較,一個輕量級一個重量級。

共同點:

都用來描述軟件界面

都用Interface Builder工具來編輯

不同點:

Xib是輕量級的,用來描述局部的UI界面

Storyboard是重量級的,用來描述整個軟件的多個界面,并且能展示多個界面之間的跳轉關系

二、xib的簡單使用

1.建立xib文件

建立的xib文件命名為appxib.xib

2.對xib進行設置

  根據程序的需要,這里把view調整為自由布局

建立view模型(設置長寬等參數)

調整布局和內部的控件

?

完成后的單個view

3.使用xib文件的代碼示例

YYViewController.m文件代碼如下:

 1 //
 2 //  YYViewController.m
 3 //  10-xib文件的使用
 4 //
 5 //  Created by apple on 14-5-24.
 6 //  Copyright (c) 2014年 itcase. All rights reserved.
 7 //
 8 
 9 #import "YYViewController.h"
10 #import "YYapp.h"
11 
12 @interface YYViewController ()
13 @property(nonatomic,strong)NSArray *app;
14 @end
15 
16 @implementation YYViewController
17 
18 //1.加載數據信息
19 -(NSArray *)app
20 {
21     if (!_app) {
22         NSString *path=[[NSBundle mainBundle]pathForResource:@"app.plist" ofType:nil];
23         NSArray *temparray=[NSArray arrayWithContentsOfFile:path];
24         
25         //字典轉模型
26         NSMutableArray *arrayM=[NSMutableArray array ];
27         for (NSDictionary *dict in temparray) {
28             [arrayM addObject:[YYapp appWithDict:dict]];
29         }
30         _app=arrayM;
31     }
32     return _app;
33 }
34 
35 //創建界面原型
36 - (void)viewDidLoad
37 {
38     [super viewDidLoad];
39     NSLog(@"%d",self.app.count);
40     
41     //九宮格布局
42     int totalloc=3;
43     CGFloat appviewW=80;
44     CGFloat appviewH=90;
45     CGFloat margin=(self.view.frame.size.width-totalloc*appviewW)/(totalloc+1);
46     
47     int count=self.app.count;
48     for (int i=0; i<count; i++) {
49         
50         int row=i/totalloc;
51         int loc=i%totalloc;
52         CGFloat appviewX=margin + (margin +appviewW)*loc;
53         CGFloat appviewY=margin + (margin +appviewH)*row;
54         YYapp *app=self.app[i];
55         
56         //拿出xib視圖
57        NSArray  *apparray= [[NSBundle mainBundle]loadNibNamed:@"appxib" owner:nil options:nil];
58         UIView *appview=[apparray firstObject];
59         //加載視圖
60         appview.frame=CGRectMake(appviewX, appviewY, appviewW, appviewH);
61         
62         UIImageView *appviewImg=(UIImageView *)[appview viewWithTag:1];
63         appviewImg.image=app.image;
64         
65         UILabel *appviewlab=(UILabel *)[appview viewWithTag:2];
66         appviewlab.text=app.name;
67         
68         UIButton *appviewbtn=(UIButton *)[appview viewWithTag:3];
69         [appviewbtn addTarget:self action:@selector(appviewbtnClick:) forControlEvents:UIControlEventTouchUpInside];
70         appviewbtn.tag=i;
71         
72         [self.view addSubview:appview];
73     }
74 }
75 
76 /**按鈕的點擊事件*/
77 -(void)appviewbtnClick:(UIButton *)btn
78 {
79     YYapp *apps=self.app[btn.tag];
80     UILabel *showlab=[[UILabel alloc]initWithFrame:CGRectMake(60, 450, 200, 20)];
81     [showlab setText:[NSString stringWithFormat: @"%@下載成功",apps.name]];
82     [showlab setBackgroundColor:[UIColor lightGrayColor]];
83     [self.view addSubview:showlab];
84     showlab.alpha=1.0;
85     
86     //簡單的動畫效果
87     [UIView animateWithDuration:2.0 animations:^{
88         showlab.alpha=0;
89     } completion:^(BOOL finished) {
90         [showlab removeFromSuperview];
91     }];
92 }
93 
94 @end

?

運行效果:

三、對xib進行連線示例

1.連線示例

新建一個xib對應的視圖類,繼承自Uiview

?


在xib界面右上角與新建的視圖類進行關聯

把xib和視圖類進行連線

2.連線后的代碼示例

YYViewController.m文件代碼如下:

 1 //
 2 //  YYViewController.m
 3 //  10-xib文件的使用
 4 //
 5 //  Created by apple on 14-5-24.
 6 //  Copyright (c) 2014年 itcase. All rights reserved.
 7 //
 8 
 9 #import "YYViewController.h"
10 #import "YYapp.h"
11 #import "YYappview.h"
12 
13 @interface YYViewController ()
14 @property(nonatomic,strong)NSArray *app;
15 @end
16 
17 @implementation YYViewController
18 
19 //1.加載數據信息
20 -(NSArray *)app
21 {
22     if (!_app) {
23         NSString *path=[[NSBundle mainBundle]pathForResource:@"app.plist" ofType:nil];
24         NSArray *temparray=[NSArray arrayWithContentsOfFile:path];
25         
26         //字典轉模型
27         NSMutableArray *arrayM=[NSMutableArray array ];
28         for (NSDictionary *dict in temparray) {
29             [arrayM addObject:[YYapp appWithDict:dict]];
30         }
31         _app=arrayM;
32     }
33     return _app;
34 }
35 
36 //創建界面原型
37 - (void)viewDidLoad
38 {
39     [super viewDidLoad];
40     NSLog(@"%d",self.app.count);
41     
42     //九宮格布局
43     int totalloc=3;
44     CGFloat appviewW=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++) {
50         
51         int row=i/totalloc;
52         int loc=i%totalloc;
53         CGFloat appviewX=margin + (margin +appviewW)*loc;
54         CGFloat appviewY=margin + (margin +appviewH)*row;
55         YYapp *app=self.app[i];
56         
57         //拿出xib視圖
58        NSArray  *apparray= [[NSBundle mainBundle]loadNibNamed:@"appxib" owner:nil options:nil];
59         
60         //注意這里的類型名!
61         //UIView *appview=[apparray firstObject];
62         YYappview  *appview=[apparray firstObject];
63        
64         //加載視圖
65         appview.frame=CGRectMake(appviewX, appviewY, appviewW, appviewH);
66           [self.view addSubview:appview];
67         
68         appview.appimg.image=app.image;
69         appview.applab.text=app.name;
70         appview.appbtn.tag=i;
71         
72         [ appview.appbtn addTarget:self action:@selector(appviewbtnClick:) forControlEvents:UIControlEventTouchUpInside];
73        
74     }
75 }
76 
77 /**按鈕的點擊事件*/
78 -(void)appviewbtnClick:(UIButton *)btn
79 {
80     YYapp *apps=self.app[btn.tag];
81     UILabel *showlab=[[UILabel alloc]initWithFrame:CGRectMake(60, 450, 200, 20)];
82     [showlab setText:[NSString stringWithFormat: @"%@下載成功",apps.name]];
83     [showlab setBackgroundColor:[UIColor lightGrayColor]];
84     [self.view addSubview:showlab];
85     showlab.alpha=1.0;
86     
87     //簡單的動畫效果
88     [UIView animateWithDuration:2.0 animations:^{
89         showlab.alpha=0;
90     } completion:^(BOOL finished) {
91         [showlab removeFromSuperview];
92     }];
93 }
94 
95 @end

YYappview.h文件代碼(已經連線)

#import <UIKit/UIKit.h>@interface YYappview : UIView
@property (weak, nonatomic) IBOutlet UIImageView *appimg;
@property (weak, nonatomic) IBOutlet UILabel *applab;
@property (weak, nonatomic) IBOutlet UIButton *appbtn;
@end

?

轉載于:https://www.cnblogs.com/zengshuilin/p/5740689.html

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/457497.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/457497.shtml
英文地址,請注明出處:http://en.pswp.cn/news/457497.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

【云棲計算之旅】線下沙龍第2期精彩預告:Docker在云平臺上的最佳實踐

Docker是一個開源的應用容器引擎&#xff0c;提供了一種在安全、可重復的環境中自動部署軟件的方式&#xff0c;允許開發者將他們的應用和依賴包打包到一個可移植的容器中&#xff0c;然后發布到任何流行的Linux機器上&#xff0c;也可以實現虛擬化。容器完全使用沙箱機制&…

小程序mpvue圖片繪制水印_開發筆記:使用 mpvue 開發斗圖小程序

之前用過 wepy 框架寫了個小程序 GitHub - yshkk/shanbay-mina: 基于 wepy 框架的 “扇貝閱讀” 微信小程序 &#xff0c;感覺寫法上類似 vue&#xff0c;但不那么徹底。現在美團點評發布的 mpvue 支持開發者可以用 vue 的語法開發微信小程序&#xff0c;正好有強需求需要一個斗…

mysql int類型的長度值

整數類型的存儲和范圍(來自mysql手冊) 類型字節最小值最大值(帶符號的/無符號的)(帶符號的/無符號的)TINYINT1-1281270255SMALLINT2-3276832767065535MEDIUMINT3-83886088388607016777215INT4-2147483648214748364704294967295BIGINT8-92233720368547758089223372036854775807…

龍王我當定了(一個在QQ刷龍王的腳本)

自從學了python&#xff0c;龍王再也沒丟過&#xff0c;就是經常被打, QQ 和 TIM 都可以&#xff0c;發送時要把聊天窗口打開。 # 如果import報錯&#xff0c;那可以pip下載這幾個模塊試一試 import win32gui import win32con import win32clipboard as w import random from…

時序數據合并場景加速分析和實現 - 復合索引,窗口分組查詢加速,變態遞歸加速...

時序數據合并場景加速分析和實現 - 復合索引&#xff0c;窗口分組查詢加速&#xff0c;變態遞歸加速 作者 digoal 日期 2016-11-28 標簽 PostgreSQL , 數據合并 , 時序數據 , 復合索引 , 窗口查詢 背景 在很多場景中&#xff0c;都會有數據合并的需求。 例如記錄了表的變更明細…

navicat for mysql 數據庫備份與還原

一, 首先設置, 備份保存路徑 工具 -> 選項 點開 其他 -> 日志文件保存路徑 二. 開始備份 備份分兩種, 一種是以sql保存, 一種是保存為備份 SQL保存 右鍵點擊你要備份的數據庫, -> 轉儲SQL文件 選擇位置和文件名 開始轉儲 導入 建議 刪除所有表 或 重新建數據庫 同導出…

DES的原理及python實現

DES加密算法原理及實現 DES是一種對稱加密算法【即發送者與接收者持有相同的密鑰】&#xff0c;它的基本原理是將要加密的數據劃分為n個64位的塊&#xff0c;然后使用一個56位的密鑰逐個加密每一個64位的塊&#xff0c;得到n個64位的密文塊&#xff0c;最后將密文塊拼接起來得…

python按身高體重排隊_LeetCode-python 406.根據身高重建隊列

題目鏈接難度&#xff1a;中等 類型&#xff1a; 數組假設有打亂順序的一群人站成一個隊列。 每個人由一個整數對(h, k)表示&#xff0c;其中h是這個人的身高&#xff0c;k是排在這個人前面且身高大于或等于h的人數。 編寫一個算法來重建這個隊列。注意&#xff1a;總人數…

遠程連接mysql數據庫,1130問題

遠程或使用非127.0.0.1和localhost地址連接時&#xff0c;出現代號為1130問題&#xff0c; ERROR 1130: Host 192.168.2.159 is not allowed to connect to this MySQL server 猜想這是沒有授權&#xff0c;將mysql數據庫中user表中host列的localhost改為%&#xff0c;重新啟動…

華為手機充滿有提醒嗎_2020手機充電速度排名:最快21分鐘充滿,華為第15名

5G手機扎堆出現&#xff0c;中國5G基站數量也是不斷增多&#xff0c;中國移動曾經表態&#xff0c;2020年底將會在全國地級市覆蓋5G網絡&#xff0c;全民5G時代終于到來&#xff01;從目前國內手機出貨量數據來看&#xff0c;5G手機占比已經達到了六成以上&#xff0c;國產5G手…

關于移動手機端富文本編輯器qeditor圖片上傳改造

日前項目需要在移動端增加富文本編輯&#xff0c;上網找了下&#xff0c;大多數都是針對pc版的&#xff0c;不太兼容手機&#xff0c;當然由于手機屏幕小等原因也限制富文本編輯器的眾多強大功能&#xff0c;所以要找的編輯器功能必須是精簡的。 找了好久&#xff0c;發現qedit…

【python】生成器

生成器 直接總結 創建生成器的方法 生成器表達式&#xff1a;(i for i in [1, 2])yield: 函數中出現yield這個函數就是生成器&#xff0c;函數&#xff08;生成器&#xff09;執行到yield時會返回yield后面的值&#xff0c;并暫停&#xff0c;知道下次被喚醒后會從暫停處接著…

python redis 性能測試臺_Redis性能測試

Redis 性能測試Redis 性能測試是通過同時執行多個命令實現的。Redis性能測試主要是通過src文件夾下的redis-benchmark來實現(Linux系統下)語法redis 性能測試的基本命令如下&#xff1a;redis-benchmark [option] [option value]實例以下實例同時執行 10000 個請求來檢測性能&a…

Java IO 系統

Java IO系統 File類 用來處理文件目錄&#xff0c;既可以代表一個特定文件的名稱&#xff0c;也可以代表一組文件的名稱&#xff0c;如果代表的是一個文件組&#xff0c;可以調用File.list()方法返回一個字符數組。 list()不傳遞任何參數時返回該目錄下所有文件或文件名的字…

Linux Crontab 任務管理工具命令以及示例

Crontab 是 Linux 平臺下的一款用于循環執行例行任務的工具,Linux 系統由 cron (crond) 這個系統服務來控制任務 , Linux系統本來就有很多的計劃任務需要啟動 , 所以這個系統服務是默認開機啟動的 。 Linux 為使用者提供的計劃任務的命令就是 Crontab Crontab 是 Linux 下用來周…

Linux 網絡編程詳解一(IP套接字結構體、網絡字節序,地址轉換函數)

IPv4套接字地址結構 struct sockaddr_in {uint8_t sinlen;&#xff08;4個字節&#xff09;sa_family_t sin_family;&#xff08;4個字節&#xff09;in_port_t sin_port;&#xff08;2個字節&#xff09;struct in_addr sin_addr;&#xff08;4個字節&#xff09;char sin_zer…

地籍cad的lisp程序大集合_AutoCAD-LISP程序100例

{:soso_e179:}AutoCAD-LISP程序100例.JPG (143.82 KB, 下載次數: 28)2011-10-18 14:42 上傳有說明很好&#xff01;頂如果您使用 AutoCAD,下面的內容對您一定有幫助。在某些方面能大大提高您的工作效率。下面的程序均以源程序方式給出&#xff0c;您可以使用、參考、修改它。bg…

javascript中數組的22種方法

前面的話數組總共有22種方法&#xff0c;本文將其分為對象繼承方法、數組轉換方法、棧和隊列方法、數組排序方法、數組拼接方法、創建子數組方法、數組刪改方法、數組位置方法、數組歸并方法和數組迭代方法共10類來進行詳細介紹對象繼承方法數組是一種特殊的對象&#xff0c;繼…

javascript/jquery高度寬度詳情解說分析

為什么80%的碼農都做不了架構師&#xff1f;>>> 一、window對象表示瀏覽器中打開的窗口 二、window對象可以省略 一、document對象是window對象的一部分 二、瀏覽器的HTML文檔成為Document對象 window.location和document.location window對象的location屬性引用的…

農用地包括哪些地類_土地地類一覽表

一級類二級類三級類含義編號三大類名稱編號名稱編號名稱1農用地指直接用于農業生產的土地&#xff0c;包括耕地&#xff0c;園地&#xff0c;林地&#xff0c;牧草地及其他的農業用地11耕地指種植農作物、土地&#xff0c;包括熟地、新開發復墾整理地&#xff0c;休閑地、輪歇地…