ios开发之级联菜单(两个tableView实现)
一:在ios项目实际开发中经常会看到级联菜单的效果:如图:点击左侧菜单,右侧菜单刷新数据。此篇用两个tableView来实现如图效果:
二:代码:
1:构造数据模型:利用kvc快速构建数据模型
#import <Foundation/Foundation.h> @interface XMGCategory : NSObject
/** 子类别 */
@property (nonatomic, strong) NSArray *subcategories;
/** 姓名 */
@property (nonatomic, strong) NSString *name;
/** 图标 */
@property (nonatomic, strong) NSString *icon;
/** 高亮图标 */
@property (nonatomic, strong) NSString *highlighted_icon; + (instancetype)categoryWithDict:(NSDictionary *)dict;
@end
#import "XMGCategory.h" @implementation XMGCategory
+ (instancetype)categoryWithDict:(NSDictionary *)dict
{
XMGCategory *c = [[self alloc] init];
[c setValuesForKeysWithDictionary:dict];
return c;
}
@end
2:控制器代码实现:
#import "ViewController.h"
#import "XMGCategory.h" @interface ViewController () <UITableViewDataSource, UITableViewDelegate>
/** 右边表格 */
@property (weak, nonatomic) IBOutlet UITableView *subcategoryTableView;
/** 左边表格 */
@property (weak, nonatomic) IBOutlet UITableView *categoryTableView;
/** 所有的类别数据 */
@property (nonatomic, strong) NSArray *categories;
@end @implementation ViewController #pragma mark -- 懒加载数据源
- (NSArray *)categories
{
if (!_categories) {
//1:从plist文件中读取数据
NSArray *dictArray = [NSArray arrayWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"categories" ofType:@"plist"]];
//2:构造数据源
NSMutableArray *categoryArray = [NSMutableArray array];
for (NSDictionary *dict in dictArray) {
[categoryArray addObject:[XMGCategory categoryWithDict:dict]];
} //3:赋值数据源
_categories = categoryArray;
}
return _categories;
} - (void)viewDidLoad {
[super viewDidLoad]; //1:默认选中左边表格的第0行
[self.categoryTableView selectRowAtIndexPath:[NSIndexPath indexPathForRow: inSection:] animated:NO scrollPosition:UITableViewScrollPositionTop]; //2:给右侧的tableView增加额外的滚动区域:在有导航栏的时候,系统默认会为UIScrollView或是继承它的子控件默认增加64的额外滚动区域,如果有两个继承于UIScrollView的子控件,则系统默认只会为第一个添加到视图上的子控件增加额外的滚动区域。如果想禁止,则实现UIScrollView或是tableView等的ContentInset属性,增加额外的滚动区域,或是在控制器中实现self.automaticallyAdjustsScrollViewInsets = NO;
self.subcategoryTableView.contentInset = UIEdgeInsetsMake(, , , );
} - (void)viewDidAppear:(BOOL)animated
{
[super viewDidAppear:animated]; NSLog(@"categoryTableView - %@", NSStringFromUIEdgeInsets(self.categoryTableView.contentInset));
NSLog(@"subcategoryTableView - %@", NSStringFromUIEdgeInsets(self.subcategoryTableView.contentInset));
} #pragma mark - Table view data source
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
// 左边表格
if (tableView == self.categoryTableView) return self.categories.count; // 右边表格
XMGCategory *c = self.categories[self.categoryTableView.indexPathForSelectedRow.row];
return c.subcategories.count;
} - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
// 左边表格
if (tableView == self.categoryTableView) {
static NSString *ID = @"category";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:ID]; XMGCategory *c = self.categories[indexPath.row]; // 设置普通图片
cell.imageView.image = [UIImage imageNamed:c.icon];
// 设置高亮图片(cell选中 -> cell.imageView.highlighted = YES -> cell.imageView显示highlightedImage这个图片)
cell.imageView.highlightedImage = [UIImage imageNamed:c.highlighted_icon]; // 设置label高亮时的文字颜色
cell.textLabel.highlightedTextColor = [UIColor redColor]; cell.textLabel.text = c.name;
cell.accessoryType = UITableViewCellAccessoryDisclosureIndicator; return cell;
} else {
// 右边表格
static NSString *ID = @"subcategory";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:ID]; // 获得左边表格被选中的模型
XMGCategory *c = self.categories[self.categoryTableView.indexPathForSelectedRow.row];
cell.textLabel.text = c.subcategories[indexPath.row]; return cell;
}
} #pragma mark - <UITableViewDelegate>
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
if (tableView == self.categoryTableView) {
[self.subcategoryTableView reloadData];
}
}
三:知识点总结:
1:级联菜单数据模型的设计:1:左侧表格数据模型中含有右侧表格的数据模型,在定义数据模型时,可用类方法,或是实例方法:类方法实现:alloc创建对象,对象调用KVC快速为属性赋值,利用KVC必须满足属性一一对应,不能少也不多
+ (instancetype)categoryWithDict:(NSDictionary *)dict
{
XMGCategory *c = [[self alloc] init];
[c setValuesForKeysWithDictionary:dict];
return c;
}
2:在构造数据源时:要看清plist根节点是数组还是字典:一般自定义plist数据模型时时,最外层为数组,数组为每一个数据模型的字典:数据源,采用懒加载,懒加载保证只初始化一次,且不用关心何时创建也就是不用考虑代码顺序。从plist中读取数据:
NSArray *dictArray = [NSArray arrayWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"categories" ofType:@"plist"]];
因为懒加载时,数据源本身就没有初始化,不存在,所以用
_categories = categoryArray;来对数据源进行赋值,若是初始化了,则可以addObjectFromeArray,或是插入数据:insetObject atIndexSets
3:tableView默认选中某一行:
//1:默认选中左边表格的第0行
[self.categoryTableView selectRowAtIndexPath:[NSIndexPath indexPathForRow:0 inSection:0] animated:NO scrollPosition:UITableViewScrollPositionTop];
4:给UIscrollView,tableView,UICollectionView增加额外的滚动区域调用:contentInset.
给右侧的tableView增加额外的滚动区域:在有导航栏的时候,系统默认会为UIScrollView或是继承它的子控件默认增加64的额外滚动区域,如果有两个继承于UIScrollView的子控件,则系统默认只会为第一个添加到视图上的子控件增加额外的滚动区域。如果想禁止,则实现UIScrollView或是tableView等的ContentInset属性,增加额外的滚动区域,或是在控制器中实现self.automaticallyAdjustsScrollViewInsets = NO;
self.subcategoryTableView.contentInset = UIEdgeInsetsMake(64, 0, 0, 0);
5:在方法
- (void)viewDidAppear:(BOOL)animated里视图已经出现,在此方法中,也就是视图出现的时候,能正确打印,调试,或是对控件进行一些设置
6:两个tableView,在实现数据源或是代理方法时,要区分不同的tableView:如:
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
// 左边表格
if (tableView == self.categoryTableView) return self.categories.count;
// 右边表格
XMGCategory *c = self.categories[self.categoryTableView.indexPathForSelectedRow.row];
return c.subcategories.count;
}
其中,self.categoryTableView.indexPathForSelectedRow,得到的是当前表格选中的indexPath区域
7:UITableViewCell:当某个cell被选中时,系统会默认显示cell中控件高亮时的状态,取消选中时,显示常态:可以设置cell中的UIimageView,lable高亮时的状态:
//1: 设置普通图片
cell.imageView.image = [UIImage imageNamed:c.icon];
// 设置高亮图片(cell选中 -> cell.imageView.highlighted = YES -> cell.imageView显示highlightedImage这个图片)
cell.imageView.highlightedImage = [UIImage imageNamed:c.highlighted_icon];
// 2:设置label高亮时的文字颜色
cell.textLabel.highlightedTextColor = [UIColor redColor];
ios开发之级联菜单(两个tableView实现)的更多相关文章
- iOS开发UI篇—推荐两个好用的Xcode插件(提供下载链接)
iOS开发UI篇—推荐两个好用的Xcode插件(提供下载链接) 这里推荐两款好用的Xcode插件,并提供下载链接. 一.插件和使用如下: 1.两款插件 对项目中图片提供自动提示功能的插件:KSImag ...
- iOS 类似美团外卖 app 两个 tableView 联动效果实现
写在前面 首先声明哈,不是广告,我就是用的时候觉得这个功能比较好玩,就想着实现了一下.效果如图: 接下来简单的说一下思路吧~ 大体思路 可能我们看到这种功能的实现的时候,首先想着的是我在这个控制器中左 ...
- IOS开发复习笔记(4)-TableView
总结几个TableView常用的代码 1.初始化方面 static string CellIndetifier=@"cellIndetifier"; -(NSInteger)num ...
- ---iOS开发 截取字符串中两个指定字符串中间的字符串---
例如,要截取一个字符串中,两个指定字符串中间的字符串,OC截取方法如下: // 要截取 "> 和 </ 之间的汉字内容: @implementationViewControlle ...
- iOS开发NSFetchedResultsController的使用CoreData和TableView数据同步更新
1.效果 2.代码 #import "ViewController.h" #import "Student+CoreDataProperties.h" #def ...
- iOS开发之转盘菜单
前言 使用Swift实现的转盘菜单,主要用到UIBezierPath.CALayer遮罩绘制扇形UIView,CATransform3DMakeRotation实现旋转动画.代码设计使用默认confi ...
- iOS 类似外卖 两个tableView联动
在伯乐在线上看到一个挺好玩的文章,自己也参考文章实现了一下. 效果实现如图所示: 具体实现的内容可以参考原文,参考文章:<iOS 类似美团外卖 app 两个 tableView 联动效果实现&g ...
- iOS开发小技巧 -- tableView-section圆角边框解决方案
[iOS开发]tableView-section圆角边框解决方案 tableView圆角边框解决方案 iOS 7之前,图下圆角边框很容易设置 iOS 7之后,tableviewcell的风格不再是圆角 ...
- 文顶顶iOS开发博客链接整理及部分项目源代码下载
文顶顶iOS开发博客链接整理及部分项目源代码下载 网上的iOS开发的教程很多,但是像cnblogs博主文顶顶的博客这样内容图文并茂,代码齐全,示例经典,原理也有阐述,覆盖面宽广,自成系统的系列教程 ...
随机推荐
- [Redux-Observable && Unit Testing] Mocking an ajax request when testing epics
Often in unit tests we are focussing on the logic involved in crafting a network request, & how ...
- [NowCoder]牛客OI周赛3
A.地斗主 题意:\(4\times N\) 的地板,在上面铺 \(1\times 2\) 和 \(2\times 1\) 的地砖,求铺满方案数, \(N\le 10^9\) 原题..先把一列的状态压 ...
- 基于jQuery的楼层案例
~(function() { var flag = true; //点击切换效果 $(".oDR7_asideItem:not(:first)").click(function() ...
- CF1009F Dominant Indices(树上DSU/长链剖分)
题目大意: 就是给你一棵以1为根的树,询问每一个节点的子树内节点数最多的深度(相对于这个子树根而言)若有多解,输出最小的. 解题思路: 这道题用树链剖分,两种思路: 1.树上DSU 首先想一下最暴力的 ...
- nginx安装部署+增加媒体播放模块
nginx安装很简单,但是有的时候是已经安装的nginx ,升级增加nginx 模块功能. 最近公司要nginx增加一个可以播放 MP4的模块,安装还算顺利,不说废话上命令. 1 安装依赖 yum i ...
- eclipse git冲突解决
1.工程->Team->同步: 2.从远程pull至本地,就会出现如下内容: 3.使用Merge Tool,执行第二项 4.再手动修改 4.修改后的文件需要添加到Git index中去: ...
- Spring CORS
转载:Spring MVC 4.2 增加 CORS 支持 http://spring.io/blog/2015/06/08/cors-support-in-spring-framework http: ...
- Apache httpd.conf 配置文件语法验证
Apache 的 httpd.conf文件改动之后,必须重新启动server才干生效. 有时server在提供服务的时候,直接更改配置,重新启动服务.会带来非常大的危急性. 假设能在改动配置之后,先验 ...
- Akka边学边写(4)-- MiniRPG
前面几篇文章用Akka写了HelloWorld和EchoServer,为了更进一步学习Akka,本文将会实现一个非常小的RPG游戏server:MiniRPG. 游戏逻辑 由于是迷你RPG,所以逻辑非 ...
- 解决XCODE配置LLVM环境出现的问题
问题描写叙述:在LLVM整合进XCODE的过程中出现符号没有定义导致出现未决函数或方法.但使用终端编译链接生成程序没有问题. 问题产生原因:未引用响应的LLVM库与系统库,以及编译器设置.连接器设置不 ...