iOS之基本控件和tabBar右上角角标显示与隐藏

最近APP大幅度改版更新页面，角标显示的地方比较多，原有的角标显示逻辑混乱，所以参考了以为大神的处理办法对角标进行了如下整理：

右上角角标使用说明

1.首先引入#import"UIView+redPoint.h"

2.使用类型

A.某种控件使用，比如UIImageView、UILabel等等

若此时UIImageView的对象名为txsqImgView，则：

<1>.若角标显示为红点，只需使用下面此行代码

[txsqImgViewshowRedAtOffSetX:0AndOffSetY:0OrValue:nil];

<2>.若角标显示为数字，只需使用下面此行代码

[txsqImgViewshowRedAtOffSetX:0AndOffSetY:0OrValue:nil];

[txsqImgViewshowRedAtOffSetX:0AndOffSetY:0OrValue:@"2"];

<3>.隐藏角标

[txsqImgViewhideRedPoint];

效果如下：



B.若是底部导航栏使用，即UITabBarController

若此时UITabBarController的对象名为self.tabBarController.tabBar，则：

<1>.若角标显示为红点，只需使用下面此行代码

[self.tabBarController.tabBarshowBadgeOnItemIndex:1];

<2>.隐藏角标

[self.tabBarController.tabBarhideBadgeOnItemIndex:1];

<3>.若角标显示数字，则使用系统的badgeValue赋值即可

效果如下：



代码如下：

1.UIView+redPoint.h

#import

@interface UIView (redPoint)

- (void)showRedAtOffSetX:(float)offsetX AndOffSetY:(float)offsetY OrValue:(NSString *)value;
- (void)hideRedPoint;

//tabbar方法
- (void)showBadgeOnItemIndex:(int)index; //显示小红点
- (void)hideBadgeOnItemIndex:(int)index; //隐藏小红点

@end

2.UIView+redPoint.m

#import
#import "UIView+redPoint.h"

#define USERDEF [NSUserDefaults standardUserDefaults]

@implementation UIView (redPoint)

#pragma other(redPoint)
//添加显示
- (void)showRedAtOffSetX:(float)offsetX AndOffSetY:(float)offsetY OrValue:(NSString *)value{
[self removeRedPoint];//添加之前先移除，避免重复添加
//新建小红点
UIView *badgeView = [[UIView alloc]init];
badgeView.tag = 998;

CGFloat viewWidth = 12;
if (value) {
viewWidth = 18;
UILabel *valueLbl = [[UILabel alloc]initWithFrame:CGRectMake(0, 0, viewWidth, viewWidth)];
valueLbl.text = value;
valueLbl.font = [UIFont systemFontOfSize:12];
valueLbl.textColor = [UIColor whiteColor];
valueLbl.textAlignment = NSTextAlignmentCenter;
valueLbl.clipsToBounds = YES;
[badgeView addSubview:valueLbl];
}

badgeView.layer.cornerRadius = viewWidth / 2;
badgeView.backgroundColor = [UIColor redColor];
CGRect tabFrame = self.frame;

//确定小红点的位置
if (offsetX == 0) {
//        offsetX = 1;
offsetX = -viewWidth/2.0;
}

if (offsetY == 0) {
//        offsetY = 0.05;
offsetY = -viewWidth/2.0;
}
CGFloat x = ceilf(tabFrame.size.width + offsetX);
CGFloat y = 0;
if (offsetY == -viewWidth/2.0) {
y = ceilf(offsetY);
}else{
y = ceilf(offsetY * tabFrame.size.height);
}

badgeView.frame = CGRectMake(x, y, viewWidth, viewWidth);
[self addSubview:badgeView];
}

//隐藏
- (void)hideRedPoint{
[self removeRedPoint];
}

//移除
- (void)removeRedPoint{
//按照tag值进行移除
for (UIView *subView in self.subviews) {
if (subView.tag == 998) {
[subView removeFromSuperview];
}
}
}

#pragma mark Tabbar(redPoint)
//显示小红点
- (void)showBadgeOnItemIndex:(int)index{
NSString *keyStr = [NSString stringWithFormat:@"%d_HADSET",index];
if ([USERDEF objectForKey:keyStr]) {
return;
} else {
[USERDEF setObject:@"HADSET" forKey:keyStr];
}
//移除之前可能存在的小红点
[self removeBadgeOnItemIndex:index];

//新建小红点
UIView *badgeView = [[UIView alloc]init];
badgeView.tag = 888 + index;
badgeView.layer.cornerRadius = 6;
badgeView.backgroundColor = [UIColor redColor];
CGRect tabFrame = self.frame;

//确定小红点的位置
float percentX = (index +0.55) / 5; //5为tabbaritem的总个数
CGFloat x = ceilf(percentX * tabFrame.size.width);
CGFloat y = ceilf(0.05 * tabFrame.size.height);
badgeView.frame = CGRectMake(x, y, 12, 12);

[self addSubview:badgeView];
}

//隐藏小红点
- (void)hideBadgeOnItemIndex:(int)index{
NSString *keyStr = [NSString stringWithFormat:@"%d_HADSET",index];
//移除小红点
[self removeBadgeOnItemIndex:index];
if ([USERDEF objectForKey:keyStr]) {
[USERDEF removeObjectForKey:keyStr];
}
}

//移除
- (void)removeBadgeOnItemIndex:(int)index{
//按照tag值进行移除
for (UIView *subView in self.subviews) {
if (subView.tag == 888+index) {
[subView removeFromSuperview];
}
}
}

@end