iOS开发——UI_swift篇&UITableView实现单元格展开与隐藏

UITableView实现单元格展开与隐藏

下面是一个列表单元格cell的折叠展开效果的demo。

当点击单元格时会展开该单元格,便于显示一些详情什么的。点击其他单元格原来的会关闭,同时有动画效果。

效果如如下:

 

代码如下:

 1 import UIKit
 2
 3 class ViewController: UIViewController,UITableViewDelegate,
 4 UITableViewDataSource {
 5
 6     var tableView:UITableView?
 7
 8     var ctrlnames:[String] = ["UILabel 标签","UIButton 按钮","UIDatePiker 日期选择器",
 9         "UITableView 表格视图"]
10
11     var selectedCellIndexPath:NSIndexPath!
12
13     override func viewDidLoad() {
14         super.viewDidLoad()
15
16         //创建表视图
17         self.tableView = UITableView(frame: UIScreen.mainScreen().applicationFrame,
18             style:UITableViewStyle.Plain)
19         self.tableView!.delegate = self
20         self.tableView!.dataSource = self
21         //创建一个重用的单元格
22         self.tableView!.registerClass(UITableViewCell.self, forCellReuseIdentifier: "SwiftCell")
23         self.view.addSubview(self.tableView!)
24     }
25
26     //在本例中,只有一个分区
27     func numberOfSectionsInTableView(tableView: UITableView!) -> Int {
28         return 1;
29     }
30
31     //返回表格行数(也就是返回控件数)
32     func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
33         return self.ctrlnames.count
34     }
35
36     //创建各单元显示内容(创建参数indexPath指定的单元)
37     func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath)
38         -> UITableViewCell
39     {
40         var label =  UILabel(frame:CGRectZero)
41         label.setTranslatesAutoresizingMaskIntoConstraints(false)
42         label.text = self.ctrlnames[indexPath.row]
43
44         var textview=UITextView(frame:CGRectZero)
45         textview.setTranslatesAutoresizingMaskIntoConstraints(false)
46         textview.textColor = UIColor.grayColor()
47         //演示效果,暂时写死
48         textview.text = "UIDatePicker 是一个控制器类,封装了 UIPickerView,但是他是UIControl的子类,"
49
50         let identify:String = "SwiftCell"
51         var cell = UITableViewCell(style: UITableViewCellStyle.Default, reuseIdentifier:identify)
52         //自动遮罩不可见区域,超出的不显示
53         cell.layer.masksToBounds = true
54         cell.contentView.addSubview(label)
55         cell.contentView.addSubview(textview)
56
57         //创建一个控件数组
58         var views:NSMutableDictionary = NSMutableDictionary()
59         views.setValue(label, forKey: "label")
60         views.setValue(textview, forKey: "textview")
61         cell.contentView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat(
62             "H:|-15-[label]-15-|", options: nil, metrics: nil, views: views))
63         cell.contentView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat(
64             "H:|-15-[textview]-15-|", options: nil, metrics: nil, views: views))
65         cell.contentView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat(
66             "V:|[label(40)]", options: nil, metrics: nil, views: views))
67         cell.contentView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat(
68             "V:|-40-[textview(80)]", options: nil, metrics: nil, views: views))
69         return cell
70     }
71
72     // UITableViewDelegate 方法,处理列表项的选中事件
73     func tableView(tableView: UITableView!, didSelectRowAtIndexPath indexPath: NSIndexPath!)
74     {
75         self.tableView!.deselectRowAtIndexPath(indexPath, animated: false)
76         selectedCellIndexPath = indexPath
77         // Forces the table view to call heightForRowAtIndexPath
78         tableView!.reloadRowsAtIndexPaths([indexPath],
79             withRowAnimation: UITableViewRowAnimation.Automatic)
80     }
81
82     //点击单元格会引起cell高度的变化,所以要重新设置
83     func tableView(tableView: UITableView,
84         heightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat {
85             if(selectedCellIndexPath != nil && selectedCellIndexPath == indexPath){
86                 return 120
87             }
88             return 40
89     }
90 }
时间: 2024-11-03 03:28:45

iOS开发——UI_swift篇&UITableView实现单元格展开与隐藏的相关文章

iOS开发——UI_swift篇&UItableView实现移动单元格

