IOS UI学习 UITableView Demo 实现类似QQ联系人收起和展开效果

UItableView 日常学习总结

实现类似 QQ联系人收起和展开的效果

思路

就是 自定义Header 在它上面添加一个Button 或者一个点击手势 ,我是添加了一个手势

每一个分区设置一个状态为表示为收起和展开  (bool 型 即可)

当判断为收起时将分区 section的row数量设置为0,即不显示任何内容

当判断为展开时将分区 section的row数量设置为要显示的内容的数目

然后重载分区即可

重载分区方法

1 //重载分区 2 [_tableV reloadSections:[NSIndexSet indexSetWithIndex:section] withRowAnimation:UITableViewRowAnimationFade];

问题与解答

遇到的一个问题是,本来以为自定义了Header后,可以不设置Header的高度即可,但是其实是不行的,如果不设置header的高度,第一个分区 section的header将不会显示,所以,必须给section设置一个高度

code:

AppDelegate代码

 1 - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
 2
 3     self.window = [[UIWindow alloc]initWithFrame:[[UIScreen mainScreen] bounds]];
 4     self.window.backgroundColor = [UIColor whiteColor];
 5     RootViewController * root = [[RootViewController alloc]init];
 6     UINavigationController * una = [[UINavigationController alloc]initWithRootViewController:root];
 7     self.window.rootViewController = una;
 8
 9     [self.window makeKeyAndVisible];
10
11     return YES;
12 }

 

