iOS——UITabBarItem

一、UITabBarItem

1. 理解 UITabBarItem

先讲一下我对 UITabBarController 的理解，如图

UITabBarController 对象的结构如图：

最下面的浅蓝色包起来的那条工具栏是 UITabBar 对象（可以通过 UITabBarController 的 tabBar 属性获得 ）

深蓝色包起来的的是 UITabBarItem，向 UITabBarController 对象中加入一个 UIViewController 对象时，就会自动创建一个 UITabBarItem 并显示，所以，一个 UIViewController 对应一个 UITabBarItem；所以，此时 UITabBarController 有4个 UIViewController 对象

2. 初始化 UITabBarItem 有三种方法

- (instancetype)initWithTitle:(nullableNSString *)title image:(nullableUIImage *)image tag:(NSInteger)tag;

- (instancetype)initWithTitle:(nullableNSString *)title image:(nullableUIImage *)image selectedImage:(nullableUIImage *)selectedImageNS_AVAILABLE_IOS(7_0);

- (instancetype)initWithTabBarSystemItem:(UITabBarSystemItem)systemItem tag:(NSInteger)tag;

看名称就可以知道每个方法的功能了，需要注意的是，第二个方法中的 selectedImage 是选中时的图片

第三个方法的是使用系统标题和图片，其中，UITabBarSystemItem 枚举如下

typedef NS_ENUM(NSInteger, UITabBarSystemItem) {
    UITabBarSystemItemMore,       // 更多
    UITabBarSystemItemFavorites,  // 最爱
    UITabBarSystemItemFeatured,   // 特征
    UITabBarSystemItemTopRated,   // 高级
    UITabBarSystemItemRecents,    // 最近
    UITabBarSystemItemContacts,   // 联系人
    UITabBarSystemItemHistory,    // 历史
    UITabBarSystemItemBookmarks,  // 书签
    UITabBarSystemItemSearch,     // 查找
    UITabBarSystemItemDownloads,  // 下载
    UITabBarSystemItemMostRecent, // 记录
    UITabBarSystemItemMostViewed, // 全部查看
};

上述前三个 UITabBarItem 对应的代码如下

firstVC.tabBarItem = [[UITabBarItem alloc] initWithTabBarSystemItem:UITabBarSystemItemMore tag:0];
UIImage * image = [UIImage imageNamed:@"a89"];
secondVC.tabBarItem = [[UITabBarItem alloc] initWithTitle:@"电话" image:image tag:1];
UIImage * selectedImage = [UIImage imageNamed:@"a90"];
thirdVC.tabBarItem = [[UITabBarItem alloc] initWithTitle:@"发现" image:image selectedImage:selectedImage];

上述第四个 UITabBarItem 中，只设置了标题，没有设置图片，是通过如下代码设置的

fourthVC.tabBarItem.title = @"我";

title 属性是 UITabBarItem 继承 UIBarItem 而来的属性，通过设置该属性，可以将 UITabBarItem 显示指定的标题，也可以设置 image 属性（也是继承 UIBarItem 的属性）来显示图标

其实上述的初始化方法，就是设置 title 和 image 属性的

第四个 UITabBarItem 还有一点，就是设置了偏移量，该属性为

@property (nonatomic,readwrite,assign)UIOffset titlePositionAdjustmentNS_AVAILABLE_IOS(5_0)UI_APPEARANCE_SELECTOR;

代码如下

fourthVC.tabBarItem.titlePositionAdjustment = UIOffsetMake(10, -10);

其中，UIOffset 是一个结构体，其中的 horizontal 变量表示水平方向上的偏移量；vertical 变量表示垂直方向的偏移量

typedef struct UIOffset {
    CGFloat horizontal, vertical; // specify amount to offset a position, positive for right or down, negative for left or up
} UIOffset;

UIOffsetMake() 函数是用来创建 UIOffset 变量的

UIKIT_STATIC_INLINE UIOffset UIOffsetMake(CGFloat horizontal, CGFloat vertical) {
    UIOffset offset = {horizontal, vertical};
    return offset;
}

但是需要注意一点的是，设置水平方向的偏移量时，标题和图标都会移动；但是设置垂直方向的偏移量时，只有标题会移动，图片不会

