自定义toolbar

最新推荐文章于 2018-09-28 17:24:14 发布

原创最新推荐文章于 2018-09-28 17:24:14 发布 · 1.1k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#toolbar

iOS 之旅专栏收录该内容

171 篇文章

订阅专栏

本文介绍了一种类似于新浪微博的自定义TabBar实现方法，通过Objective-C编程语言详细展示了如何创建带有转发、点赞、评论功能的TabBar组件，并提供了具体代码实例。

自定义tabbar类似新浪微博一样，转发/点赞/评论

#import <UIKit/UIKit.h>
typedef enum {
    HMComposeToolbarleft, // 转发
    HMComposeToolbarButtonTypemodel, // 点赞
    HMComposeToolbarButtonTyperight // 评论
} HMComposeToolbarButtonType;

@class HMStatusToolbar;
@protocol HMStatusToolbarDelegate <NSObject>

@optional
- (void)composeTool:(HMStatusToolbar *)toolbar didClickedButton:(HMComposeToolbarButtonType)buttonType;

@end
@interface HMStatusToolbar : UIImageView
@property (nonatomic, weak) id<HMStatusToolbarDelegate> delegate;
@end

#import "HMStatusToolbar.h"
#import "UIImage+Extension.h"
#import "UIView+Extension.h"

@interface HMStatusToolbar()
@property (nonatomic, strong) NSMutableArray *btns;
@property (nonatomic, strong) NSMutableArray *dividers;
@end

@implementation HMStatusToolbar
- (NSMutableArray *)btns
{
    if (_btns == nil) {
        self.btns = [NSMutableArray array];
    }
    return _btns;
}

- (NSMutableArray *)dividers
{
    if (_dividers == nil) {
        self.dividers = [NSMutableArray array];
    }
    return _dividers;
}

- (id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        self.userInteractionEnabled = YES;
        self.image = [UIImage resizedImage:@"timeline_card_bottom_background"];

        [self setupBtnWithIcon:@"timeline_icon_retweet" title:@"转发" tag:HMComposeToolbarleft];
        [self setupBtnWithIcon:@"timeline_icon_comment" title:@"评论" tag:HMComposeToolbarButtonTypemodel];
        [self setupBtnWithIcon:@"timeline_icon_unlike" title:@"赞" tag:HMComposeToolbarButtonTyperight];

        [self setupDivider];
        [self setupDivider];
    }
    return self;
}

/**
 *  分割线
 */
- (void)setupDivider
{
    UIImageView *divider = [[UIImageView alloc] init];
    divider.image = [UIImage imageWithName:@"timeline_card_bottom_line"];
    divider.contentMode = UIViewContentModeCenter;
    [self addSubview:divider];
    [self.dividers addObject:divider];
}

/**
 *  添加按钮
 *
 *  @param icon  图标
 *  @param title 标题
 */
- (void)setupBtnWithIcon:(NSString *)icon title:(NSString *)title tag:(HMComposeToolbarButtonType)tag
{
    UIButton *btn = [[UIButton alloc] init];
    btn.tag = tag;
    [btn setImage:[UIImage imageWithName:icon] forState:UIControlStateNormal];
    [btn setTitle:title forState:UIControlStateNormal];
    [btn setTitleColor:[UIColor grayColor] forState:UIControlStateNormal];
    btn.titleLabel.font = [UIFont systemFontOfSize:13];

    // 设置高亮时的背景
    [btn setBackgroundImage:[UIImage resizedImage:@"common_card_bottom_background_highlighted"] forState:UIControlStateHighlighted];
    btn.adjustsImageWhenHighlighted = NO;
    [btn addTarget:self action:@selector(buttonClick:) forControlEvents:UIControlEventTouchUpInside];

    // 设置间距
    btn.titleEdgeInsets = UIEdgeInsetsMake(0, 10, 0, 0);

    [self addSubview:btn];

    [self.btns addObject:btn];
}


/**
 *  监听按钮点击
 */
- (void)buttonClick:(UIButton *)button
{
    if ([self.delegate respondsToSelector:@selector(composeTool:didClickedButton:)]) {
        [self.delegate composeTool:self didClickedButton:button.tag];
    }
}

- (void)layoutSubviews
{
    [super layoutSubviews];

    // 设置按钮的frame
    int btnCount = self.btns.count;
    CGFloat btnW = self.width / btnCount;
    CGFloat btnH = self.height;
    for (int i = 0; i<btnCount; i++) {
        UIButton *btn = self.btns[i];
        btn.width = btnW;
        btn.height = btnH;
        btn.y = 0;
        btn.x = i * btnW;
    }

    // 设置分割线的frame
    int dividerCount = self.dividers.count;
    for (int i = 0; i<dividerCount; i++) {
        UIImageView *divider = self.dividers[i];
        divider.width = 4;
        divider.height = btnH;
        divider.centerX = (i + 1) * btnW;
        divider.centerY = btnH * 0.5;
    }
}

自定义tabbar完成，字需要从控制器中调用就可以了

HMStatusToolbar *toolbar = [[HMStatusToolbar alloc]init];
    toolbar.frame =CGRectMake(0, 300, self.view.bounds.size.width, 40);
    toolbar.delegate = self;
    [self.view addSubview:toolbar];

实现代理方法

- (void)composeTool:(HMStatusToolbar *)toolbar didClickedButton:(HMComposeToolbarButtonType)buttonType；