iOS开发⑤常见表视图

分节表视图

步骤

1. 创建一个iOS工程

2. 删除storyboard中View Controller Scene 中的View Controller，再从对象库拖入一个Table View Controller到设计界面

3. 打开Table View Controller属性检查器，勾选Is Initial View Controller选项，否则应用启动后是黑屏

4. 将ViewController类的父类由UIViewController改为UITableViewController

5. 打开View Controller的属性选择器在Class列表中选择ViewController

6. UITableViewController默认以注册UITableViewDataSource和UITableViewDelegate协议，不需要再注册

代码实现

//
//  ViewController.swift
//  IndexTable
//
//  Created by Michael on 2016/10/31.
//  Copyright © 2016年 Michael. All rights reserved.
//

import UIKit

class ViewController: UITableViewController {
    
    var datas: NSDictionary!
    
    var groupNames:NSArray!

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        let path = Bundle.main.path(forResource: "team_dictionary", ofType: "plist")
        
        self.datas = NSDictionary(contentsOfFile: path!)
        
        let tempList = self.datas.allKeys as NSArray
        
        //排序
        let sortedArray = tempList.sortedArray(comparator: { (obj1, obj2) -> ComparisonResult in
            let str1 = obj1 as! String
            let str2 = obj2 as! String
            let ret = str1.compare(str2)
            return ret
        })
        self.groupNames = sortedArray as NSArray!
    }
    


    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
    
    //组中条目的数量
    override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        let groupName = self.groupNames[section] as! String
        let teams = self.datas[groupName] as! NSArray
        return teams.count
    }

    override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell:UITableViewCell! = tableView.dequeueReusableCell(withIdentifier: "liu",for: indexPath)
        
        let section = indexPath.section
        
        let row = indexPath.row
        
        let groupName = self.groupNames[section] as! String
        let teams = self.datas[groupName] as! NSArray
        cell.textLabel?.text = teams[row] as? String
        
        return cell
        
    }
    
    //组的数量
    override func numberOfSections(in tableView: UITableView) -> Int {
        return self.groupNames.count
    }
    
    //组的标题
    override func tableView(_ tableView: UITableView, titleForHeaderInSection section: Int) -> String? {
        let name = self.groupNames[section] as! String
        return name
    }
    
    //索引的标题
    override func sectionIndexTitles(for tableView: UITableView) -> [String]? {
        var titles = [String]()
        for item in self.groupNames {
            let title = item as! String
            titles.append(title.substring(to: title.index(title.startIndex, offsetBy: 1)))
        }
        return titles
    }

    //点击事件
    override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
        let section = indexPath.section
        
        let row = indexPath.row
        
        let groupName = self.groupNames[section] as! String
        let teams = self.datas[groupName] as! NSArray
        print(groupName)
        print(teams[row])
    }

}

示例

静态表视图

步骤

1. 创建一个iOS工程，使用Table View Controller作为表视图控制器

2. 选择Table View，打开属性检查器，从Content下拉列表中选择Static Cells，将Section的值为设为3.，从Style下拉列表中选择Grouped

3. 选择第一个Table View Section，将Rows值设为2，即该节中包含两个单元格，分别拖入一个TextField到两个单元格中

4. 选择第二个Table View Section，将Rows值设为1，拖入一个Button到单元格中

5. 选择第二个Table View Section，将Rows值设为1，拖入一个Lable到单元格中

代码实现

//
//  ViewController.swift
//  StaticTable
//
//  Created by Michael on 2016/11/2.
//  Copyright © 2016年 Michael. All rights reserved.
//

import UIKit

class ViewController: UITableViewController {

    @IBOutlet weak var mUserName: UITextField!
    @IBOutlet weak var mPwd: UITextField!
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

    @IBAction func login(_ sender: UIButton) {
        if self.mUserName.text == "liu" && self.mPwd.text == "123" {
            NSLog("login sucess");
            mUserName.resignFirstResponder();
            mPwd.resignFirstResponder();
        }
    }
    
    override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
        NSLog("Section: %d,Row: %d",indexPath.section,indexPath.row);
    }

}

示例

插入和删除单元格

步骤

1. 创建一个iOS工程

2. 删除storyboard中View Controller Scene 中的View Controller，再从对象库拖入一个Navigation Controller到设计界面，同时也会添加一个Table View Controller到设计界面

3. 打开Table View Controller属性检查器，勾选Is Initial View Controller选项，否则应用启动后是黑屏

4. 将ViewController类的父类由UIViewController改为UITableViewController

5. 打开View Controller的属性选择器在Class列表中选择ViewController