3. badgeValue

设置 UITabBarItem 的 badgeValue 可以设置其左上角的值，通常用来显示未读消息，如图

代码如下

firstVC.tabBarItem.badgeValue = @"10";

还可以设置它的颜色

代码如下

firstVC.tabBarItem.badgeColor = [UIColor greenColor];

4. 总结属性

1）初始化方法

- (instancetype)initWithTitle:(nullableNSString *)title image:(nullableUIImage *)image tag:(NSInteger)tag;

- (instancetype)initWithTitle:(nullableNSString *)title image:(nullableUIImage *)image selectedImage:(nullableUIImage *)selectedImageNS_AVAILABLE_IOS(7_0);

- (instancetype)initWithTabBarSystemItem:(UITabBarSystemItem)systemItem tag:(NSInteger)tag;

2）设置选中时的图标

@property(nullable,nonatomic,strong)UIImage *selectedImageNS_AVAILABLE_IOS(7_0);

3）设置左上角显示的值

@property(nullable,nonatomic,copy)NSString *badgeValue;

4）设置左上角显示的值的颜色

@property (nonatomic,readwrite,copy,nullable)UIColor *badgeColorNS_AVAILABLE_IOS(10_0)UI_APPEARANCE_SELECTOR;

5）设置偏移量

@property (nonatomic,readwrite,assign)UIOffset titlePositionAdjustmentNS_AVAILABLE_IOS(5_0)UI_APPEARANCE_SELECTOR;

二、UITabBar

1. UITabBar 

就是上述图中的 深蓝色圈出来的对象，UITabBar 直接继承 UIView，所以是可以显示的视图

可以通过 UITabBarController 对象的 tabBar 属性获得

2. 设置 UITabBar 的颜色

总共有三种可设置的颜色，分别是背景色（barTintColor）、UITabBarItem 的颜色（tintColor） 和 未选中的 UITabBarItem 的颜色（unselectedItemTintColor）

@property(null_resettable,nonatomic,strong)UIColor *tintColorNS_AVAILABLE_IOS(5_0);

@property(nullable,nonatomic,strong) UIColor *barTintColorNS_AVAILABLE_IOS(7_0)UI_APPEARANCE_SELECTOR;

@property (nonatomic,readwrite,copy,nullable)UIColor *unselectedItemTintColorNS_AVAILABLE_IOS(10_0)UI_APPEARANCE_SELECTOR;

设置 barTintColor

tabBarController.tabBar.barTintColor = [UIColor darkGrayColor];

设置 tintColor，默认是蓝色，可以从上面的图中看出

tabBarController.tabBar.tintColor = [UIColor yellowColor];

设置 unselectedItemTintColor

tabBarController.tabBar.unselectedItemTintColor = [UIColor redColor];

3. 设置 UITabBar 的 items

UITabBar 有一个 items 属性，用来保存其中的 UITabBarItem 对象，每有一个 UIViewController 对象加入 UITabBarController 对象中，就会有一个 UITabBarItem 对象加入到 UITabBar 对象中

打印当前 UITabBar 的 items，可得

因为此时 UITabBar 对象中有4个 UIViewController，所以也就有4个 UITabBarItem 对象

UITabBar 还有一个 selectedItem，用于保存当前选中的 UITabBarItem 对象，打印当前的 selectedItem，可得

因为当前选中的是第一个 UIViewController，也就是第一个 UITabBarItem 对象，结合上述两幅图看，当前选中的 UITabBarItem 对象的确是第一个

@property(nullable, nonatomic, copy) NSArray<UITabBarItem *> *items;

@property(nullable, nonatomic, weak) UITabBarItem *selectedItem;

设置 UITabBar 的 UITabBarItem 对象，并设置动画效果

- (void)setItems:(nullable NSArray<UITabBarItem *> *)items animated:(BOOL)animated;

4. 设置透明（translucent）

@property(nonatomic,getter=isTranslucent)BOOL translucent NS_AVAILABLE_IOS(7_0);

默认是透明的，此时如图

当将此属性设置为 NO 时，如图

此时，背景色时白色的，一下就能看出透明与不透明的区别

