上次做了提醒数字，然后进行封装，可以随程序进行调用，看一下上次运行的结果：
接下来继续完善tabbar，因为新浪微博tabbar中间是有一个加号的，所以我也需要弄一个加号，这次就是做加号。
首次需要将提醒数字先去掉，首页里面的东西也不能有，恢复成原来样子，运行结果如下：
现在就可以将按钮加到tabbar上去：
在QLDTabBar.m:
@property (nonatomic, weak) UIButton *plusButton;
-(instancetype)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
if (!iOS7) { //如果不是ios7的，那么需要这个tabbar背景
self.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageWithName:@"tabbar_background"]];
}
//添加一个加号按钮 创建之后，self.subviews.count == 1,所以选中第0个按钮是没有效果了
UIButton *plusButton = [UIButton buttonWithType:UIButtonTypeCustom];
//设置背景图片（橙色的那张）
[plusButton setBackgroundImage:[UIImage imageWithName:@"tabbar_compose_button"] forState:UIControlStateNormal];
[plusButton setBackgroundImage:[UIImage imageWithName:@"tabbar_compose_button_highlighted"] forState:UIControlStateHighlighted];
//设置背景图片上面的加号图片
[plusButton setImage:[UIImage imageWithName:@"tabbar_compose_icon_add"] forState:UIControlStateNormal];
[plusButton setImage:[UIImage imageWithName:@"tabbar_compose_icon_add_highlighted"] forState:UIControlStateHighlighted];
//设置button的尺寸
plusButton.bounds = CGRectMake(0, 0, plusButton.currentBackgroundImage.size.width, plusButton.currentBackgroundImage.size.height);
[self addSubview:plusButton];
self.plusButton = plusButton;
}
return self;
}
- (void)layoutSubviews
{
[super layoutSubviews];
//调整加号按钮的位置 因为加号在中间，所以设置center
CGFloat h = self.frame.size.height;
CGFloat w = self.frame.size.width;
self.plusButton.center = CGPointMake(w * 0.5, h * 0.5);
//设置按钮的frame数据
CGFloat buttonW = self.frame.size.width / self.subviews.count;
CGFloat buttonH = self.frame.size.height;
CGFloat buttonY = 0;
for (int index = 0; index < self.subviews.count; index++) {
//1.取出按钮
QLDTabBarButton *button = self.subviews[index];
//2.设置按钮的frame
CGFloat buttonX = index * buttonW;
button.frame = CGRectMake(buttonX, buttonY, buttonW, buttonH);
//3.绑定tag (是为了能够在代理的时候区分到底是哪个按钮)
button.tag = index;
}
}
因为这里的加号按钮位置是定死的，所以直接在initWithFrame里面写了。
运行一下，看效果：
但是结果这个按钮是出现在左边的，但是我们在layoutSubviews里面的设置按钮位置的时候是设置在正中间的，之所以会这样是因为在设置按钮位置之后的代码里，这个for循环里面的有问题，因为这个是self.subviews.count是从0开始的，但是在initWithFrame里面，当我创建UIButton *plusButton之后，self.subviews.count = 1，而这个按钮就是第一个，所以才会在最前面，那么接下来就需要改一下self.subviews.count。
可以创建一个用来装首页、消息、广场、我这4个button的数组，然后按照数组来进行位置安排，仍然还是在for循环里面的做：
@property (nonatomic, strong) NSMutableArray *tabBarButtons;
//懒加载 （因为这只需要加载一次就可以，不用关心这是什么时候创建的）
- (NSMutableArray * )tabBarButtons
{
if (_tabBarButtons == nil) {
_tabBarButtons = [NSMutableArray array];
}
return _tabBarButtons;
}
- (void) addTabBarButtonWithItem: (UITabBarItem *)item
{
//1.创建按钮，将button加载到QLDTabBar上
QLDTabBarButton *button = [[QLDTabBarButton 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];
}
//5.添加按钮到数组中
[self.tabBarButtons addObject:button];
}
在layoutSubviews里面for循环更改：
for (int index = 0; index < self.tabBarButtons.count; index++) {
//1.取出按钮
QLDTabBarButton *button = self.tabBarButtons[index];
//2.设置按钮的frame
CGFloat buttonX = index * buttonW;
button.frame = CGRectMake(buttonX, buttonY, buttonW, buttonH);
//3.绑定tag (是为了能够在代理的时候区分到底是哪个按钮)
button.tag = index;
}
主要更改的地方就是self.tabBarButtons.count，self.tabBarButtons[index]。
运行一下，看效果：
从效果图可以看到，中间的加号位置已经正确了，就是在按钮数组中，位置有点不对，改正的方法就是在for循环里加一个判断，然后在第3、4个按钮的时候，增加一个按钮的宽度：
for (int index = 0; index < self.tabBarButtons.count; index++) {
//1.取出按钮
QLDTabBarButton *button = self.tabBarButtons[index];
//2.设置按钮的frame
CGFloat buttonX = index * buttonW;
if (index > 1) {
buttonX += buttonW;
}
button.frame = CGRectMake(buttonX, buttonY, buttonW, buttonH);
//3.绑定tag (是为了能够在代理的时候区分到底是哪个按钮)
button.tag = index;
}
运行一下，看运行结果：
这样就能正确运行了，但是没有默认选中首页了，所以默认选中的顺序有点问题，应该是需要先将button放入数组中，然后判断数组中数目为1的时候进行默认选中：
- (void) addTabBarButtonWithItem: (UITabBarItem *)item
{
//1.创建按钮，将button加载到QLDTabBar上
QLDTabBarButton *button = [[QLDTabBarButton alloc] init];
[self addSubview:button];
//5.添加按钮到数组中
[self.tabBarButtons addObject:button];
//2.设置按钮的数据
button.item = item;
//3.监听按钮的点击
[button addTarget:self action:@selector(buttonClick:) forControlEvents:UIControlEventTouchDown];
//4.默认选中第0个按钮
if (self.tabBarButtons.count == 1) {
[self buttonClick:button];
}
}
运行一下，看运行结果：
这样就有默认选中了，这就完成了这个加号按钮了。
另外还有需要做的是点击加号按钮，会弹出一个控制器。
首先是需要添加代理，然后控制器实现代理弹出控制器：
在QLDTabBar.h里申明：
@class QLDTabBar;
/**
* 设置代理，通过代理能够告知TabBarViewController，从而能够改变navigationbar的显示
*/
@protocol QLDTabBarDelegate <NSObject>
@optional
// 代理，获取按钮从哪个跳转到哪个
-(void) tabBar: (QLDTabBar *)tabBar didSelectedButtonFrom: (int) from to: (int)to;
/**
* QLDTabBar中间的加号按钮被点击了
*/
- (void)tabBarDidClickedPlusButton:(QLDTabBar *)tabBar;
@end
在QLDTabBar.m里实现：
-(instancetype)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
if (!iOS7) { //如果不是ios7的，那么需要这个tabbar背景
self.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageWithName:@"tabbar_background"]];
}
[self addPlusButton];
}
return self;
}
/**
* 添加加号按钮
*/
-(void)addPlusButton
{
//添加一个加号按钮 创建之后，self.subviews.count == 1,所以选中第0个按钮是没有效果了
UIButton *plusButton = [UIButton buttonWithType:UIButtonTypeCustom];
//设置背景图片（橙色的那张）
[plusButton setBackgroundImage:[UIImage imageWithName:@"tabbar_compose_button"] forState:UIControlStateNormal];
[plusButton setBackgroundImage:[UIImage imageWithName:@"tabbar_compose_button_highlighted"] forState:UIControlStateHighlighted];
//设置背景图片上面的加号图片
[plusButton setImage:[UIImage imageWithName:@"tabbar_compose_icon_add"] forState:UIControlStateNormal];
[plusButton setImage:[UIImage imageWithName:@"tabbar_compose_icon_add_highlighted"] forState:UIControlStateHighlighted];
//设置button的尺寸
plusButton.bounds = CGRectMake(0, 0, plusButton.currentBackgroundImage.size.width, plusButton.currentBackgroundImage.size.height);
//监听加号按钮的点击
[plusButton addTarget:self action:@selector(plusButtonClick:) forControlEvents:UIControlEventTouchUpInside];
[self addSubview:plusButton];
self.plusButton = plusButton;
}
-(void)plusButtonClick:(QLDTabBarButton *)button
{
//1. 通知代理
if ([self.delegate respondsToSelector:@selector(tabBarDidClickedPlusButton:)]) {
//从当前的按钮跳到现在的按钮
[self.delegate tabBarDidClickedPlusButton:self];
}
}
在Finder里新建一个Compose->Controller:新建继承自ViewController的QLDComposeViewController,在里面实现弹出后的控制器里的内容。
先在QLDTabBarViewController.m中导入QLDComposeViewController.h，然后实现代理方法：
/**
* 监听tabbar加号按钮的改变
*/
-(void)tabBarDidClickedPlusButton:(QLDTabBar *)tabBar
{
QLDComposeViewController *compose = [[QLDComposeViewController alloc] init];
UINavigationController *nav= [[UINavigationController alloc] initWithRootViewController:compose];
//弹出nav
[self presentViewController:nav animated:YES completion:nil];
}
最后就是在QLDComposeViewController.m中设置控制器的内容显示：
- (void)viewDidLoad {
[super viewDidLoad];
//设置背景白色
self.view.backgroundColor = [UIColor whiteColor];
//设置标题“发微博”
self.title = @"发微博";
//设置navigationbar左边的按钮
self.navigationItem.leftBarButtonItem = [[UIBarButtonItem alloc] initWithTitle:@"取消" style:UIBarButtonItemStyleBordered target:self action:@selector(cancel)];
self.navigationItem.leftBarButtonItem.tintColor = [UIColor orangeColor];
//设置navigationbar右边的按钮
if (!iOS7) {
//若不是iOS7
UIButton *rightButton = [[UIButton alloc] init];
[rightButton setTitle:@"发送" forState:UIControlStateNormal];
[rightButton setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
[rightButton setBackgroundImage:[UIImage imageWithName:@"navigationbar_button_send_background"] forState:UIControlStateNormal];
[rightButton setBackgroundImage:[UIImage imageWithName:@"navigationbar_button_send_background_pushed"] forState:UIControlStateHighlighted];
[rightButton setBackgroundImage:[UIImage imageWithName:@"navigationbar_button_send_background_disabled"] forState:UIControlStateDisabled];
self.navigationItem.rightBarButtonItem = [[UIBarButtonItem alloc] initWithCustomView:rightButton];
}
else
{
self.navigationItem.rightBarButtonItem = [[UIBarButtonItem alloc] initWithTitle:@"发送" style:UIBarButtonItemStyleBordered target:self action:@selector(send)];
self.navigationItem.rightBarButtonItem.tintColor = [UIColor orangeColor];
}
}
/*
* 取消
*/
-(void) cancel
{
[self dismissViewControllerAnimated:YES completion:nil];
}
/*
* 发送
*/
-(void) send
{
//暂时不写，因为还没有链接新浪微博的数据
}
运行一下，看运行结果：
点击加号按钮后：
可以看到点击之后能够正常运行，等OAuth授权之后拿到数据，然后就可以写发送的方法了。
扫一扫
534
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