6. UITableViewController默认以注册UITableViewDataSource和UITableViewDelegate协议，不需要再注册

代码实现

//
//  ViewController.swift
//  DeleteAddCell
//
//  Created by Michael on 2016/11/2.
//  Copyright © 2016年 Michael. All rights reserved.
//

import UIKit

class ViewController: UITableViewController {
    
    var txtField:UITextField!
    
    var listTeams: NSMutableArray!

    override func viewDidLoad() {
        super.viewDidLoad()
        //设置导航栏
        self.navigationItem.rightBarButtonItem = self.editButtonItem
        self.navigationItem.title = "单元格插入和删除"
        
        self.txtField = UITextField()

        
        self.listTeams = NSMutableArray(array: ["黑龙江","吉林","辽宁","北京"])
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

    //响应视图编辑状态
    override func setEditing(_ editing: Bool, animated: Bool) {
        super.setEditing(editing, animated: animated)
        self.tableView.setEditing(editing, animated: true)
        if editing {
            self.txtField.isHidden = false
        } else{
            self.txtField.isHidden = true
        }
    }
    
    override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return self.listTeams.count + 1
    }
    
    override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let isAddCell = (indexPath.row == self.listTeams.count)
        
        let cell:UITableViewCell! = tableView.dequeueReusableCell(withIdentifier: "CustomCell", for: indexPath)
        
        if !isAddCell {
            cell.accessoryType = .disclosureIndicator
            cell.textLabel?.text = self.listTeams[indexPath.row] as? String
            
        } else {
            self.txtField.frame = CGRect(x: 40, y: 0, width: 300, height: cell.frame.size.height)
            self.txtField.borderStyle = .none
            self.txtField.placeholder = "Add..."
            self.txtField.text = ""
            cell.addSubview(self.txtField)
        }
        return cell
    }
    
    //返回编辑样式
    override func tableView(_ tableView: UITableView, editingStyleForRowAt indexPath: IndexPath) -> UITableViewCellEditingStyle {
        if indexPath.row == self.listTeams.count {
            return .insert
        } else {
            return .delete
        }
    }
    
    //添加删除时调用
    override func tableView(_ tableView: UITableView, commit editingStyle: UITableViewCellEditingStyle, forRowAt indexPath: IndexPath) {
        
        if editingStyle == .delete {
            self.listTeams.removeObject(at: indexPath.row)
            self.tableView.deleteRows(at: [indexPath], with: .fade)
        } else if editingStyle == .insert {
            self.listTeams.insert(self.txtField.text!, at: self.listTeams.count)
            self.tableView.insertRows(at: [indexPath], with: .fade)
        }
        
        self.tableView.reloadData();
    }
    

}

示例

移动单元格

步骤

1. 创建一个iOS工程
2. 删除storyboard中View Controller Scene 中的View Controller，再从对象库拖入一个Navigation Controller到设计界面，同时也会添加一个Table View Controller到设计界面
3. 打开Table View Controller属性检查器，勾选Is Initial View Controller选项，否则应用启动后是黑屏
4. 将ViewController类的父类由UIViewController改为UITableViewController
5. 打开View Controller的属性选择器在Class列表中选择ViewController
6. UITableViewController默认以注册UITableViewDataSource和UITableViewDelegate协议，不需要再注册

代码实现

//
//  ViewController.swift
//  MoveCell
//
//  Created by Michael on 2016/11/2.
//  Copyright © 2016年 Michael. All rights reserved.
//

import UIKit

class ViewController: UITableViewController {
    
    
    var listTeams: NSMutableArray!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        //设置导航栏
        self.navigationItem.rightBarButtonItem = self.editButtonItem
        self.navigationItem.title = "单元格移动"
        
        
        
