• 使用 UITableView 创建表格应用演练(1)——一个简单的表格应用


    在很多iOS应用中都有UITableView控件的身影。让我们的系列教程也从UITableView开始吧。

    目标

    任何一个伟大的iOS应用都源自一个伟大的构想。虽然我们只是再做演练,但演练也同样需要一个伟大的构想!这样我们会产生更加浓烈的兴趣,目标更加明确,同时不会纠结于具体的细节之中。

    提示:细节是在不断重复中逐渐掌握的,过早的进入细节很容易让人迷失方向。

    现在用微博的人越来越多,假设我们需要一个管理“微博关注人”的列表这么一个应用,能够帮助我维护微博关注人的信息。怎么样?对于一个iOS初学者,这么一个假设应该已经足够大了吧。:]

    那么我们就开始动手吧。 

    一. 创建应用

    创建应用的方法,可以参见前两天写的:第一个iOS应用——Hello world!,在此不再累述,创建应用时用“My Focus”做为产品名称。如下图所示:

    二. 增加表格控件

    1. 打开“MainStoryboard.storyboard”文件;

    2. 因为要做一个表格应用,而默认的Storyboard是一个视图应用,先点击“View Controller”,把它删除,如下图所示:

    删除之后,我们会发现一片空白,如下图所示:

    3. 添加表格视图控件——从右侧的“工具区域”找到Table View Controller控件,拖到StoryBoard的空白区域放手;

    4. 点击“Table View Controller”左侧的折叠标记依次展开选中“Table View Cell”,然后在属性区的“Identifier”输入:“userInfoCell”,如下图所示:

    OK,我们运行一下,看看刚才比划了这几下实现了哪些效果:

    一个空的表格跃然屏幕之上,而且试着用手拽拽,表格都会随着手势上下滚动了。到目前为止,我们还没有写一句代码,不错吧。:]

    三. 编码前的准备

    在写程序之前,我们需要做一些简单的准备工作。

    要写代码,需要有写的“位置”,在iOS开发中,大多情况能够“写”的位置有两个。

    1. “.h”文件——头文件,用于声明对象的属性,方法等;

    2. “.m”文件——对象实现文件,用于对象的具体实现。

    好,我们先记住这两个,其他用不到的,我们不妨先假设我们已经会了,这样我们会有一个强大的内心,专注去做现在要做的事情。:]

    让我们简单回想一下第二部分中,我们做的事情:打开“MainStoryboard”->删除了默认的“View Controller”->增加一个“Table View Controller”,因为我们要做的是一个表格应用。

    既然要做的是一个表格应用,那么我们需要一个表格的实现对象,先看下导航区域的内容,如下图:

    可以看到两个文件,从名字上看,一个是View Controller的头文件,一个是View Controller的实现文件,这两个文件显然也不是我们需要的,删除掉!

    接下来按照以下步骤操作:

    1. 在GUI上点鼠标右键,在弹出菜单中选择“New File...”,在弹出窗口中选择“Cocoa Touch”“Objective-C class”,点击“Next”按钮,见下图:

    2. 在下一个的窗口中,在“Class”中输入“JOYTableViewController”,“Subclass of”中通过下拉列表选择或者输入“UITableViewController”,同时不要选择下面两个复选框,然后点击“Next”,见下图:

    3. 在下一个窗口,直接点击“Create”按钮创建对象。现在的导航区域应该如下图显示:

    通过以上三步操作,Xcode帮助我们准备好了头文件和实现文件。

    在写代码之前,还需要做一件非常重要的事情——告诉Storyboard,它的要用按照新增加对象中的代码执行动作。

    1. 打开“MainStoryboard.storyboard”;

    2. 点击选中“Table View Controller”;

    3. 点击工具区域的“Show the Identity Inspector”按钮,显示“标示检查器”;

    4. 在“Class”中,点击下拉按钮,选择我们刚刚创建的类“JOYTableViewController”。

    见下图:

    好,通过简单的几步准备,接下来我们要进入具体的实做阶段,激动吗?:]

    四. 通过代码填充表格

    点击“导航区域”的“JOYTableViewController.m”打开它。

    说明:本次演练中,所有的编码都只在这一个文件中。

    小技巧:此时你按一下option + command + 0这个组合键,可以关闭“工具区域”这样可以使“编辑区域”看起来更大些。

    代码开始部分有一个 @interface JOYTableViewController,我们可以把对象的私有属性和方法在此定义,而不必在 .h 文件中进行定义,这个特性可以保证你开放的接口更加的清晰简洁。

    1. 定义一个数组,用于存放显示关注人信息,代码如下:

    1 @interface JOYTableViewController () {
    2 @private
    3     NSArray *_userList;
    4 }
    5 
    6 @end

    提示:不要忘记大括号啊。

    2. 填充数组内容,找到viewDidLoad方法,在方法的末尾添加一句:

    1 _userList = [[NSArray alloc]initWithObjects:@"爱Apps", @"苹果汇", @"数码iPhone大百科",
    2                  @"新浪视野", @"李开复", nil];

    假设我只关注了这五个人。

    3. 修改表格区段数,找到numberOfSectionsInTableView方法,将其中的“return 0”,改为“return 1”,如下所示:

    1 - (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
    2 {
    3     return 1;
    4 }

    有关区段的内容,会在下一篇文章中阐述,现在我们假设表格只有一个区段。

    4. 修改表格行数,找到

    1 - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section

    方法,将其中的return 0,改为:

    1 - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
    2 {
    3     return [_userList count];
    4 }

    说明:这句话的意思是“返回 [用户列表 数量]”,Objective-C的语法有点像自然语言,大家先记住以往我们熟悉的“.”被现在的“空格”和“中括号”替代了。

    预告:计划在TableView的演练专题结束后,写一篇介绍Objective-C的基础语法,尽请期待。:]

    5. 在单元格中依次显示数组内容,找到 

    1 - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath

    方法,在最后的“return cell”语句前添加如下代码:

    1     // 实例化单元格对象
    2     if (cell == nil) {
    3         cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];
    4     }
    5     
    6     // 设置单元格文本
    7     [cell.textLabel setText:[_userList objectAtIndex:[indexPath row]]];

    6. 运行看看效果,见下图:]

    五. 小结

    本次演练我们先暂时告一段落,到目前为止,我们已经创建了一个最简单的表格应用。虽然看起来还很粗糙,但是我们已经迈出了坚实的一步。:]

    本演练源程序下载地址:JoyiOSMyFocus1.zip

    下一篇文章我们会演练如何通过数据文件加载表格内容,同时在表格中显示图片等内容。敬请期待。:]

  • 相关阅读:
    tomcat架构分析和源码解读
    时代和命运,选择和放弃
    Python中的test测试
    python装饰器语法
    网上传言:程序员 = 宅男,程序员真的都宅吗?现实情况是这样!
    编程初学者,哪几种编程语言最值得你去学习?其实你应该这样做!
    C/C++编程笔记:《C语言》—— 数组知识详解,学编程建议收藏!
    细数程序员 10 种“辛酸与无奈”,程序员网友直言:这也太真实了!
    程序人生丨程序员的发展之路,怎样的发展决定你拥有怎样的薪资!
    程序人生丨提问环节面试官让程序员提问,五个程序员问这些,直接录取!
  • 原文地址:https://www.cnblogs.com/liufan9/p/2528714.html
Copyright © 2020-2023  润新知