5. 自定义标签顺序

当 UITabBarController 对象有5个以上的 UIViewController 对象时，那么本来在第5个显示 UITabBarItem 的地方就会显示一个 more 的 item，它对应的 UIViewController 是一个 UINavigationController 对象，从第5个开始以后的 UIViewController 都在这个 UINavigationController 对象，如图

此时，点击右上角的 Edit 按钮，可以自定义所有的 UIViewController 对象的顺序

6. 设置 UITabBar 风格

UITabBar 有 4 种风格，但是用到的只有两种，剩下的两种已经被废弃，可通过别的方法实现

@property(nonatomic)UIBarStyle barStyleNS_AVAILABLE_IOS(7_0)UI_APPEARANCE_SELECTOR __TVOS_PROHIBITED;

UIBarStyle 枚举如下

typedef NS_ENUM(NSInteger, UIBarStyle) {
    UIBarStyleDefault          = 0, // 默认风格
    UIBarStyleBlack            = 1, // 黑色不透明风格
    UIBarStyleBlackOpaque      = 1, // 黑色不透明风格，被废弃，可使用 UIBarStyleBlack
    UIBarStyleBlackTranslucent = 2, // 黑色透明风格，被废弃，可使用 UIBarStyleBlcak 并设置 translucent 属性为 YES
};

7. 设置位置和大小

可以通过 itemPositioning 属性来设置，如下

@property(nonatomic) UITabBarItemPositioning itemPositioning NS_AVAILABLE_IOS(7_0) UI_APPEARANCE_SELECTOR __TVOS_PROHIBITED;

其中，UITabBarItemPositioning 枚举如下

typedef NS_ENUM(NSInteger, UITabBarItemPositioning) {
    UITabBarItemPositioningAutomatic,  // 自动，默认
    UITabBarItemPositioningFill,       // 充满
    UITabBarItemPositioningCentered,   // 中心
} NS_ENUM_AVAILABLE_IOS(7_0);

使用 UITabBarItemPositioningAutomatic 时，对于 iPhone 界面来说，UITabBarItem 会自动充满水平方向；对于 iPad 界面来说，UITabBarItem 会被居中在指定的宽度和间距中（通过 itemWidth 和 itemSpacing 属性指定）

使用 UITabBarItemPositioningFill 时，会使 UITabBarItem 在水平方向填满

使用 UITabBarItemPositioningCentered 时，会使 UITabBarItem 被居中在指定的 itemWidth 和 itemSpacing中

设置 itemWidth 和 itemSpacing 属性

@property(nonatomic) CGFloat itemWidth NS_AVAILABLE_IOS(7_0) UI_APPEARANCE_SELECTOR;

@property(nonatomic) CGFloat itemSpacing NS_AVAILABLE_IOS(7_0) UI_APPEARANCE_SELECTOR;

8. 代理

@property(nullable, nonatomic, weak) id<UITabBarDelegate> delegate;

UITabBarDelegate 代理方法如下

1）选中某个 UITabBarItem 时调用该方法

- (void)tabBar:(UITabBar *)tabBar didSelectItem:(UITabBarItem *)item; 

2）将要开始自定义 UITabBarItem 的顺序时调用，传入的参数是位自定义之前的 items

- (void)tabBar:(UITabBar *)tabBar willBeginCustomizingItems:(NSArray<UITabBarItem *> *)items __TVOS_PROHIBITED;

3）已经开始自定义 UITabBarItem 的顺序时调用

- (void)tabBar:(UITabBar *)tabBar didBeginCustomizingItems:(NSArray<UITabBarItem *> *)items __TVOS_PROHIBITED;

4）将要结束自定义 UITabBarItem 的顺序时调用，第二个参数 changed 表示 items 的顺序是否有改变

- (void)tabBar:(UITabBar *)tabBar willEndCustomizingItems:(NSArray<UITabBarItem *> *)items changed:(BOOL)changed __TVOS_PROHIBITED;

5）已经结束自定义 UITabBarItem 的顺序时调用

- (void)tabBar:(UITabBar *)tabBar didEndCustomizingItems:(NSArray<UITabBarItem *> *)items changed:(BOOL)changed __TVOS_PROHIBITED;