        self.listTeams = NSMutableArray(array: ["黑龙江","吉林","辽宁","北京"])
    }
    
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
    
    //响应视图编辑状态
    override func setEditing(_ editing: Bool, animated: Bool) {
        super.setEditing(editing, animated: animated)
        self.tableView.setEditing(editing, animated: true)
    }
    
    override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return self.listTeams.count
    }
    
    override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        
        let cell:UITableViewCell! = tableView.dequeueReusableCell(withIdentifier: "MoveCell", for: indexPath)
        
            cell.accessoryType = .disclosureIndicator
            cell.textLabel?.text = self.listTeams[indexPath.row] as? String

        return cell
    }
    
    //返回true表示可以移动
    override func tableView(_ tableView: UITableView, canMoveRowAt indexPath: IndexPath) -> Bool {
        return true
    }
    
    //移动单元格时触发此方法
    override func tableView(_ tableView: UITableView, moveRowAt sourceIndexPath: IndexPath, to destinationIndexPath: IndexPath) {
        let mode = self.listTeams[sourceIndexPath.row] as! String
        
        self.listTeams.removeObject(at: sourceIndexPath.row)
        self.listTeams.insert(mode, at: destinationIndexPath.row)
    }
    
    //编辑的样式
    override func tableView(_ tableView: UITableView, editingStyleForRowAt indexPath: IndexPath) -> UITableViewCellEditingStyle {
            return .delete
    }
    
    
    override func tableView(_ tableView: UITableView, commit editingStyle: UITableViewCellEditingStyle, forRowAt indexPath: IndexPath) {
        
        if editingStyle == .delete {
            self.listTeams.removeObject(at: indexPath.row)
            self.tableView.deleteRows(at: [indexPath], with: .fade)
        } else if editingStyle == .insert {
            self.tableView.insertRows(at: [indexPath], with: .fade)
        }
        
        self.tableView.reloadData();
    }
    
    
}

示例

下拉刷新

步骤

1. 创建一个iOS工程

2. 删除storyboard中View Controller Scene 中的View Controller，再从对象库拖入一个Table View Controller到设计界面

3. 打开Table View Controller属性检查器，勾选Is Initial View Controller选项，否则应用启动后是黑屏

4. 将ViewController类的父类由UIViewController改为UITableViewController

5. 打开View Controller的属性选择器在Class列表中选择ViewController

6. UITableViewController默认以注册UITableViewDataSource和UITableViewDelegate协议，不需要再注册

代码实现

//
//  ViewController.swift
//  RefreshCell
//
//  Created by Michael on 2016/11/7.
//  Copyright © 2016年 Michael. All rights reserved.
//



import UIKit

class ViewController: UITableViewController {
    
    
    var listTeams: NSMutableArray!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        //设置导航栏
        self.navigationItem.rightBarButtonItem = self.editButtonItem
        self.navigationItem.title = "单元格移动"
        
        let rc = UIRefreshControl()
        rc.attributedTitle = NSAttributedString(string: "下拉刷新")
        rc.addTarget(self, action: #selector(ViewController.refresh), for: .valueChanged)
        self.refreshControl = rc
        
        
        self.listTeams = NSMutableArray(array: ["黑龙江","吉林","辽宁","北京"])
    }
    
    func refresh() {
        NSLog("refresh")
        if (self.refreshControl?.isRefreshing)! {
            self.refreshControl?.attributedTitle = NSAttributedString(string: "加载中")
            listTeams.add("上海")
            listTeams.add("天津")
            
            self.refreshControl?.endRefreshing()
            self.refreshControl?.attributedTitle = NSAttributedString(string: "下拉刷新")
        }
        self.tableView.reloadData()
    }
    
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
    
    //响应视图编辑状态
    override func setEditing(_ editing: Bool, animated: Bool) {
        super.setEditing(editing, animated: animated)
        self.tableView.setEditing(editing, animated: true)
    }
    
    override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return self.listTeams.count
    }
    
    override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        
        let cell:UITableViewCell! = tableView.dequeueReusableCell(withIdentifier: "RefreshCell", for: indexPath)
        
        cell.accessoryType = .disclosureIndicator
        cell.textLabel?.text = self.listTeams[indexPath.row] as? String
        
        return cell
    }
    
    //返回true表示可以移动
    override func tableView(_ tableView: UITableView, canMoveRowAt indexPath: IndexPath) -> Bool {
        return true
    }
    
    //移动单元格时触发此方法
    override func tableView(_ tableView: UITableView, moveRowAt sourceIndexPath: IndexPath, to destinationIndexPath: IndexPath) {
        let mode = self.listTeams[sourceIndexPath.row] as! String
        
        self.listTeams.removeObject(at: sourceIndexPath.row)
        self.listTeams.insert(mode, at: destinationIndexPath.row)
    }
    
    //编辑的样式
    override func tableView(_ tableView: UITableView, editingStyleForRowAt indexPath: IndexPath) -> UITableViewCellEditingStyle {
        return .delete
    }
    
    
    override func tableView(_ tableView: UITableView, commit editingStyle: UITableViewCellEditingStyle, forRowAt indexPath: IndexPath) {
        
        if editingStyle == .delete {
            self.listTeams.removeObject(at: indexPath.row)
            self.tableView.deleteRows(at: [indexPath], with: .fade)
        } else if editingStyle == .insert {
            self.tableView.insertRows(at: [indexPath], with: .fade)
        }
        
        self.tableView.reloadData();
    }
    
    
}

示例