您的位置:首页 > 产品设计 > UI/UE

【新浪微博项目】04微博项目重写TabBar

2015-04-05 20:06 399 查看


1.初始化自定义TabBar

自定义一个IWTabBar继承于UIView。在控制器启动的时候初始化初始化TabBar。
/**
*  初始化tabbar
*/
- (void)setupTabbar
{
IWTabBar *customTabBar = [[IWTabBar alloc] init];

customTabBar.frame = self.tabBar.bounds;
[self.tabBar addSubview:customTabBar];

//customTabBar.frame = self.tabBar.frame;
//[self.view addSubview:customTabBar];

}


其中被注释掉的两行之所以不能采取,是因为这样只是覆盖了原来系统自带的TabBar。当导航控制器push到下一个控制器的时候,可以把系统自带的TabBar去掉,但是自己定义的TabBar去不掉。所以

IWTabBar *customTabBar = [[IWTabBar
alloc] init];
customTabBar.frame =
self.tabBar.bounds;
[self.tabBar
addSubview:customTabBar];
是标准写法。


2.往TabBar中添加按钮

TarBar中的按钮的个数是不确定的,根据TabBarController中的Controller数量来决定。所以在TabBar中需要一个用来往其中添加按钮的函数:

- (void)addTabBarButtonWithItem:(UITabBarItem *)item
{
// 1.创建按钮
IWTabBarButton *button = [[IWTabBarButton alloc] init];
[self addSubview:button];

// 2.设置数据
button.item = item;

// 3.监听按钮点击
[button addTarget:self action:@selector(buttonClick:) forControlEvents:UIControlEventTouchDown];

// 4.默认选中第0个按钮
if (self.subviews.count == 1) {
[self buttonClick:button];
}
}
其中item是根据tabBarItem来确定的模型。
并且重写- (void)layoutSubviews来设置按钮的位置
- (void)layoutSubviews
{
[super layoutSubviews];

// 按钮的frame数据
CGFloat buttonH = self.frame.size.height;
CGFloat buttonW = self.frame.size.width / self.subviews.count;
CGFloat buttonY = 0;

for (int index = 0; index<self.subviews.count; index++) {
// 1.取出按钮
IWTabBarButton *button = self.subviews[index];

// 2.设置按钮的frame
CGFloat buttonX = index * buttonW;
button.frame = CGRectMake(buttonX, buttonY, buttonW, buttonH);

// 3.绑定tag
button.tag = index;
}
}


在MRRootTabBarController中通过添加的Controller个数来确定按钮的数量
[self.customTabBar
addTabBarButtonWithItem:childVc.tabBarItem];
/**
*  初始化一个子控制器
*
*  @param childVc           需要初始化的子控制器
*  @param title             标题
*  @param imageName         图标
*  @param selectedImageName 选中的图标
*/
- (void)setupChildViewController:(UIViewController *)childVc title:(NSString *)title imageName:(NSString *)imageName selectedImageName:(NSString *)selectedImageName
{
// 1.设置控制器的属性
childVc.title = title;
// 设置图标
childVc.tabBarItem.image = [UIImage imageWithName:imageName];
// 设置选中的图标
UIImage *selectedImage = [UIImage imageWithName:selectedImageName];
if (iOS7) {
childVc.tabBarItem.selectedImage = [selectedImage imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
} else {
childVc.tabBarItem.selectedImage = selectedImage;
}

// 2.包装一个导航控制器
UINavigationController *nav = [[UINavigationController alloc] initWithRootViewController:childVc];
[self addChildViewController:nav];

// 3.添加tabbar内部的按钮
[self.customTabBar addTabBarButtonWithItem:childVc.tabBarItem];
}


运行结果,如图所示。有两层tabbar




3.删除TabBar中系统自带的按钮

上面之所以会有两层按钮,原因就是因为还有系统自带的按钮没有被删除。所以我们下面删除系统TabBar中自带的按钮。
在view即将显示的时候,Tabbar中才有子控件,所以重写- (void)viewWillAppear:(BOOL)animated方法,删除系统自带的TabBar中的button。
- (void)viewWillAppear:(BOOL)animated
{
[super viewWillAppear:animated];
// 删除系统自动生成的UITabBarButton
for (UIView *child in self.tabBar.subviews) {
if ([child isKindOfClass:[UIControl class]]) {
[child removeFromSuperview];
}
}
}

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  UITabBar IOS uiview