UItableView实现移动单元格 1,下面的样例是给表格UITableView添加单元格移动功能: (1)给表格添加长按功能,长按后表格进入编辑状态 (2)在编辑状态下,可以看到单元格后面出现拖动按钮 (3)鼠标按住拖动按钮,可以拖动单元格到任意位置 (4)拖动完毕后,还会触发TabelView对应的代理事件 2,效果图如下:   3,代码如下 1 import UIKit 2 3 class ViewController: UIViewController,UITableViewDeleg

iOS开发——UI_swift篇&UITableView实现索引功能

UITableView实现索引功能 像iOS中的通讯录,通过点击联系人表格右侧的字母索引,我们可以快速定位到以该字母为首字母的联系人分组. 要实现索引,我们只需要两步操作: (1)实现索引数据源代理方法 (2)响应点击索引触发的代理事件 效果图如下: 代码如下: 1 import UIKit 2 3 class ViewController: UIViewController , UITableViewDelegate, UITableViewDataSource{ 4 5 var tableV

IOS开发UI篇--UITableView的自定义布局==xib布局

利用Xib进行实现 应用场景:像团购网站的列表数据显示,新闻列表显示等(由于该类的显示的数据单元格内容格式相同) (1)主控制器文件,在文件中实现了自己自定义的代理,加载数据, 1 #import "SLViewController.h" 2 #import "SLTgDatas.h" 3 #import "SLTableViewCell.h" 4 #import "SLFooterView.h" 5 #import &quo

IOS开发UI篇--UITableView的自定义布局==纯代码布局

UITableView中除了利用系统的UItableViewCell不能完成需求进行布局时,还可以进行自定义布局: 自定义布局分为两类:(1)利用代码进行创建 (2)利用xib进行实现: 下面对利用代码进行创建分析: 应用场景:像微博,等列表数据展示(由于微博的每个单元格的数据大小不一致,所以得计算每个单元格的大小) 分析:前提是获取列表数据,然后建立每个单元格的模型(建立单元格模型应继承UITableViewCell)复写 - (id)initWithStyle:(UITableViewCel

iOS开发UI篇—UITableview控件基本使

iOS开发UI篇—UITableview控件基本使用 一.一个简单的英雄展示程序 NJHero.h文件代码(字典转模型) #import <Foundation/Foundation.h> @interface NJHero : NSObject /** * 头像 */ @property (nonatomic, copy) NSString *icon; /** * 名称 */ @property (nonatomic, copy) NSString *name; /** * 描述 */ @

iOS开发UI篇—UITableview控件使用小结

iOS开发UI篇—UITableview控件使用小结 一.UITableview的使用步骤 UITableview的使用就只有简单的三个步骤: 1.告诉一共有多少组数据 方法:- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView; 2.告诉每组一共有多少行 方法:- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSIntege

学习IOS开发UI篇--UITableView/数据模型嵌套/UITableViewCell/Cell的重用

1.UITableView ================================================== UITableView有两种格式:group和plain 2.UITableView如何展示数据 ================================================== UITableView需要一个数据源(dataSource)来显示数据 凡是遵守UITableViewDataSource协议的OC对象,都可以是UITableView的

iOS开发UI篇—UITableView全面解析

概述 在iOS开发中UITableView可以说是使用最广泛的控件,我们平时使用的软件中到处都可以看到它的影子,类似于微信.QQ.新浪微博等软件基本上随处都是UITableView.当然它的广泛使用自然离不开它强大的功能,今天这篇文章将针对UITableView重点展开讨论.今天的主要内容包括: 基本介绍 数据源 代理 性能优化 UITableViewCell 常用操作 UITableViewController MVC模式 基本介绍 UITableView有两种风格:UITableViewSt

iOS开发&mdash;&mdash;Autolayout下动态调整单元格高度

情景描述: 有时候我们希望更新某一个单元格的数据,通常的做法是使用reloadData方法更新整个单元格.但是对一些情况是不适用的或者说实现起来比较麻烦.比如说这种简单的"点开"一个单元格 在没点开时,英雄的简介被替换为"点击查看详情",下载按钮被设为隐藏. 这样的话如果在点开时reload整个表格的数据,表格因为重载数据还是会恢复成没有点开的状态.   解决步骤: 使用Autolayout的优点是可以让内容决定单元格的高度.那么有什么办法能在内容改变后动态地调整单