iOS开发UI篇—使用嵌套模型完成的一个简单汽车图标展示程序

简介:

一、plist文件和项目结构图

说明:这是一个嵌套模型的示例

二、代码示例:

YYcarsgroup.h文件代码:

复制代码
 1 //  2 // YYcarsgroup.h
 3 // 07-汽车展示(高级)
 4 //  5 // Created by apple on 14-5-28.
 6 // Copyright (c) 2014年 itcase. All rights reserved.
 7 //
 8  9 #import <Foundation/Foundation.h>
10 11 @interface YYcarsgroup : NSObject
12 @property(nonatomic,copy)NSString *title;
13 @property(nonatomic,strong)NSArray *cars;
14 15 -(instancetype)initWithDict:(NSDictionary *)dict;
16 +(instancetype)carsgroupWithDict:(NSDictionary *)dict;
17 @end
复制代码

YYcarsgroup.m文件代码:

复制代码
 1 //  2 // YYcarsgroup.m
 3 // 07-汽车展示(高级)
 4 //  5 // Created by apple on 14-5-28.
 6 // Copyright (c) 2014年 itcase. All rights reserved.
 7 //
 8  9 #import "YYcarsgroup.h" 10 #import "YYcars.h" 11 12 @implementation YYcarsgroup
13 -(instancetype)initWithDict:(NSDictionary *)dict
14 {
15 if (self=[super init]) {
16 //嵌套的字典转模型 17 self.title=dict[@"title"];
18 19 //注意 20 NSArray *dictcars=dict[@"cars"];
21 //像下面这样写可以提高性能 22 NSMutableArray *arrayM=[NSMutableArray arrayWithCapacity:dictcars.count];
23 for (NSDictionary *dict in dictcars) {
24 YYcars *yycars=[[YYcars alloc]initWithDict:dict];
25  [arrayM addObject:yycars];
26  }
27 // 赋值存储模型的数组给属性 28 self.cars=arrayM;
29  }
30 return self;
31 }
32 33 +(instancetype)carsgroupWithDict:(NSDictionary *)dict
34 {
35 return [[self alloc]initWithDict:dict];
36 }
37 @end
复制代码

YYcars.h文件

复制代码
 1 //  2 // YYcars.h
 3 // 07-汽车展示(高级)
 4 //  5 // Created by apple on 14-5-28.
 6 // Copyright (c) 2014年 itcase. All rights reserved.
 7 //
 8  9 #import <Foundation/Foundation.h>
10 11 @interface YYcars : NSObject
12 @property(nonatomic,copy)NSString *name;
13 @property(nonatomic,copy)NSString *icon;
14 15 -(instancetype)initWithDict:(NSDictionary *)dict;
16 +(instancetype)carsWithDict:(NSDictionary *)dict;
17 @end
复制代码

YYcars.m文件

复制代码
 1 //  2 // YYcars.m
 3 // 07-汽车展示(高级)
 4 //  5 // Created by apple on 14-5-28.
 6 // Copyright (c) 2014年 itcase. All rights reserved.
 7 //
 8  9 #import "YYcars.h" 10 11 @implementation YYcars
12 13 -(instancetype)initWithDict:(NSDictionary *)dict
14 {
15 if (self=[super init]) {
16 self.name=dict[@"name"];
17 self.icon=dict[@"icon"];
18  }
19 return self;
20 }
21 +(instancetype)carsWithDict:(NSDictionary *)dict
22 {
23 return [[self alloc]initWithDict:dict];
24 }
25 @end
复制代码

YYViewController.m文件

