iOS项目开发实战——学会使用TableView列表控件(一)

       列表控件是iOS开发中使用频度最高的控件,类似于Android中的ListView。如iPhone手机中的通话记录,短信等列表都是由TableView来完成的。使用起来也比Button,Label等稍稍有一点难度。现在开始我们来学习如何使用TableView。

(1)新建一个Single View Application,语言选择Swift。新建完成后到Main.storyboard中删除原来的ViewController,重新拖入一个TableViewController。如图:

iOS项目开发实战——学会使用TableView列表控件(一)_第1张图片


(2)可能一开始拖入是一个不是一个iPhone形状,而是类似iPad界面的Controller,可以去勾选掉“Use Auto Layout”和“Use size classes”.然后看到设计界面是一个iPhone的形状了。

(3)删除原来的ViewController.swift文件,重新新建一个Cocoa Touch Class,然后注意继承自UITableViewController.然后新建完成。发现类中已经自带有不少的方法。

(4)然后再次来到Main.storyboard中,把该界面的Class选择为刚新建的类。然后选中TableView,把Prototype Cells输入1,现在的界面如图所示:

iOS项目开发实战——学会使用TableView列表控件(一)_第2张图片


(5)在Prototype Cells界面中拖入一个Label,等下可以在这个Label中显示文本。然后设置这个Label的tag为某个数值,如101.

iOS项目开发实战——学会使用TableView列表控件(一)_第3张图片


iOS项目开发实战——学会使用TableView列表控件(一)_第4张图片


(6)然后来到代码中,开始实现。

override func numberOfSectionsInTableView(tableView: UITableView) -> Int {
        // #warning Potentially incomplete method implementation.
        // Return the number of sections.
        return 1
    }

该方法返回你要多少个Section,Section可以理解为你的列表需要多少个部分,或者说多少个组,我们先返回1.


(7)

override func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        // #warning Incomplete method implementation.
        // Return the number of rows in the section.
        return 3
    }

该方法返回在你的列表中需要多少行,也就是多少个cell。或者用Android习惯的说法就是多少个Item。我们先返回3项吧。


(8)

override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCellWithIdentifier("tableCell", forIndexPath: indexPath) as! UITableViewCell


      var label = cell.viewWithTag(101) as! UILabel
      label.text = "你好,iOS"
      

        return cell
    }

该方法是比较重要的类,主要是对列表中的Cells进行的操作。第一个参数tabeView表示是你界面中的哪一个TableView,因为可能你的界面中有多个TableView。第二个参数indexPath用来指定TableView中的某一个位置Cells。我用以上的代码在刚才的3个Cell中都填充"你好,iOS"。


(9)运行程序:发现列表能成功显示。

iOS项目开发实战——学会使用TableView列表控件(一)_第5张图片


(10)仔细观察列表,发现顶部过高,和顶部的文字几乎重叠,需要进行如下操作:

iOS项目开发实战——学会使用TableView列表控件(一)_第6张图片


选中TableView,把Content Insets的top值改为20。如果没有出现Content Insets,可能是因为你选择了“Use Auto Layout。”  然后运行程序。列表框就下移了一段距离。显示良好。

iOS项目开发实战——学会使用TableView列表控件(一)_第7张图片.


github主页:https://github.com/chenyufeng1991  。欢迎大家访问!

你可能感兴趣的:(ios,tableview,swift,列表控件)