IOS开发学习笔记030-xib实现淘宝界面
2015-05-21 18:02
603 查看
使用xib文件实现界面,然后通过模型更新数据。
指定NewCell的class为下面新建的NewCell类,这样可以拖线添加属性和方法。
源文件
实现文件如下:
还有plist文件的加载
源代码:http://pan.baidu.com/s/1kTswBjD
欢迎关注个人订阅号:
1、使得控制器继承自UITableViewController
2、创建xib文件,实现界面如下:一个UIImageView,两个lable
3、新建一个封装类NewCell,封装对xib界面的操作
4、新建一个模型类Shops对数据进行更新,读取字典数据到类中
5、在控制器中对模型数据进行操作,将结果显示到view中
1、使得控制器继承自UITableViewController
更改main.storyboard的主界面是UITableViewController的class为SLQViewController2、创建xib文件,实现界面如下:一个UIImageView,两个lable
指定NewCell的class为下面新建的NewCell类,这样可以拖线添加属性和方法。
3、新建一个封装类NewCell,封装对xib界面的操作
头文件// // NewCell.h // UITableViewCell-xib实现 // // Created by Christian on 15/5/21. // Copyright (c) 2015年 slq. All rights reserved. // #import <UIKit/UIKit.h> @class Shops; // 引用声明 @interface NewCell : UITableViewCell @property (weak, nonatomic) IBOutlet UIImageView *icon; // 图标 @property (weak, nonatomic) IBOutlet UILabel *name; // 标题 @property (weak, nonatomic) IBOutlet UILabel *desc; // 描述 @property (nonatomic,strong) Shops *shop; // shop对象 + (id)newCell; // 返回NewCell对象 + (NSString *)ID; // 返回标识 + (CGFloat)cellHeight; // 返回cell高度 @end
源文件
// // NewCell.m // UITableViewCell-xib实现 // // Created by Christian on 15/5/21. // Copyright (c) 2015年 slq. All rights reserved. // #import "NewCell.h" #import "Shops.h" @implementation NewCell - (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier { self = [super initWithStyle:style reuseIdentifier:reuseIdentifier]; if (self) { // Initialization code } return self; } - (void)awakeFromNib { // Initialization code } - (void)setSelected:(BOOL)selected animated:(BOOL)animated { [super setSelected:selected animated:animated]; // Configure the view for the selected state } // 返回NewCell对象 + (id)newCell { // 加载xib文件 return [[NSBundle mainBundle] loadNibNamed:@"NewCell" owner:nil options:nil][0]; } // 重写setShop方法 - (void)setShop:(Shops *)shop { // 标题 self.name.text = shop.name; // 图片 self.icon.image = [UIImage imageNamed:shop.icon]; // 描述 self.desc.text = shop.desc; } // 返回标识 + (NSString *)ID { return @"CELL"; } // 返回行高度 + (CGFloat)cellHeight { return 80; } @end
4、新建一个模型类Shops对数据进行更新,读取字典数据到类中
// // Shops.h // UITableViewCell-xib实现 // // Created by Christian on 15/5/21. // Copyright (c) 2015年 slq. All rights reserved. // #import <Foundation/Foundation.h> @interface Shops : NSObject @property (nonatomic,copy) NSString *name; // 标题 @property (nonatomic,copy) NSString *desc; // 描述 @property (nonatomic,copy) NSString *icon; // 图标 + (id)shopWithDict:(NSDictionary *)dict; // 返回shop对象 - (id)initWithDict:(NSDictionary *)dict; // 自定义构造方法 @end
实现文件如下:
// // Shops.m // UITableViewCell-xib实现 // // Created by Christian on 15/5/21. // Copyright (c) 2015年 slq. All rights reserved. // #import "Shops.h" @implementation Shops // 返回一个Shop对象 - (id)initWithDict:(NSDictionary *)dict { // 父类init if(self = [self init]) { // 赋值 self.name = dict[@"name"]; self.icon = dict[@"icon"]; self.desc = dict[@"desc"]; } // 返回self return self; } + (id)shopWithDict:(NSDictionary *)dict { return [[Shops alloc] initWithDict:dict]; } @end
5、在控制器中对模型数据进行操作,将结果显示到view中
主要是这两个方法:设置行和行内容-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section { return _data.count; } - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { // 1、取出循环池中得cell NewCell *cell = [tableView dequeueReusableCellWithIdentifier:[NewCell ID]]; // 2、如果cell不空 if(cell == nil) { cell = [NewCell newCell]; } // 3、设置cell内容 cell.shop = _data[indexPath.row]; return cell; }
还有plist文件的加载
- (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view, typically from a nib. _data = [NSMutableArray array]; //加载数据 NSArray *array = [NSArray arrayWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"shops.plist" ofType:nil]]; for (NSDictionary *arr in array) { [_data addObject:[Shops shopWithDict:arr]]; } // 设置行高度 self.tableView.rowHeight = [NewCell cellHeight]; }
源代码:http://pan.baidu.com/s/1kTswBjD
欢迎关注个人订阅号:
相关文章推荐
- IOS开发学习笔记031-代码实现微博界面
- IOS开发学习笔记034-UIScrollView-xib实现分页
- IOS开发学习笔记038-autolayout 自动布局 界面实现
- IOS开发学习笔记043-QQ聊天界面实现
- IOS学习笔记32—使用Storyboard实现复杂界面
- IOS开发学习笔记022-imageView实现动画
- IOS开发学习笔记025-xib和storyboard
- 【iOS学习笔记】界面开发UItextField定制全局组件_自定文字左边距、图标
- IOS开发学习笔记029-反选、全选、删除按钮的实现
- IOS开发学习笔记037-九宫格代码实现
- IOS开发学习笔记039-autolayout 代码实现
- IOS开发学习笔记039-autolayout 代码实现
- IOS开发---菜鸟学习之路--(十七)-利用UITableView实现个人信息界面
- 大钟的ios开发之旅(4)————简单谈谈ios程序界面实现的三种方式(代码创建,xib和storyboard)
- Android开发学习笔记一:Android启动界面的简单实现
- IOS开发使用纯代码开发界面_学习笔记
- Cocoa Touch 入门记——《精通 iOS 开发》学习心得(3) [标签栏实现多视图的方法(运用 xib)]
- IOS学习笔记32—使用Storyboard实现复杂界面
- IOS学习笔记(十二)之IOS开发之表视图(UITableView)的相关类,属性与表视图实现学习(二)
- Android开发学习笔记(六):最简单的办法实现APP欢迎界面