ViewController.m代码

  1 #import "RootViewController.h"
  2
  3 @interface RootViewController ()
  4
  5 @end
  6
  7 @implementation RootViewController
  8 {
  9     UITableView  * _tableV;
 10     NSMutableArray * _dataArr; //cell 元数据  貌似没什么用
 11     NSMutableDictionary * _numDict;  //记录分区收起 与 展开的状态
 12 }
 13
 14 - (void)viewDidLoad
 15 {
 16     [super viewDidLoad];
 17
 18
 19     [self createData];
 20
 21     [self createTableView];
 22 }
 23
 24 #pragma mark 创建UITableView
 25 -(void)createTableView
 26 {
 27     _tableV = [[UITableView alloc] initWithFrame:CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, [UIScreen mainScreen].bounds.size.height) style:UITableViewStyleGrouped];
 28     _tableV.separatorStyle = UITableViewCellSeparatorStyleSingleLine;
 29     _tableV.delegate = self;
 30     _tableV.dataSource = self;
 31     [self.view addSubview:_tableV];
 32 }
 33
 34 #pragma mark 初始化数据
 35 -(void)createData
 36 {
 37     _dataArr = [[NSMutableArray alloc] init];
 38     for (NSInteger i = 0; i<10; i++)
 39     {
 40         NSString * str = [NSString stringWithFormat:@"data %ld",i];
 41         [_dataArr addObject:str];
 42     }
 43
 44     _numDict = [[NSMutableDictionary alloc] init];
 45     for (NSInteger i = 0; i<10; i++)
 46     {
 47         NSNumber * num = [[NSNumber alloc] initWithBool:YES];
 48         NSString * str = [NSString stringWithFormat:@"%ld",i];
 49
 50         [_numDict setObject:num forKey:str];
 51     }
 52 }
 53
 54
 55
 56
 57 #pragma mark 协议方法
 58 //num of row in section
 59 -(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
 60 {
 61     NSString * str = [NSString stringWithFormat:@"%ld",section];
 62     if ([_numDict[str] boolValue] == YES)
 63     {
 64         return _dataArr.count;
 65     }
 66     else
 67         return 0;
 68 }
 69
 70 //set cell
 71 -(UITableViewCell*)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
 72 {
 73     static NSString * str = @"cell";
 74     UITableViewCell * cell = [tableView dequeueReusableCellWithIdentifier:str];
 75     if (!cell)
 76     {
 77         cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:str];
 78     }
 79     cell.textLabel.text = [NSString stringWithFormat:@"cell section %ld row%ld",indexPath.section,indexPath.row];
 80     cell.accessoryType = UITableViewCellAccessoryDisclosureIndicator;
 81     return cell;
 82 }
 83
 84 -(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
 85 {
 86     return 4;
 87 }
 88 #pragma mark  重要 刚开始第一个 section的 自定义header不显示,因为没有设置header 的高度 height
 89
 90 -(CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section
 91 {
 92     return 40;
 93 }
 94 //height for row
 95 -(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
 96 {
 97     return 50;
 98 }
 99
100 #pragma mark 本工程重点 自定义header of cell实现
101
102 -(UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
103 {
104
105
106     NSString * str = [NSString stringWithFormat:@"%ld",section];
107     NSLog(@"%@",str);
108     UIView * view = [[UIView alloc] init];
109     view.backgroundColor = [UIColor blueColor];
110     view.frame = CGRectMake(0, 0, 320, 40);
111     view.alpha = 0.3;
112
113
114     UIImageView * imageV = [[UIImageView alloc] init];
115     imageV.userInteractionEnabled = YES;
116     imageV.frame = CGRectMake(10, 5, 30, 30);
117     if ([_numDict[str] boolValue] == YES)
118     {
119         imageV.image = [UIImage imageNamed:@"arrow_fold.png"];
120     }
121     else
122         imageV.image = [UIImage imageNamed:@"arrow_spread.png"];
123
124     view.tag = section + 10;
125     NSLog(@"view tag %ld",view.tag);
126     [view addSubview:imageV];
127
128     UITapGestureRecognizer * tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tapView:)];
129
130     tap.numberOfTapsRequired = 1;
131
132     tap.numberOfTouchesRequired = 1;
133
134     //添加手势
135     [view addGestureRecognizer:tap];
136
137     return view;
138 }
139
140
141 -(void)tapView:(UITapGestureRecognizer*)tap
142 {
143     NSInteger section = tap.view.tag - 10;
144     NSLog(@"tapview section %ld",section);
145     NSString * str = [NSString stringWithFormat:@"%ld",section];
146     BOOL ret = [_numDict[str] boolValue];
147     ret = !ret;
148     [_numDict setObject:[NSNumber numberWithBool:ret] forKey:str];
149
150     //重载分区
151     [_tableV reloadSections:[NSIndexSet indexSetWithIndex:section] withRowAnimation:UITableViewRowAnimationFade];
152 }
153
154
155 -(CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section
156 {
157     return 1;
158 }
159 - (void)didReceiveMemoryWarning {
160     [super didReceiveMemoryWarning];
161     // Dispose of any resources that can be recreated.
162 }
163
164 /*
165 #pragma mark - Navigation
166
167 // In a storyboard-based application, you will often want to do a little preparation before navigation
168 - (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender {
169     // Get the new view controller using [segue destinationViewController].
170     // Pass the selected object to the new view controller.
171 }
172 */
173
174 @end
时间: 2024-10-12 09:03:04

IOS UI学习 UITableView Demo 实现类似QQ联系人收起和展开效果的相关文章

IOS UI学习 UITableView ----- UITableViewDataSource

UITableView派生自UIScrollView UITableView结构如下: 背景是滚动视图,每个横向的表格称为cell ( UITableViewCell ) 每一个 cell 既可以存储数据,也可以接受选中的事件, 我们选中某个cell时,可以下拉列表,可以推出新的页面 在编辑模式选中多个cell,可以批量删除等. 成员变量 1 { 2 UITableView * _tableV; 3 NSMutableArray * _dataArr; 4 UISearchController

【Android】类似QQ风格的popupwindow弹窗效果

[Android]类似QQ风格的popupwindow弹窗效果 该源码主要是实现类似QQ风格的popupwindow弹出窗效果,出现时有遮挡图层,消失时无遮挡图层. 下载地址:http://www.devstore.cn/code/info/273.html

IOS UI学习 UISearchController

使用UISearchController 配合UITableView实现搜索功能 1 #import "ViewController12.h" 2 3 @interface ViewController12 () <UITableViewDataSource , UITableViewDelegate , UISearchResultsUpdating> 4 5 @end 6 7 @implementation ViewController12 8 { 9 UISearch

IOS UI学习 UI 十个小控件 初度学习

1.  UISwitch 开关 1 - (void)viewDidLoad 2 { 3 [super viewDidLoad]; 4 self.view.backgroundColor = [UIColor whiteColor]; 5 self.title = @"开关"; 6 //开关创建 7 UISwitch * sw = [[UISwitch alloc]initWithFrame:CGRectMake(10, 100, 100, 100)]; 8 //设置开关的位置 9 sw

IOS UI学习 UISearchBar

UISearchBar继承自UIView.UIResponder.NSObject UISearchBar属性设置 code: 1 -(void)createSearchBar 2 { 3 _searchBar = [[UISearchBar alloc] initWithFrame:CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, 40)]; 4 //设置控件样式 5 _searchBar.barStyle = UISearch

iOS UI学习-笔记

第一: 1.IBAction: 1> 能保证方法可以连线 2> 相当于void 2.IBOutlet: 1> 能保证属性可以连线 3.常见错误 setValue:forUndefinedKey:]: this class is not key value coding 错误原因是:连线出问题了 4.Xcode5开始的一些建议 把用于连线的一些方法和属性声明在.m文件的类扩展中 5.frame\center\bounds 1> frame:能修改位置和尺寸 2> center:

&lt;转&gt;如何在iOS 7中设置barTintColor实现类似网易和 Facebook 的 navigationBar 效果

转自:i‘m Allen的博客 先给代码:https://github.com/allenhsu/CRNavigationController 1. 问题的表现 相信很多人在 iOS 7 的适配过程中遇到了类似这样的问题.当你试图通过设置 navigationBar.barTintColor 的时候,你陷入了一个两难的困境,假设你的预期是这样的: 设计稿 但当 navigationBar.translucent 为 YES 时,你的 navigationBar 看起来可能是这样的: 实际情况 最

C#+ html 实现类似QQ聊天界面的气泡效果

1 /**定义两个人的头像*/ 2 Myhead = "<img src=qrc:/chatdemo/Msg/Head.png width='30px'heigth='30px'>"; 3 QString strHead = QString("C:/Users/tax10_000/Desktop/ql_184555_828078.jpg"); 4 otherhead = QString ("<img src=%1 width='30px'

猫猫学IOS(十二)UI之UITableView学习(上)LOL英雄联盟练习

猫猫分享,必须精品 素材代码地址:http://blog.csdn.net/u013357243/article/details/44706671 原文地址:http://blog.csdn.net/u013357243?viewmode=contents 先看效果图 源代码 NYViewController的代码 //ps:新建iOS交流学习群:304570962 可以加猫猫QQ:1764541256 或则微信znycat 让我们一起努力学习吧. 原文:http://blog.csdn.net