源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

iOS开发之表视图详解

  • 时间:2021-06-16 18:57 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:iOS开发之表视图详解
本文详细介绍了表视图的用法。具体如下: [b]概述[/b] [b]表视图组成[/b] 表视图是iOS开发中最重要的视图,它以列表的形式展示数据。表视图又一下部分组成: [list] [*] 表头视图:表视图最上边的视图 [/*] [*] 表脚视图:表视图最下边的视图 [/*] [*] 单元格(cell):表视图中每一行的视图 [/*] [*] 节(section):由多个单元格组成,应用于分组列表 [list]
  • 节头 [/*] [*] 节脚 [/*] [/list]
  • [/list] [b]表视图的相关类[/b] UITableView继承自UIScrollView,且有两个协议:UITableViewDelegate和UITableViewDataSource。此外UITableViewCell类时单元格类,UITableViewController类时UITableView的控制器,UITableViewHeaderFooterView用于为节头和节脚提供视图。 [img]http://files.jb51.net/file_images/article/201611/2016111100147763.jpg?20161011020[/img] [b]表视图分类[/b] [list] [*]普通表视图:主要用于动态表,而动态表一般在单元格数目未知的情况下使用[/*] [*]分组表视图:一般用于静态表,用来进行界面布局 [/*] [/list] [b]单元格的组成和样式 [/b] 单元格由图标、主标题、副标题、扩展视图组成,可以根据需要进行选择,其中内置的扩展视图在枚举类型
    Swift枚举成员 Objective-C枚举成员 说明
    none ITableViewCellAccessoryNone 没有扩展图标
    disclosureIndicator UITableViewCellAccessoryDisclosureIndicator 扩展指示器,为箭头+问号
    detailDisclosureButton UITableViewCellAccessoryDetailDisclosureButton 细节展示图,为问号
    checkmark UITableViewCellAccessoryCheckmark 选中标志,图标为勾
    detailButton UITableViewCellAccessoryDetailButton 细节详情展示,图标为问号
    内置的单元格样式在枚举类型UITableViewCellStyle中定义:
    Swift枚举成员 Objective-C枚举成员 说明
    default UITableViewCellStyleDefault 默认样式
    subtitle UITableViewCellStyleSubtitle 有图标、主标题、副标题、副标题在主标题的下面
    value1 UITableViewCellStyleValue1 有主标题、副标题,主标题左对齐、副标题右对齐,可以有图标
    2alue3 UITableViewCellStyleValue2 有主标题、副标题,主标题和副标题居中对齐,无图标
    [b]数据源协议与委托协议[/b] [b]UITableViewDataSource[/b] 数据源协议主要为表视图提供数据,主要方法如下
    方法 返回类型 说明
    func tableView(UITableView, cellForRowAt: IndexPath) UITableViewCell 为表视图单元格提供数据,必须实现
    tableView(UITableView, numberOfRowsInSection: Int) Int 返回某个节中的行数,必须实现
    tableView(UITableView, titleForHeaderInSection: Int) String 返回节头的标题
    tableView(UITableView, titleForFooterInSection: Int) String 返回节脚的标题
    numberOfSections(in: UITableView) Int 返回节的个数
    sectionIndexTitles(for: UITableView) [String]? 返回表示图节索引标题
    [b]UITableViewDelegate[/b] 委托协议主要主要用来设定表视图中节头和节脚的标题,以及一些动作事件,主要方法如下
    方法 返回类型 说明
    tableView(UITableView, didSelectRowAt: IndexPath) 单元格响应事件
    tableView(UITableView, accessoryButtonTappedForRowWith: IndexPath) 扩展视图响应事件
    [b]简单表视图[/b] [b]UIViewController根视图控制器实现表视图[/b] [b]步骤[/b] [list=1] [*]创建一个iOS工程[/*] [*]从对象库中拖入一个TableView到storyboard文件中,并将TableView覆盖整个View[/*] [*]打开Table View的属性检查器,将PrototypeCells的值设为1,注意不要添加多个,否则会发生错误;此时Table View会添加一个Table View Cell。[/*] [*]打开Table View Cell的属性检查器,设置Identifier属性。[/*] [*]注册UITableViewDataSource和UITableViewDelegate协议[/*] [*]编写代码实现功能[/*] [/list] 实现
    //
    // ViewController.swift
    // TableViewDemo
    //
    // Created by Michael on 2016/10/26.
    // Copyright © 2016年 Michael. All rights reserved.
    //
    
    import UIKit
    
    class ViewController: UIViewController,UITableViewDataSource,UITableViewDelegate {
     
     //全部数据
     var listItems: NSArray!
    
     override func viewDidLoad() {
      super.viewDidLoad()
      
      //读取资源文件数据
      let listPath = Bundle.main.path(forResource: "team", ofType: "plist")
      self.listItems = NSArray(contentsOfFile: listPath!)
     }
    
     override func didReceiveMemoryWarning() {
      super.didReceiveMemoryWarning()
      // Dispose of any resources that can be recreated.
     }
    
     //返回列表每行的视图
     func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
     //根据Identifier找到Cell
      let cell = tableView.dequeueReusableCell(withIdentifier: "CustomId", for: indexPath)
      let row = indexPath.row
      
      let rowDict = self.listItems[row] as! NSDictionary
      cell.textLabel?.text = rowDict["name"] as? String
      cell.detailTextLabel?.text = "123"
      
      let imagePath = String(format: "%@.png", rowDict["image"] as! String)
      cell.imageView?.image = UIImage(named: imagePath)
      cell.accessoryType = UITableViewCellAccessoryType.disclosureIndicator
      return cell
     }
    
     //返回条目数目
     func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
      return self.listItems.count
     }
     
     //响应条目点击事件
     func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
      print("点击事件")
     }
     
    }
    
    
    示例图 none模式 [img]http://files.jb51.net/file_images/article/201611/2016111100849989.jpg?201610110858[/img] disclosureIndicator [img]http://files.jb51.net/file_images/article/201611/2016111100911945.jpg?201610110921[/img] [b]UITableViewController根视图控制器实现表视图[/b] [b]步骤[/b] [list=1] [*]创建一个iOS工程[/*] [*]删除storyboard中View Controller Scene 中的View Controller,再从对象库拖入一个Table View Controller到设计界面[/*] [*]打开Table View Controller属性检查器,勾选Is Initial View Controller选项,否则应用启动后是黑屏[/*] [*]将ViewController类的父类由UIViewController改为UITableViewController[/*] [*]打开View Controller的属性选择器在Class列表中选择ViewController[/*] [*]UITableViewController默认以注册UITableViewDataSource和UITableViewDelegate协议,不需要再注册 [/*] [/list] 实现
    import UIKit
    
    class ViewController: UITableViewController {
     
     //全部数据
     var listItems: NSArray!
    
     override func viewDidLoad() {
      super.viewDidLoad()
      
      //读取资源文件数据
      let listPath = Bundle.main.path(forResource: "team", ofType: "plist")
      self.listItems = NSArray(contentsOfFile: listPath!)
     }
    
     override func didReceiveMemoryWarning() {
      super.didReceiveMemoryWarning()
      // Dispose of any resources that can be recreated.
     }
    
     //返回列表每行的视图
     func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
      let cell = tableView.dequeueReusableCell(withIdentifier: "CustomId", for: indexPath)
      let row = indexPath.row
      
      let rowDict = self.listItems[row] as! NSDictionary
      cell.textLabel?.text = rowDict["name"] as? String
      cell.detailTextLabel?.text = "123"
      
      let imagePath = String(format: "%@.png", rowDict["image"] as! String)
      cell.imageView?.image = UIImage(named: imagePath)
      cell.accessoryType = UITableViewCellAccessoryType.disclosureIndicator
      return cell
     }
    
     //返回条目数目
     func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
      return self.listItems.count
     }
     
     //响应条目点击事件
     func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
      print("点击事件")
     }
     
    }
    
    
    示例图 detailButton模式 [img]http://files.jb51.net/file_images/article/201611/2016111101008666.jpg?2016101101017[/img] checkmark模式 [img]http://files.jb51.net/file_images/article/201611/2016111101027834.jpg?2016101101039[/img] [b]自定义单元格[/b] 步骤 [list=1] [*]创建一个表视图工程[/*] [*]修改根视图控制器为表视图控制器UITableViewController,参照上节的步骤[/*] [*]从对象库中拖入控件到单元格内部,比如Lable和ImageView[/*] [*]创建自定义单元格类CustomCell文件,并继承UITableViewCell类[/*] [*]在设计界面中选择View Controller Scene中的Table View Cell,并打开属性检查器,将Class设为CustomCell类,并设置单元格的Identifier[/*] [*]为单元格中的控件Label和ImageView控件连接输出接口,将控件绑定到CustomCell类中[/*] [*]打开ViewController类,编写代码实现[/*] [/list] 实现 CustomCell类
    //
    // CustomCell.swift
    // CustomCell
    //
    // Created by Michael on 2016/10/25.
    // Copyright © 2016年 Michael. All rights reserved.
    //
    
    import UIKit
    
    class CustomCell: UITableViewCell {
    
     @IBOutlet weak var mImage: UIImageView!
     @IBOutlet weak var mLabel: UILabel!
     override func awakeFromNib() {
      super.awakeFromNib()
      // Initialization code
     }
    
     override func setSelected(_ selected: Bool, animated: Bool) {
      super.setSelected(selected, animated: animated)
    
      // Configure the view for the selected state
     }
    
    }
    
    
    ViewController类
    //
    // ViewController.swift
    // SimpleTableView
    //
    // Created by Michael on 2016/10/24.
    // Copyright © 2016年 Michael. All rights reserved.
    //
    
    import UIKit
    
    class ViewController: UITableViewController {
     
     var listItems: NSArray!
     
     override func viewDidLoad() {
      super.viewDidLoad()
      // Do any additional setup after loading the view, typically from a nib.
      let listPath = Bundle.main.path(forResource: "team", ofType: "plist")
      self.listItems = NSArray(contentsOfFile: listPath!)
     }
     
     override func didReceiveMemoryWarning() {
      super.didReceiveMemoryWarning()
      // Dispose of any resources that can be recreated.
     }
     
     
     override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
      return self.listItems.count
     }
     
     
     
     override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
     //找到自定义单元格
      let cell:CustomCell! = tableView.dequeueReusableCell(withIdentifier: "CustomCellId", for: indexPath) as? CustomCell
      //let cell = UITableViewCell(style: .value1, reuseIdentifier: "CellIdentifier")
      let row = indexPath.row
      
      let rowDict = self.listItems[row] as! NSDictionary
      //设置控件属性
      cell.mLabel.text = rowDict["name"] as? String
      
      let imagePath = String(format: "%@.png", rowDict["image"] as! String)
      cell.mImage.image = UIImage(named: imagePath)
      cell.accessoryType = .disclosureIndicator
      return cell
      
     }
    }
    
    
    示例图 [img]http://files.jb51.net/file_images/article/201611/2016111101334335.jpg?2016101101342[/img] 以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程素材网。
    • 全部评论(0)
    联系客服
    客服电话:
    400-000-3129
    微信版

    扫一扫进微信版
    返回顶部