IOS博客项目搭建-06-设置底部导航TabBarButton的提醒数字

摘要: 如微信底部未读消息数提醒，有状态更新时的提醒，因为是自定义的TabBar，所以不能使用原生的badgeValue，在这里自定义提醒数字的位置，红色圆圈的大小及形状，当数字为多位数时，为椭圆形。

一、提醒数字设置



// KVO 监听属性改变,KVO就像消息，有添加就会有删除

[item addObserver:self forKeyPath:@"badgeValue" options:0 context:nil];

监听提醒数字的变化的事件，然后需要对事件进行释放，否则会导致程序崩掉或产生野指针。

-(void)dealloc

{

[self.item removeObserver:self forKeyPath:@"badgeValue"];

}

二、将提醒数字按钮封装成一个单独的文件，IWBadgeButton.m，以方便后边调用。

//
//  IWBadgeButton.m
//  ItcastWeibo
//
//  Created by apple on 14-5-5.
//  Copyright (c) 2014年 itcast. All rights reserved.
//

#import "IWBadgeButton.h"

@implementation IWBadgeButton

- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
self.hidden = YES;
self.userInteractionEnabled = NO;
[self setBackgroundImage:[UIImage resizedImageWithName:@"main_badge"] forState:UIControlStateNormal];
self.titleLabel.font = [UIFont systemFontOfSize:11];
}
return self;
}

- (void)setBadgeValue:(NSString *)badgeValue
{
#warning copy
//    _badgeValue = badgeValue;
_badgeValue = [badgeValue copy];

if (badgeValue) {
self.hidden = NO;
// 设置文字
[self setTitle:badgeValue forState:UIControlStateNormal];

// 设置frame
CGRect frame = self.frame;
CGFloat badgeH = self.currentBackgroundImage.size.height;
CGFloat badgeW = self.currentBackgroundImage.size.width;
if (badgeValue.length > 1) {
// 文字的尺寸
CGSize badgeSize = [badgeValue sizeWithFont:self.titleLabel.font];
badgeW = badgeSize.width + 10;
}
frame.size.width = badgeW;
frame.size.height = badgeH;
self.frame = frame;
} else {
self.hidden = YES;
}
}

@end

在IWTabBarButton.m中调用提醒数字相关方法：

//
//  IWTabBarButton.m
//  ItcastWeibo
//
//  Created by apple on 14-5-5.
//  Copyright (c) 2014年 itcast. All rights reserved.
//

// 图标的比例
#define IWTabBarButtonImageRatio 0.6

// 按钮的默认文字颜色
#define  IWTabBarButtonTitleColor (iOS7 ? [UIColor blackColor] : [UIColor whiteColor])
// 按钮的选中文字颜色
#define  IWTabBarButtonTitleSelectedColor (iOS7 ? IWColor(234, 103, 7) : IWColor(248, 139, 0))

#import "IWTabBarButton.h"
#import "IWBadgeButton.h"

@interface IWTabBarButton()
/**
*  提醒数字
*/
@property (nonatomic, weak) IWBadgeButton *badgeButton;
@end

@implementation IWTabBarButton

- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
// 图标居中
self.imageView.contentMode = UIViewContentModeCenter;
// 文字居中
self.titleLabel.textAlignment = NSTextAlignmentCenter;
// 字体大小
self.titleLabel.font = [UIFont systemFontOfSize:11];
// 文字颜色
[self setTitleColor:IWTabBarButtonTitleColor forState:UIControlStateNormal];
[self setTitleColor:IWTabBarButtonTitleSelectedColor forState:UIControlStateSelected];

if (!iOS7) { // 非iOS7下,设置按钮选中时的背景
[self setBackgroundImage:[UIImage imageWithName:@"tabbar_slider"] forState:UIControlStateSelected];
}

// 添加一个提醒数字按钮
IWBadgeButton *badgeButton = [[IWBadgeButton alloc] init];
badgeButton.autoresizingMask = UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleBottomMargin;
[self addSubview:badgeButton];
self.badgeButton = badgeButton;
}
return self;
}

// 重写去掉高亮状态
- (void)setHighlighted:(BOOL)highlighted {}

// 内部图片的frame
- (CGRect)imageRectForContentRect:(CGRect)contentRect
{
CGFloat imageW = contentRect.size.width;
CGFloat imageH = contentRect.size.height * IWTabBarButtonImageRatio;
return CGRectMake(0, 0, imageW, imageH);
}

// 内部文字的frame
- (CGRect)titleRectForContentRect:(CGRect)contentRect
{
CGFloat titleY = contentRect.size.height * IWTabBarButtonImageRatio;
CGFloat titleW = contentRect.size.width;
CGFloat titleH = contentRect.size.height - titleY;
return CGRectMake(0, titleY, titleW, titleH);
}

// 设置item
- (void)setItem:(UITabBarItem *)item
{
_item = item;

// KVO 监听属性改变
[item addObserver:self forKeyPath:@"badgeValue" options:0 context:nil];
[item addObserver:self forKeyPath:@"title" options:0 context:nil];
[item addObserver:self forKeyPath:@"image" options:0 context:nil];
[item addObserver:self forKeyPath:@"selectedImage" options:0 context:nil];

[self observeValueForKeyPath:nil ofObject:nil change:nil context:nil];
}

- (void)dealloc
{
[self.item removeObserver:self forKeyPath:@"badgeValue"];
[self.item removeObserver:self forKeyPath:@"title"];
[self.item removeObserver:self forKeyPath:@"image"];
[self.item removeObserver:self forKeyPath:@"selectedImage"];
}

/**
*  监听到某个对象的属性改变了,就会调用
*
*  @param keyPath 属性名
*  @param object  哪个对象的属性被改变
*  @param change  属性发生的改变
*/
- (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary *)change context:(void *)context
{
// 设置文字
[self setTitle:self.item.title forState:UIControlStateSelected];
[self setTitle:self.item.title forState:UIControlStateNormal];

// 设置图片
[self setImage:self.item.image forState:UIControlStateNormal];
[self setImage:self.item.selectedImage forState:UIControlStateSelected];

// 设置提醒数字
self.badgeButton.badgeValue = self.item.badgeValue;

// 设置提醒数字的位置
CGFloat badgeY = 5;
CGFloat badgeX = self.frame.size.width - self.badgeButton.frame.size.width - 10;
CGRect badgeF = self.badgeButton.frame;
badgeF.origin.x = badgeX;
badgeF.origin.y = badgeY;
self.badgeButton.frame = badgeF;
}
@end