您的位置:首页 > 移动开发 > IOS开发

iOS之tab bar

2015-10-22 18:27 92 查看
原文链接:http://blog.csdn.net/pony_maggie/article/details/28129473

什么是tabbar? 先几张图:





上图中蓝色框起来的部分就是tabbar, 它有如下几个特征:

1 它通常位于屏幕的最下方,不是必然,但大部分情况是这样。

2 tab bar的每个选项卡通常表示不同的功能,这也是它与segmentedcontrol最重要的区别, 后者强调的是同一功能不同类别的区分,前者则是不同功能的区分。拿开头两个图作为例子,看看他们上面红色框起来的部分,叫segmentedcontrol。

3 因为2的原因,tab bar的不同选项卡通常对应不同的视图。

4 tab bar的每个选项卡一般都有图标,有些是图标+文字(比如最上面两个图),一般不会只有文字。这个也是和segmentedcontrol的一个区别。

我今天写的这个demo,为了涉及面比较广一些,我会分别用一个系统的图标,两个自定义的图标(一个带文字和图片,一个只有文字), 来设置不同的tabbar item。最终效果如下:







开发环境

mac os + xcode5.0 + ios7模拟器

tab bar上的图标大小大一般是30*30,tab bar的整体高度是49。如果需要自定义图标,请参考这个大小比例。

新建一个single View的工程, 然后拖一个tabbar controller到storyboard。你会发现这个tabbar controller还同时带着两个viewController过来,并自动关连到item。 这个”擅自做主”的行为并不会引起我们的反感,因为我们几乎总是需要这样做。

为了便于区分, 我们设置两个view的背景色,最终如下图所示(初始的那个viewcontroller已经被我删除):



然后我们再增加一个item。

拖一个viewcontroller过来,设置一下背景色。然后按住conrol键,从tabbar controller拖到这个viewcontroller, 选择最下面的”relationship”,如下图所示:



然后最终的storyboard如下图所示:



好了,编译运行,一切OK。有没有注意到我一行代码都没有写,是不是很神奇呢!
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: