仿新浪微博学习笔记05

上次做了提醒数字，然后进行封装，可以随程序进行调用，看一下上次运行的结果：

接下来继续完善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授权之后拿到数据，然后就可以写发送的方法了。