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.mzph.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;休闲地、轮歇地…