[低耦合集成 TabBarController] 最低只需传两个数组即可完成主流 App 框架搭建

2015-10-26 01:25:09 +08:00
 stevechen1010
[Github 仓库地址戳这里]( https://github.com/ChenYilong/CYLTabBarController)

![CocoaPods 版本 v1.0.1]( https://img.shields.io/badge/pod-v1.0.1-brightgreen.svg)

![Objective-C]( https://img.shields.io/badge/Objective--C-compatible-orange.svg)

![iOS6+]( https://img.shields.io/badge/platform-iOS%206.0%2B-ff69b4.svg)




## 导航
1. [与其他自定义 TabBarController 的区别]( https://github.com/ChenYilong/CYLTabBarController#与其他自定义 tabbarcontroller 的区别)
2. [集成后的效果]( https://github.com/ChenYilong/CYLTabBarController#集成后的效果)
3. [使用 CYLTabBarController]( https://github.com/ChenYilong/CYLTabBarController#使用 cyltabbarcontroller)
1. [ 第一步:使用 cocoaPods 导入 CYLTabBarController ]( https://github.com/ChenYilong/CYLTabBarController#第一步使用 cocoapods 导入 cyltabbarcontroller)
2. [第二步:设置 CYLTabBarController 的两个数组:控制器数组和 TabBar 属性数组]( https://github.com/ChenYilong/CYLTabBarController#第二步设置 cyltabbarcontroller 的两个数组控制器数组和 tabbar 属性数组)
3. [第三步:将 CYLTabBarController 设置为 window 的 RootViewController]( https://github.com/ChenYilong/CYLTabBarController#第三步将 cyltabbarcontroller 设置为 window 的 rootviewcontroller)
4. [第四步(可选):创建自定义的形状不规则加号按钮]( https://github.com/ChenYilong/CYLTabBarController#第四步可选创建自定义的形状不规则加号按钮)
2. [补充说明]( https://github.com/ChenYilong/CYLTabBarController#补充说明)


## 与其他自定义 TabBarController 的区别

-| 特点 |解释
-------------|-------------|-------------
1| 低耦合 | 与业务完全分离,最低只需传两个数组即可完成主流 App 框架搭建
2 |TabBar 内均使用系统的 TabbarItem ,并非 UIButton 或 UIView | 无需反复调“间距位置等”来接近系统效果
3 | 自动监测是否需要添加“加号”按钮,并能自动设置位置 |[CYLTabBarController]( https://github.com/ChenYilong/CYLTabBarController) 既支持类似微信的“中规中矩”的 `TabBarController` 样式,并且默认就是微信这种样式,同时又支持类似“微博”或“淘宝闲鱼”这种具有不规则加号按钮的 `TabBarController` 。想支持这种样式,只需自定义一个加号按钮,[CYLTabBarController]( https://github.com/ChenYilong/CYLTabBarController) 能检测到它的存在并自动将 `tabBar` 排序好,无需多余操作,并且也预留了一定接口来满足自定义需求。“加号”按钮的样式、 frame 均在自定义的类中独立实现,不会涉及 tabbar 相关设置。
4|即使加号按钮超出了 tabbar 的区域,超出部分依然能响应点击事件 | 红线内的区域均能响应 tabbar 相关的点击事件,![enter image description here]( http://i57.tinypic.com/2r7ndzk.jpg)
5 |支持 CocoaPods |容易集成




(学习交流群: 498865024 )



## 集成后的效果:
既支持默认样式 | 同时也支持创建自定义的形状不规则加号按钮
-------------|-------------
![enter image description here]( http://i62.tinypic.com/rvcbit.jpg?192x251_130)| ![enter image description here]( http://i58.tinypic.com/24d4t3p.jpg?192x251_130)


本仓库配套 Demo 的效果:| [另一个 Demo]( https://github.com/ChenYilong/CYLTabBarControllerDemoForWeib) 使用 CYLTabBarController 实现了微博 Tabbar 框架,效果如下
-------------|-------------
![enter image description here]( http://i59.tinypic.com/wvxutv.jpg)|![enter image description here]( http://i62.tinypic.com/6ru269.jpg)


## 使用[CYLTabBarController]( https://github.com/ChenYilong/CYLTabBarController)
四步完成主流 App 框架搭建:

1. [ 第一步:使用 cocoaPods 导入 CYLTabBarController ]( https://github.com/ChenYilong/CYLTabBarController#第一步使用 cocoapods 导入 cyltabbarcontroller)
2. [第二步:设置 CYLTabBarController 的两个数组:控制器数组和 TabBar 属性数组]( https://github.com/ChenYilong/CYLTabBarController#第二步设置 cyltabbarcontroller 的两个数组控制器数组和 tabbar 属性数组)
3. [第三步:将 CYLTabBarController 设置为 window 的 RootViewController]( https://github.com/ChenYilong/CYLTabBarController#第三步将 cyltabbarcontroller 设置为 window 的 rootviewcontroller)
4. [第四步(可选):创建自定义的形状不规则加号按钮]( https://github.com/ChenYilong/CYLTabBarController#第四步可选创建自定义的形状不规则加号按钮)


### 第一步:使用 cocoaPods 导入 CYLTabBarController

在 `Podfile` 中如下导入:


```Objective-C
pod 'CYLTabBarController'
```

然后使用 `cocoaPods` 进行安装:

建议使用如下方式:

```Objective-C
# 不升级 CocoaPods 的 spec 仓库
pod update --verbose
```



### 第二步:设置 CYLTabBarController 的两个数组:控制器数组和 TabBar 属性数组

```Objective-C
- (void)setupViewControllers {
CYLHomeViewController *firstViewController = [[CYLHomeViewController alloc] init];
UIViewController *firstNavigationController = [[UINavigationController alloc]
initWithRootViewController:firstViewController];

CYLSameFityViewController *secondViewController = [[CYLSameFityViewController alloc] init];
UIViewController *secondNavigationController = [[UINavigationController alloc]
initWithRootViewController:secondViewController];


CYLTabBarController *tabBarController = [[CYLTabBarController alloc] init];
[self customizeTabBarForController:tabBarController];

[tabBarController setViewControllers:@[
firstNavigationController,
secondNavigationController,
]];
self.tabBarController = tabBarController;
}

/*
*
在`-setViewControllers:`之前设置 TabBar 的属性,
*
*/
- (void)customizeTabBarForController:(CYLTabBarController *)tabBarController {

NSDictionary *dict1 = @{
CYLTabBarItemTitle : @"首页",
CYLTabBarItemImage : @"home_normal",
CYLTabBarItemSelectedImage : @"home_highlight",
};
NSDictionary *dict2 = @{
CYLTabBarItemTitle : @"同城",
CYLTabBarItemImage : @"mycity_normal",
CYLTabBarItemSelectedImage : @"mycity_highlight",
};

NSArray *tabBarItemsAttributes = @[ dict1, dict2 ];
tabBarController.tabBarItemsAttributes = tabBarItemsAttributes;
}
```


### 第三步:将 CYLTabBarController 设置为 window 的 RootViewController

```Objective-C
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
/* *省略部分: * */
[self.window setRootViewController:self.tabBarController];
/* *省略部分: * */
return YES;
}
```

### 第四步(可选):创建自定义的形状不规则加号按钮


创建一个继承于 CYLPlusButton 的类,要求和步骤:


1. 实现 `CYLPlusButtonSubclassing` 协议

2. 子类将自身类型进行注册,一般可在 `application` 的 `applicationDelegate` 方法里面调用 `[YourClass registerSubClass]` 或者在子类的 `+load` 方法中调用:

```Objective-C
+(void)load {
[super registerSubclass];
}
```

协议提供了两个可选方法:

```Objective-C
+ (NSUInteger)indexOfPlusButtonInTabBar;
+ (CGFloat)multiplerInCenterY;
```

作用分别是:

```Objective-C
+ (NSUInteger)indexOfPlusButtonInTabBar;
```
用来自定义加号按钮的位置,如果不实现默认居中,但是如果 `tabbar` 的个数是奇数则必须实现该方法,否则 `CYLTabBarController` 会抛出 `exception` 来进行提示。


```Objective-C
+ (CGFloat)multiplerInCenterY;
```

该方法是为了调整自定义按钮中心点 Y 轴方向的位置,建议在按钮超出了 `tabbar` 的边界时实现该方法。返回值是自定义按钮中心点 Y 轴方向的坐标除以 `tabbar` 的高度,如果不实现,会自动进行比对,预设一个较为合适的位置,如果实现了该方法,预设的逻辑将失效。


详见 Demo 中的 `CYLPlusButtonSubclass` 类的实现。



### 补充说明
如果想更进一步的自定义 `TabBar` 样式可在 `-application:didFinishLaunchingWithOptions:` 方法中设置

```Objective-C
/**
* tabBarItem 的选中和不选中文字属性、背景图片
*/
- (void)customizeInterface {

// 普通状态下的文字属性
NSMutableDictionary *normalAttrs = [NSMutableDictionary dictionary];
normalAttrs[NSForegroundColorAttributeName] = [UIColor grayColor];

// 选中状态下的文字属性
NSMutableDictionary *selectedAttrs = [NSMutableDictionary dictionary];
selectedAttrs[NSForegroundColorAttributeName] = [UIColor darkGrayColor];

// 设置文字属性
UITabBarItem *tabBar = [UITabBarItem appearance];
[tabBar setTitleTextAttributes:normalAttrs forState:UIControlStateNormal];
[tabBar setTitleTextAttributes:normalAttrs forState:UIControlStateHighlighted];
UITabBar *tabBarAppearance = [UITabBar appearance];
[tabBarAppearance setBackgroundImage:[UIImage imageNamed:@"tabbar_background"]];
}

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
/* *省略部分: * */
[self.window makeKeyAndVisible];
[self customizeInterface];
return YES;
}
```





(更多 iOS 开发干货,欢迎关注 [微博 @iOS 程序犭袁]( http://weibo.com/luohanchenyilong/) )

----------
Posted by [微博 @iOS 程序犭袁]( http://weibo.com/luohanchenyilong/)
原创文章,版权声明:自由转载-非商用-非衍生-保持署名 | [Creative Commons BY-NC-ND 3.0]( http://creativecommons.org/licenses/by-nc-nd/3.0/deed.zh)
2885 次点击
所在节点    iDev
5 条回复
fhefh
2015-10-26 09:02:14 +08:00
mark
holystrike
2015-10-26 09:41:47 +08:00
马可波罗先

有 swift 版本咩
fengjianxinghun
2015-10-26 10:51:22 +08:00
希望库都是 OC 的,让 swift 死掉
dorentus
2015-10-26 10:57:17 +08:00
@fengjianxinghun Swift 可以使用绝大部分 OC 的库, OC 不能用绝大部分 Swift 的库,不知道是谁会死掉
johnlui
2015-10-28 10:30:33 +08:00
@fengjianxinghun 苹果都全面转向 Swift 开发自带 APP 了,国外大多数公司的新项目都用 Swift 来开发了,不要抱有幻想了。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/231046

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX