ios tabbar插件_iOS 自定义 UITabBar 的样式

两种方式：

1.在原 UItabBar 样式的基础上扩展

2.完全自定义 UITabBar 的样式

效果预览：

自定义 tabBar 的样式

有4个 tabBarItem，中间按钮凸起一丢丢，原生半透明的背景。

简介

目前市场上的大部分 App UI 结构都是使用这种标签式的结构，我觉得它至少有以下优点：

很清晰的展示了 App 的主要入口和当前所在入口

各个入口间的切换也很简单，适合频繁切换

缺点：

入口个数不能太多(最好5个以下)

层级结构

下面讨论两种层级结构

1.tabBarController 里嵌 navigationController

tabBarController 嵌套 navigationController.png

2.navigationController 里嵌 tabBarController

navigationController 嵌套 tabBarController

可以很明显看出这两种结构的区别(是否共用 navigationController)。我建议使用 tabBarController 里嵌 navigationController 结构，原因如下：

1.我不确定共用一个 navigationController 是不是优点？！但是缺点很明显，因为大部分情况各个 UIViewController 的 navigationBar 内容是不一样的(有的隐藏，有的有搜索框等)，所以每次切换都需要改 navigationBar 的内容。

2.苹果官方也是建议使用 tabBarController 里嵌 navigationController 这种结构，在《View Controller Catalog for iOS》中的原话：

An app that uses a tab bar controller can also use navigation controllers in one or more tabs. When combining these two types of view controller in the same user interface, the tab bar controller always acts as the wrapper for the navigation controllers.

开始

正常搭建框架。因为这不是本文的重点，也不难，所以可以直接下载源码。

运行效果如下：

原生的 tabBar.png

本例要达到的效果是在中间插入一个 button 并凸起一丢丢，如下：

自定义的tabBar.png

方式一：在原 UITabBar 样式的基础上扩展

使用原生的 tabBarItem，在这基础上添加自定义控件

思路：

1.往 tabBar 上添加自定义的控件

2.重新布局 tabBarItem 和 自定义控件

3.使用自定义的 tabBar

动手

第一步 新建 UITabBar 的子类 MSCustomTabBar

@interface MSCustomTabBar : UITabBar

第二步 在 MSCustomTabBar.m 里创建并添加中间按钮(本例中中间按钮比较简单使用 UIButton 就可以了，如果复杂点的建议新建一个类)

定义属性

@interface MSExtensionalTabBar ()

/// 中间凸起的按钮

@property (nonatomic, strong) UIButton *centerBtn;

@end

重写 getter 方法

- (UIButton *)centerBtn

{

if (_centerBtn == nil) {

_centerBtn = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, 80, 60)];

[_centerBtn setImage:[UIImage imageNamed:@"centerIcon"] forState:UIControlStateNormal];

[_centerBtn addTarget:self action