复制代码
 1 //  2 // YYViewController.m
 3 // 07-汽车展示(高级)
 4 //  5 // Created by apple on 14-5-28.
 6 // Copyright (c) 2014年 itcase. All rights reserved.
 7 //
 8  9 #import "YYViewController.h"  10 #import "YYcarsgroup.h"  11 #import "YYcars.h"  12  13 @interface YYViewController ()<UITableViewDataSource>
 14 @property (strong, nonatomic) IBOutlet UITableView *tableview;
 15 @property(nonatomic,strong) NSArray *car;
 16 @end  17  18 @implementation YYViewController
 19  20 - (void)viewDidLoad
 21 {
 22  [super viewDidLoad];
 23  24 self.tableview.rowHeight=60.f;
 25 self.tableview.dataSource=self;
 26 NSLog(@"%d",self.car.count);
 27 }
 28 #pragma mark- 实现懒加载
 29 //1.从包中读取数据
 30 //2.字典转模型
 31 //3.返回cars  32 -(NSArray *)car
 33 {
 34 if (_car==nil) {
 35  36 NSString *fullpath= [[NSBundle mainBundle]pathForResource:@"cars_total.plist" ofType:nil];
 37 NSArray *arrayM=[NSArray arrayWithContentsOfFile:fullpath];
 38  39 NSMutableArray *carsarray=[NSMutableArray array];
 40 for (NSDictionary *dict in arrayM) {
 41 YYcarsgroup *carsgroup=[YYcarsgroup carsgroupWithDict:dict];
 42  [carsarray addObject:carsgroup];
 43  }
 44 _car=[carsarray copy];
 45  }
 46 return _car;
 47 }
 48  49  50 #pragma mark- 实现tableview的数据展示
 51 //1.设置数据源,遵守协议
 52 //2.返回组
 53 //3.返回行
 54 //4.每组每行对应的数据
 55 //4.1去缓存中去取cell
 56 //4.2若没有,则创建cell,并盖章
 57 //4.3设置cell的数据
 58 //4.4返回cell  59  60 -(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
 61 {
 62 return self.car.count;
 63 }
 64 -(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
 65 {
 66 YYcarsgroup *carsgroup=self.car[section];
 67 return carsgroup.cars.count;
 68 }
 69 -(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
 70 {
 71 static NSString *identifier=@"car";
 72 //4.1去缓存中去取cell  73 UITableViewCell *cell=[tableView dequeueReusableCellWithIdentifier:identifier];
 74 //4.2若没有,则创建cell,并盖章  75 if (cell==nil) {
 76 cell=[[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:identifier];
 77  }
 78 //4.3设置cell的数据
 79 //设置对应的组  80 YYcarsgroup *carsgroup=self.car[indexPath.section];
 81 //设置对应的行  82 YYcars *yycars=carsgroup.cars[indexPath.row];
 83  84 cell.imageView.image=[UIImage imageNamed:yycars.icon];
 85 cell.textLabel.text=yycars.name;
 86 //4.4返回cell  87 return cell;
 88 }
 89  90 //设置每组的标题  91 -(NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section
 92 {
 93 YYcarsgroup *carsgroup=self.car[section];
 94 return carsgroup.title;
 95 }
 96  97 //设置索引  98 -(NSArray *)sectionIndexTitlesForTableView:(UITableView *)tableView
 99 {
100 //利用kvc取出所有的标题 101 NSArray *title=[self.car valueForKeyPath:@"title"];
102 return title;
103 }
104 105 //隐藏状态栏 106 -(BOOL)prefersStatusBarHidden
107 {
108 return YES;
109 }
110 @end
复制代码

实现效果:

三、注意点

1.设置索引

代码如下:

复制代码
//设置索引
-(NSArray *)sectionIndexTitlesForTableView:(UITableView *)tableView
{
 //利用kvc取出所有的标题
 NSArray *title=[self.car valueForKeyPath:@"title"];
 return title;
}
复制代码

2.cell的性能优化

代码如下:

复制代码
 static NSString *identifier=@"car";
 //4.1去缓存中去取cell
 UITableViewCell *cell=[tableView dequeueReusableCellWithIdentifier:identifier];
 //4.2若没有,则创建cell,并盖章 if (cell==nil) {
 cell=[[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:identifier];
 }
复制代码

请注意:cell内部数据处理的细节。(如何节省内存?)

目录
相关文章
|
9月前
|
机器学习/深度学习 算法 定位技术
Baumer工业相机堡盟工业相机如何通过YoloV8深度学习模型实现裂缝的检测识别(C#代码UI界面版)
本项目基于YOLOv8模型与C#界面,结合Baumer工业相机,实现裂缝的高效检测识别。支持图像、视频及摄像头输入,具备高精度与实时性,适用于桥梁、路面、隧道等多种工业场景。
1172 27
|
11月前
|
开发框架 前端开发 JavaScript
【HarmonyOS Next之旅】基于ArkTS开发(二) -> UI开发一
本文介绍了方舟开发框架(ArkUI)及其两种开发范式:基于ArkTS的声明式开发范式和类Web开发范式。ArkUI是用于构建HarmonyOS应用界面的UI框架,提供极简UI语法和基础设施。声明式开发范式使用ArkTS语言,以组件、动画和状态管理为核心,适合复杂团队协作;类Web开发范式采用HML、CSS、JavaScript三段式开发,适用于简单界面应用,贴近Web开发者习惯。文中还概述了两者的架构和基础能力,帮助开发者选择合适的范式进行高效开发。
374 15
|
11月前
|
编解码 前端开发 Java
【HarmonyOS Next之旅】基于ArkTS开发(二) -> UI开发三
本文介绍了基于声明式UI范式的图形绘制与动画效果实现方法,涵盖绘制图形、添加动画效果及常见组件说明三部分内容。在绘制图形部分,详细讲解了如何通过Circle组件为食物成分表添加圆形标签,以及使用Path组件结合SVG命令绘制自定义图形(如应用Logo)。动画效果部分则展示了如何利用animateTo实现闪屏动画,包括渐出、放大效果,并设置页面跳转;同时介绍了页面间共享元素转场动画的实现方式。最后,文章列举了声明式开发范式中的各类组件及其功能,帮助开发者快速上手构建复杂交互页面。
389 11
|
7月前
|
存储 消息中间件 人工智能
【04】AI辅助编程完整的安卓二次商业实战-寻找修改替换新UI首页图标-菜单图标-消息列表图标-优雅草伊凡
【04】AI辅助编程完整的安卓二次商业实战-寻找修改替换新UI首页图标-菜单图标-消息列表图标-优雅草伊凡
484 4
|
7月前
|
存储 开发者 容器
鸿蒙 HarmonyOS NEXT星河版APP应用开发-ArkTS面向对象及组件化UI开发使用实例
本文介绍了ArkTS语言中的Class类、泛型、接口、模块化、自定义组件及状态管理等核心概念,并结合代码示例讲解了对象属性、构造方法、继承、静态成员、访问修饰符等内容,同时涵盖了路由管理、生命周期和Stage模型等应用开发关键知识点。
530 1
鸿蒙 HarmonyOS NEXT星河版APP应用开发-ArkTS面向对象及组件化UI开发使用实例
|
10月前
|
JavaScript 前端开发 UED
【HarmonyOS Next之旅】基于ArkTS开发(二) -> UI开发四
本文介绍了Web组件开发与性能优化的相关内容。在Web组件开发部分,涵盖创建组件、设置样式与属性、添加事件和方法以及场景示例,如动态播放视频。性能提升方面,推荐使用数据懒加载、条件渲染替代显隐控制、Column/Row替代Flex、设置List组件宽高及调整cachedCount减少滑动白块等方法,以优化应用性能与用户体验。
345 56
|
10月前
|
编解码 UED 开发者
【HarmonyOS Next之旅】基于ArkTS开发(二) -> UI开发之常见布局
本文主要介绍了自适应布局与响应式布局的相关内容。自适应布局部分涵盖线性布局、层叠布局、弹性布局和网格布局,详细说明了各布局的特性及使用方法,例如线性布局中的排列、拉伸与缩放,弹性布局的方向、换行与对齐方式等。响应式布局则重点讲解了栅格系统和媒体查询,阐述如何通过栅格组件和媒体查询条件实现不同设备上的适配效果。这些技术帮助开发者灵活应对多尺寸屏幕的设计需求,提升用户体验。
504 55
|
11月前
|
存储 开发框架 API
【HarmonyOS Next之旅】基于ArkTS开发(二) -> UI开发二
本文详细介绍了基于声明式UI开发的健康饮食应用的设计与实现过程。内容涵盖从基础环境搭建到复杂功能实现的全流程,包括创建简单视图、构建布局(如Stack、Flex)、数据模型设计、列表与网格布局构建,以及页面跳转和数据传递等核心功能。 本文通过实际案例深入浅出地解析了声明式UI开发的关键技术和最佳实践,为开发者提供了宝贵的参考。
411 14
|
10月前
|
JavaScript 前端开发 开发者
09.HarmonyOS Next数据驱动UI开发:ForEach与动态渲染完全指南(上)
在现代前端开发中,数据驱动UI已成为主流开发范式。HarmonyOS Next的ArkTS语言和声明式UI框架完美支持这一理念,使开发者能够以更高效、更直观的方式构建复杂应用。
280 1
|
人工智能 物联网 编译器
【01】优雅草星云物联网AI智控系统从0开发鸿蒙端适配完成流程-初始化鸿蒙编译器deveco studio项目结构-UI设计图切片下载-优雅草卓伊凡
【01】优雅草星云物联网AI智控系统从0开发鸿蒙端适配完成流程-初始化鸿蒙编译器deveco studio项目结构-UI设计图切片下载-优雅草卓伊凡
343 11
【01】优雅草星云物联网AI智控系统从0开发鸿蒙端适配完成流程-初始化鸿蒙编译器deveco studio项目结构-UI设计图切片下载-优雅草卓伊凡
下一篇
开通oss服务