不废话,直接上代码!
- //新标识视图
- self.badgeView = [[JSBadgeView alloc]initWithParentView:parentView alignment:JSBadgeViewAlignmentTopRight]; //在父控件(parentView)上显示,显示的位置TopRight
- //self.badgeView.badgePositionAdjustment = CGPointMake(-15, 10); //如果显示的位置不对,可以自己调整,超爽啊!
- self.badgeView.tag = IN_AREA_NEW_TASKS_TAG; //如果多个的badge,可以设置tag要辨别
- /****如果系统是7.0以上,图标扁平化,可以设置颜色****/
- if (SYSTEM_VERSION_GREATER_THAN_OR_EQUAL_TO(@"7.0"))
- {
- self.badgeView.badgeBackgroundColor = [UIColor redColor];
- self.badgeView.badgeOverlayColor = [UIColor clearColor];//没有反光面
- self.badgeView.badgeStrokeColor = [UIColor redColor];//外圈的颜色,默认是白色
- }
- else //如果iOS版本小于7.0,用类似系统的图标
- {
- self.badgeView1.badgeBackgroundColor = [UIColor redColor];
- }
- /*****设置数字****/
- self.badgeView.badgeText = @"1";//如果不显示就</span>设置为空
- self.badgeView.badgeText = nil; //清空数字
- [self.badgeView setNeedsLayout];//当更新数字时,最好刷新,不然由于frame固定的,导致图片变形
原JSBadgeView(修改过,适配iOS7、8的扁平化)的代码
- /*
- Copyright 2012 Javier Soto (ios@javisoto.es)
- Licensed under the Apache License, Version 2.0 (the "License");
- you may not use this file except in compliance with the License.
- You may obtain a copy of the License at
- http://www.apache.org/licenses/LICENSE-2.0
- Unless required by applicable law or agreed to in writing, software
- distributed under the License is distributed on an "AS IS" BASIS,
- WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- See the License for the specific language governing permissions and
- limitations under the License.
- */
- #import <UIKit/UIKit.h>
- typedef enum {
- JSBadgeViewAlignmentTopLeft,
- JSBadgeViewAlignmentTopRight,
- JSBadgeViewAlignmentTopCenter,
- JSBadgeViewAlignmentCenterLeft,
- JSBadgeViewAlignmentCenterRight,
- JSBadgeViewAlignmentBottomLeft,
- JSBadgeViewAlignmentBottomRight,
- JSBadgeViewAlignmentBottomCenter,
- JSBadgeViewAlignmentCenter
- } JSBadgeViewAlignment;
- @interface JSBadgeView : UIView
- @property (nonatomic, copy) NSString *badgeText;
- #pragma mark - Customization
- @property (nonatomic, assign) JSBadgeViewAlignment badgeAlignment;
- @property (nonatomic, strong) UIColor *badgeTextColor;
- @property (nonatomic, assign) CGSize badgeTextShadowOffset;
- @property (nonatomic, strong) UIColor *badgeTextShadowColor;
- @property (nonatomic, strong) UIFont *badgeTextFont;
- @property (nonatomic, strong) UIColor *badgeBackgroundColor;
- @property (nonatomic, strong) UIColor *badgeStrokeColor;
- /**
- * @discussion color of the overlay circle at the top. Default is semi-transparent white.
- */
- @property (nonatomic, strong) UIColor *badgeOverlayColor;
- /**
- * @discussion allows to shift the badge by x and y points.
- */
- @property (nonatomic, assign) CGPoint badgePositionAdjustment;
- /**
- * @discussion (optional) If not provided, the superview frame is used.
- * You can use this to position the view if you're drawing it using drawRect instead of `-addSubview:`
- */
- @property (nonatomic, assign) CGRect frameToPositionInRelationWith;
- /**
- * @discussion optionally init using this method to have the badge automatically added to another view.
- */
- - (id)initWithParentView:(UIView *)parentView alignment:(JSBadgeViewAlignment)alignment;
- @end
- /*
- Copyright 2012 Javier Soto (ios@javisoto.es)
- Licensed under the Apache License, Version 2.0 (the "License");
- you may not use this file except in compliance with the License.
- You may obtain a copy of the License at
- http://www.apache.org/licenses/LICENSE-2.0
- Unless required by applicable law or agreed to in writing, software
- distributed under the License is distributed on an "AS IS" BASIS,
- WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- See the License for the specific language governing permissions and
- limitations under the License.
- */
- #import "JSBadgeView.h"
- #import <QuartzCore/QuartzCore.h>
- #define kDefaultBadgeTextColor [UIColor whiteColor]
- #define kDefaultBadgeBackgroundColor [UIColor redColor]
- #define kDefaultOverlayColor [UIColor colorWithWhite:1.0f alpha:0.3]
- #define kDefaultBadgeTextFont [UIFont boldSystemFontOfSize:[UIFont systemFontSize]]
- #define kDefaultBadgeShadowColor [UIColor clearColor]
- #define kBadgeStrokeColor [UIColor whiteColor]
- #define kBadgeStrokeWidth 2.0f
- #define kMarginToDrawInside (kBadgeStrokeWidth * 2)
- #define kShadowOffset CGSizeMake(0.0f, 3.0f)
- #define kShadowOpacity 0.4f
- #define kShadowColor [UIColor colorWithWhite:0.0f alpha:kShadowOpacity]
- #define kShadowRadius 1.0f
- #define kBadgeHeight 16.0f
- #define kBadgeTextSideMargin 8.0f
- #define kBadgeCornerRadius 10.0f
- #define kDefaultBadgeAlignment JSBadgeViewAlignmentTopRight
- @interface JSBadgeView()
- - (void)_init;
- - (CGSize)sizeOfTextForCurrentSettings;
- @end
- @implementation JSBadgeView
- @synthesize badgeAlignment = _badgeAlignment;
- @synthesize badgePositionAdjustment = _badgePositionAdjustment;
- @synthesize frameToPositionInRelationWith = _frameToPositionInRelationWith;
- @synthesize badgeText = _badgeText;
- @synthesize badgeTextColor = _badgeTextColor;
- @synthesize badgeTextShadowColor = _badgeTextShadowColor;
- @synthesize badgeTextShadowOffset = _badgeTextShadowOffset;
- @synthesize badgeTextFont = _badgeTextFont;
- @synthesize badgeBackgroundColor = _badgeBackgroundColor;
- @synthesize badgeOverlayColor = _badgeOverlayColor;
- @synthesize badgeStrokeColor = _badgeStrokeColor;
- - (void)awakeFromNib
- {
- [super awakeFromNib];
- [self _init];
- }
- - (id)initWithFrame:(CGRect)frame
- {
- if ((self = [super initWithFrame:frame]))
- {
- [self _init];
- }
- return self;
- }
- - (id)initWithParentView:(UIView *)parentView alignment:(JSBadgeViewAlignment)alignment
- {
- if ((self = [self initWithFrame:CGRectZero]))
- {
- self.badgeAlignment = alignment;
- [parentView addSubview:self];
- }
- return self;
- }
- - (void)_init
- {
- self.backgroundColor = [UIColor clearColor];
- self.badgeAlignment = kDefaultBadgeAlignment;
- self.badgeBackgroundColor = kDefaultBadgeBackgroundColor;
- self.badgeOverlayColor = kDefaultOverlayColor;
- self.badgeTextColor = kDefaultBadgeTextColor;
- self.badgeStrokeColor = kBadgeStrokeColor;
- self.badgeTextShadowColor = kDefaultBadgeShadowColor;
- self.badgeTextFont = kDefaultBadgeTextFont;
- }
- #pragma mark - Layout
- - (void)layoutSubviews
- {
- CGRect newFrame = self.frame;
- NSLog(@"badge frame:%@",NSStringFromCGRect(newFrame));
- CGRect superviewFrame = CGRectIsEmpty(_frameToPositionInRelationWith) ? self.superview.frame : _frameToPositionInRelationWith;
- CGFloat textWidth = [self sizeOfTextForCurrentSettings].width;
- CGFloat viewWidth = textWidth + kBadgeTextSideMargin + (kMarginToDrawInside * 2);
- CGFloat viewHeight = kBadgeHeight + (kMarginToDrawInside * 2);
- CGFloat superviewWidth = superviewFrame.size.width;
- CGFloat superviewHeight = superviewFrame.size.height;
- newFrame.size.width = viewWidth;
- newFrame.size.height = viewHeight;
- switch (self.badgeAlignment) {
- case JSBadgeViewAlignmentTopLeft:
- newFrame.origin.x = -viewWidth / 2.0f;
- newFrame.origin.y = -viewHeight / 2.0f;
- break;
- case JSBadgeViewAlignmentTopRight:
- newFrame.origin.x = superviewWidth - (viewWidth / 2.0f);
- newFrame.origin.y = -viewHeight / 2.0f;
- break;
- case JSBadgeViewAlignmentTopCenter:
- newFrame.origin.x = (superviewWidth - viewWidth) / 2.0f;
- newFrame.origin.y = -viewHeight / 2.0f;
- break;
- case JSBadgeViewAlignmentCenterLeft:
- newFrame.origin.x = -viewWidth / 2.0f;
- newFrame.origin.y = (superviewHeight - viewHeight) / 2.0f;
- break;
- case JSBadgeViewAlignmentCenterRight:
- newFrame.origin.x = superviewWidth - (viewWidth / 2.0f);
- newFrame.origin.y = (superviewHeight - viewHeight) / 2.0f;
- break;
- case JSBadgeViewAlignmentBottomLeft:
- newFrame.origin.x = -textWidth / 2.0f;
- newFrame.origin.y = superviewHeight - (viewHeight / 2.0f);
- break;
- case JSBadgeViewAlignmentBottomRight:
- newFrame.origin.x = superviewWidth - (viewWidth / 2.0f);
- newFrame.origin.y = superviewHeight - (viewHeight / 2.0f);
- break;
- case JSBadgeViewAlignmentBottomCenter:
- newFrame.origin.x = (superviewWidth - viewWidth) / 2.0f;
- newFrame.origin.y = superviewHeight - (viewHeight / 2.0f);
- break;
- case JSBadgeViewAlignmentCenter:
- newFrame.origin.x = (superviewWidth - viewWidth) / 2.0f;
- newFrame.origin.y = (superviewHeight - viewHeight) / 2.0f;
- break;
- default:
- NSAssert(NO, @"Unimplemented JSBadgeAligment type %d", self.badgeAlignment);
- }
- newFrame.origin.x += _badgePositionAdjustment.x;
- newFrame.origin.y += _badgePositionAdjustment.y;
- self.frame = CGRectIntegral(newFrame);
- [self setNeedsDisplay];
- }
- #pragma mark - Private
- - (CGSize)sizeOfTextForCurrentSettings
- {
- return [self.badgeText sizeWithFont:self.badgeTextFont];
- }
- #pragma mark - Setters
- - (void)setBadgeAlignment:(JSBadgeViewAlignment)badgeAlignment
- {
- if (badgeAlignment != _badgeAlignment)
- {
- _badgeAlignment = badgeAlignment;
- switch (badgeAlignment)
- {
- case JSBadgeViewAlignmentTopLeft:
- self.autoresizingMask = UIViewAutoresizingFlexibleBottomMargin | UIViewAutoresizingFlexibleRightMargin;
- break;
- case JSBadgeViewAlignmentTopRight:
- self.autoresizingMask = UIViewAutoresizingFlexibleBottomMargin | UIViewAutoresizingFlexibleLeftMargin;
- break;
- case JSBadgeViewAlignmentTopCenter:
- self.autoresizingMask = UIViewAutoresizingFlexibleBottomMargin | UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin;
- break;
- case JSBadgeViewAlignmentCenterLeft:
- self.autoresizingMask = UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleBottomMargin | UIViewAutoresizingFlexibleRightMargin;
- break;
- case JSBadgeViewAlignmentCenterRight:
- self.autoresizingMask = UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleBottomMargin | UIViewAutoresizingFlexibleLeftMargin;
- break;
- case JSBadgeViewAlignmentBottomLeft:
- self.autoresizingMask = UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleRightMargin;
- break;
- case JSBadgeViewAlignmentBottomRight:
- self.autoresizingMask = UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleLeftMargin;
- break;
- case JSBadgeViewAlignmentBottomCenter:
- self.autoresizingMask = UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin;
- break;
- case JSBadgeViewAlignmentCenter:
- self.autoresizingMask = UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleBottomMargin;
- break;
- default:
- NSAssert(NO, @"Unimplemented JSBadgeAligment type %d", self.badgeAlignment);
- }
- [self setNeedsLayout];
- }
- }
- - (void)setBadgePositionAdjustment:(CGPoint)badgePositionAdjustment
- {
- _badgePositionAdjustment = badgePositionAdjustment;
- [self setNeedsLayout];
- }
- - (void)setBadgeText:(NSString *)badgeText
- {
- if (badgeText != _badgeText)
- {
- _badgeText = [badgeText copy];
- [self setNeedsDisplay];
- }
- }
- - (void)setBadgeTextColor:(UIColor *)badgeTextColor
- {
- if (badgeTextColor != _badgeTextColor)
- {
- _badgeTextColor = badgeTextColor;
- [self setNeedsDisplay];
- }
- }
- - (void)setBadgeTextShadowColor:(UIColor *)badgeTextShadowColor
- {
- if (badgeTextShadowColor != _badgeTextShadowColor)
- {
- _badgeTextShadowColor = badgeTextShadowColor;
- [self setNeedsDisplay];
- }
- }
- - (void)setBadgeTextShadowOffset:(CGSize)badgeTextShadowOffset
- {
- _badgeTextShadowOffset = badgeTextShadowOffset;
- [self setNeedsDisplay];
- }
- - (void)setBadgeTextFont:(UIFont *)badgeTextFont
- {
- if (badgeTextFont != _badgeTextFont)
- {
- _badgeTextFont = badgeTextFont;
- [self setNeedsDisplay];
- }
- }
- - (void)setBadgeBackgroundColor:(UIColor *)badgeBackgroundColor
- {
- if (badgeBackgroundColor != _badgeBackgroundColor)
- {
- _badgeBackgroundColor = badgeBackgroundColor;
- [self setNeedsDisplay];
- }
- }
- -(void)setBadgeStrokeColor:(UIColor *)badgeStrokeColor
- {
- if (badgeStrokeColor != _badgeStrokeColor)
- {
- _badgeStrokeColor = badgeStrokeColor;
- [self setNeedsDisplay];
- }
- }
- #pragma mark - Drawing
- - (void)drawRect:(CGRect)rect
- {
- BOOL anyTextToDraw = (self.badgeText.length > 0);
- if (anyTextToDraw)
- {
- CGContextRef ctx = UIGraphicsGetCurrentContext();
- CGRect rectToDraw = CGRectInset(rect, kMarginToDrawInside, kMarginToDrawInside);
- UIBezierPath *borderPath = [UIBezierPath bezierPathWithRoundedRect:rectToDraw byRoundingCorners:(UIRectCorner)UIRectCornerAllCorners cornerRadii:CGSizeMake(kBadgeCornerRadius, kBadgeCornerRadius)];
- /* Background and shadow */
- CGContextSaveGState(ctx);
- {
- CGContextAddPath(ctx, borderPath.CGPath);
- CGContextSetFillColorWithColor(ctx, self.badgeBackgroundColor.CGColor);
- CGContextSetShadowWithColor(ctx, kShadowOffset, kShadowRadius, kShadowColor.CGColor);
- CGContextDrawPath(ctx, kCGPathFill);
- }
- CGContextRestoreGState(ctx);
- BOOL colorForOverlayPresent = self.badgeOverlayColor && ![self.badgeOverlayColor isEqual:[UIColor clearColor]];
- if (colorForOverlayPresent)
- {
- /* Gradient overlay */
- CGContextSaveGState(ctx);
- {
- CGContextAddPath(ctx, borderPath.CGPath);
- CGContextClip(ctx);
- CGFloat height = rectToDraw.size.height;
- CGFloat width = rectToDraw.size.width;
- CGRect rectForOverlayCircle = CGRectMake(rectToDraw.origin.x,
- rectToDraw.origin.y - ceilf(height * 0.5),
- width,
- height);
- CGContextAddEllipseInRect(ctx, rectForOverlayCircle);
- CGContextSetFillColorWithColor(ctx, self.badgeOverlayColor.CGColor);
- CGContextDrawPath(ctx, kCGPathFill);
- }
- CGContextRestoreGState(ctx);
- }
- /* Stroke */
- CGContextSaveGState(ctx);
- {
- CGContextAddPath(ctx, borderPath.CGPath);
- CGContextSetLineWidth(ctx, kBadgeStrokeWidth);
- CGContextSetStrokeColorWithColor(ctx, self.badgeStrokeColor.CGColor);
- CGContextDrawPath(ctx, kCGPathStroke);
- }
- CGContextRestoreGState(ctx);
- /* Text */
- CGContextSaveGState(ctx);
- {
- CGContextSetFillColorWithColor(ctx, self.badgeTextColor.CGColor);
- CGContextSetShadowWithColor(ctx, self.badgeTextShadowOffset, 1.0, self.badgeTextShadowColor.CGColor);
- CGRect textFrame = rectToDraw;
- CGSize textSize = [self sizeOfTextForCurrentSettings];
- textFrame.size.height = textSize.height;
- textFrame.origin.y = rectToDraw.origin.y + ceilf((rectToDraw.size.height - textFrame.size.height) / 2.0f);
- [self.badgeText drawInRect:textFrame
- withFont:self.badgeTextFont
- lineBreakMode:NSLineBreakByCharWrapping
- alignment:NSTextAlignmentCenter];
- }
- CGContextRestoreGState(ctx);
- }
- }
- @end