编程

当前位置:澳门新莆京娱乐官网 > 编程 > 一款更Q的通知图标组件

一款更Q的通知图标组件

来源:http://www.drgigabytes.com 作者:澳门新莆京娱乐官网 时间:2020-04-28 23:10

“一闪一闪亮晶晶,满天都以小点儿”,作为一枚ios开拓程序猿,最大的兴奋莫过于看着模拟器完毕了和煦想要的功用。废话非常少说,踏入明日的主题,明日给大家带给了三个支付中常用的打招呼Logo组件,相信您会赏识的。先看下效果图

澳门新莆京娱乐官网 1badge.gif

当看见Blink Animation的时候知道为啥开篇一闪一闪耀晶晶了吗!是或不是很Q?

干什么说那是个零件呢?先来看下结构然后在座谈怎么采用啊首先有个照望Logo基类,全部的自定义公告Logo类型都三番五次自它,现在只要之后想扩充别的样式也很有益于啊

@interface HHBadge : NSObject { __weak UIView *_sourceView; __weak UIBarButtonItem *_sourceItem;}#pragma mark - setup/// 快速创建实例+ (instancetype)badge;- show;- hide;/// 源视图@property (nonatomic, weak, readonly)UIView *sourceView;/// 源item@property (nonatomic, weak, readonly)UIBarButtonItem *sourceItem;@end

基类中的sourceView和sourceItem属性以往便是大家要增进布告Logo的控件

自己最主要实现支付中常用的三种通告Logo准样板式,点样式和数字样式先看下点样式

@interface HHDotBadge : HHBadge#pragma mark adjustment/// 配置外观样式- applyStyle:(HHDotBadgeStyle *style))maker;/// 设置位置- moveByX:x Y:y;- scaleBy:scale;#pragma mark animation- doAnimationWithType:(HHBadgeAnimationType)type;@end

- applyStyle:(HHDotBadgeStyle *style))maker;经过block中的style参数布局外观样式- moveByX:x Y:y;调节布告Logo的职位- scaleBy:scale;调动布告Logo的抑扬顿挫,当然也足以因此style.badgeDiameter调解- doAnimationWithType:(HHBadgeAnimationType)type;卡通帮衬

可定制的属性模型HHDotBadgeStyle定义如下

@interface HHDotBadgeStyle : NSObject/// 直径 defalut 15@property (nonatomic, assign)CGFloat badgeDiameter;/// 圆圈的背景颜色@property (nonatomic, strong)UIColor *bgColor;/// 边框颜色@property (nonatomic, strong)UIColor *borderColor;/// 边框宽度@property (nonatomic, assign)CGFloat borderWidth;/// 是否支持QQ的粘性拖拽效果 default NO 此功能暂时未实现 后继版本加入//@property (nonatomic, assign, getter=haveGooEffect)BOOL gooEffect;@end

那边就如QQ这种的粘性拖拽效果权且还没有能协助。

支撑的动漫类型

/// 动画类型typedef NS_ENUM(NSUInteger, HHBadgeAnimationType) { HHBadgeAnimationPop = 0,///< 缩放动画 HHBadgeAnimationBlink,///< 眨眼动画 HHBadgeAnimationBump,///< 上下跳动动画 HHBadgeAnimationNone///< 无};

那几个通过注释应该超轻便就能够看通晓了,就只是多解释了

再看下数字文告图标准样本式

@interface HHCountBadge : HHDotBadge#pragma mark setup/// 快速创建实例+ (instancetype)badgeWithCount:(NSInteger)count;- (instancetype)initWithCount:(NSInteger)count NS_DESIGNATED_INITIALIZER;#pragma mark adjustment/// 配置外观样式- applyStyle:(HHCountBadgeStyle *style))maker;#pragma mark changeCount- increaseWithAnimationType:(HHBadgeAnimationType)type;- increaseBy:(NSInteger)count animationWithType:(HHBadgeAnimationType)type;- decreaseWithAnimationType:(HHBadgeAnimationType)type;- decreaseBy:(NSInteger)count animationWithType:(HHBadgeAnimationType)type;/// 数量@property (nonatomic, assign)NSInteger count;@end

- increaseWithAnimationType:(HHBadgeAnimationType)type;暗许会追加1,当然你也得以因而艺术- increaseBy:(NSInteger)count animationWithType:(HHBadgeAnimationType)type;温馨安装增扩充少,同一时候可设置动漫类型,降低多少同理

澳门新莆京娱乐官网,可定制的习性模型HHCountBadgeStyle

@interface HHCountBadgeStyle : HHDotBadgeStyle/// 是否自适应大小 default YES@property (nonatomic, assign)BOOL automaticExpansion;/// 是否强制显示0 default NO@property (nonatomic, assign, getter=shouldForcedShowZero)BOOL forceShowZero;/// 数字的颜色@property (nonatomic, strong)UIColor *countColor;/// 数字的字体@property (nonatomic, strong)UIFont *countFont;/// 数字的对齐方式@property (nonatomic, assign)NSTextAlignment countAlignment;@end

最后是UIView和UIBarButtonItem分类

@interface UIView (HHBadgeHUD)@property (nonatomic, strong) __kindof HHBadge *hh_badge;@end@interface UIBarButtonItem (HHBadgeHUD)/// 设置此值的时候确保Item的View属性已被加载@property (nonatomic, strong) __kindof HHBadge *hh_badge;@end

见状此间相信读者应当清楚怎么使用该控件了吧!假如不知底的能够看本文尾部的接连几天demo,就不贴代码了

此处说下/// 设置此值的时候确保Item的View属性已被加载那句注释

澳门新莆京娱乐官网 2Paste_Image.png

那是demo中的例子咱们来看下add属性在viewDidLoad中是如何的

澳门新莆京娱乐官网 3Paste_Image.png

能够看见view属性为空,所以一旦把self.add.hh_badge = [HHCountBadge badgeWithCount:9];位居viewDidLoad中是不会有作用的在viewDidAppear:方法里add属性是如此的

澳门新莆京娱乐官网 4Paste_Image.png

可以看看那儿view属性是有值的,且是UIButton的子类UINavigationButton,读者也能够透过如此的艺术去学学体系到底是怎么贯彻部分特定类的,以致包装思路,我也想过通过kvo监听item的view属性,当起首化达成的时候拉长大家的自定义通告Logo,那样使用者就足以在随机地点赋值了,不过思谋达到成起来仍有一点点复杂的,况且影响该零件的轻量级特性,就舍弃了,读者风野趣能够自动尝试,还会有少数要表明下,当调控器为navigationController的根调节器时在viewDidLoad中item的view是有值的。

以此自定义布告Logo组件就到此处,希望能在开拓中扶植到你,有何难点或建议接待留言。

gitHub传送门

本文由澳门新莆京娱乐官网发布于编程,转载请注明出处:一款更Q的通知图标组件

关键词: