多语言展示
当前在线:832今日阅读:167今日分享:16

tableview如何隐藏多余分割线separator

在 tableview当中,有时候我们只需要部分的的cell有分割线。不如本来就是只要显示两行,不管是动态的还是静态的,就只要这两行。那么如果这个时候在把别的没有内容的cell的分割线也显示出来,就给人感觉不好。我们开发一个APP要重点考虑用户体验好不好。所以,我们也应当站在客户的角度来思考问题。把不需要的不美观的东西都给去掉。
工具/原料

Mac

方法/步骤
1

隐藏多余的cell的分割线其实在很多地方都会用到,比如我们写登录界面的时候,当然了,这个也可以把tableview的全部分割线都去掉,然后自己添加背景图片也是一样的。但是有时候直接用tableview的分割线会比较方便,具体项目当中还是根据自己的需求来选择吧。这里我们首先新建一个项目。

2

现在打开我们刚刚新建的项目,然后点击Main.storyboard,如图所示。这个时候我们会看见storyboard里边的viewcontroller。点击一下这个viewcontroller。然后delete,把这个viewcontroller删除了。拖拽一个tableviewcontroller在到项目中。如图所示。

3

现在已经把tableviewcontroller拖到项目中了,这个时候我们会看到刚刚的tableviewcontroller还太大了,这里我们只是测试一下,所以关闭size classes,这样是符合我们平时看手机的习惯。勾选掉use size classes就可以了。如图所示,然后我们的界面就变成正常手机的样式了。

4

现在我们来对tableViewcontroller做相应的设置,这里就以tableview 的content 为static cells为例来讲解。为了能让其显示得比较考中,那么我们就拖拽一个透视图到我们的tableview中。然后点击每个cell,设置cell的style为basic就好。这儿可以根据自己的具体需求来设置,自定义的也可以。我这里就是为了 能让cell上有字能显示出来才这样设置的。

5

现在是没有去除多余的分割线的样子,我们运行一下看看,也便于待会儿做对比。先在左上角选好我们需要的模拟器,随便选择一个就可以了,如果你可以进行真机测试的话,那么用手机自然是更好的了。点击command + r 就可以运行了。注意要先将这个控制器设置为响应的模拟器,如图所示。

6

我们看到这个时候没有数据的cell的分割线也显示出来了,这样给用户的体验就不好了。不管做什么,首先都应该考虑用户的体验。所以我们应该想办法删除了。首先我们点击tableview,把全部的分割线都隐藏了,如图所示。

7

然后我们一个一个的点击我们有数据的cell,单独设置每个cell的分割线。我这里主要的目的就是把分割线给显示出来,所以左右的间距是随便设置的。在你的项目中,你可以根据需要来设置所以的间距,不要显得太突兀就好了。具体设置如图所示。

8

如果你是根据我的要求一步一步来的,那么到这儿就不会再出什么意外了。我们已经设置好了,把不需要的分割线都给隐藏了,只显示我们需要的分割线。现在我们再运行一下看看。我们看到现在就是只有有数据的cell下边的分割线才显示出来了。这样是不是感觉就会好很多。如果你是用代码创建的,那么原理也是一样的。

推荐信息