更新日志

  • V1.2 2015.09.25 1.UITabBarItem badge is supproted; 2.Enable change badge properties when badge is showing; 3.Other code optimization.
  • V1.1 2015.08.12
  1. UIBarButtonItem badge is supported. UIBarButtonItem is kind of NSObject and its displayed view is invisiable. This version makes usage of UIBarButtonItem badge as to UIView.
  2. Slight adjustment for code structure to fit future extension.
  3. Other code optimization.
  • V1.0 at 2015.06.16

  Base functions are completed, which is able to meet most of requirements.


概述

今天我们来实现一个在iOS中让人又爱又恨的推送“小红点”WZLBadge。那什么是badge呢?当后台有数据更新需要让用户知道时,在按钮或者其他控件上显示一个“小红点”提醒用户。注意,这里的“小红点”仅仅是泛指,实际的视图可以天马行空,在这个版本中我们先实现以下几种:

  • 小红点
  • 红底白字“new”
  • 红底白字数字

为了让小红点显示后更加醒目,在这个版本中我又实现了三种不同的状态动画(status animation):

  • 心脏跳动效果(WBadgeAnimTypeScale)
  • 呼吸灯效果(WBadgeAnimTypeBreathe)
  • 横向抖动(WBadgeAnimTypeShake)
  • 静止状态(WBadgeAnimTypeNone, 默认)

WZLBadge还有以下优点:

  • 支持横竖屏
  • 支持iOS5~iOS8
  • 允许高度定制化,包括“红点”的背景颜色,文字(字体大小、颜色),位置等

我们还是先看两张示例图片吧:


分析

想要使得实现出来的badge接口调用方便,我采用的是对UIView做category的方式,接口统一为实例方法。通过这种方式,可以给任意的UIView及其子类添加badge,而且接口简单。接口应该类似于这样:

1
[someView showBadgeWithStyle:WBadgeStyleRedDot value:0 animationType:WBadgeAnimTypeShake];

现实往往是这样的,使用者使用起来越简单,接口提供方就需要做的越多。我们知道,小红点应该具有多个属性,比如大小、背景颜色、文字颜色等。想让badge具有更强的可定制性,就需要开放这些丰富的属性。那么问题来了,category中理论上只能添加方法,无法添加属性。这时候就需要一些运行时runtime方面的技巧了。我们可以在运行时为UIView添加属性,需要使用到的两个runtime api为:

1
2
OBJC_EXPORT id objc_getAssociatedObject(id objectconst void *key)
    __OSX_AVAILABLE_STARTING(__MAC_10_6, __IPHONE_3_1);
1
2
OBJC_EXPORT void objc_setAssociatedObject(id objectconst void *key, id value, objc_AssociationPolicy policy)
    __OSX_AVAILABLE_STARTING(__MAC_10_6, __IPHONE_3_1);

例如,假设我们现在想给UIView动态添加badgeBgColor属性,用来操纵badge角标的背景色“

1
2
3
4
- (UIColor *)badgeBgColor//getter
{
    return objc_getAssociatedObject(self, &badgeBgColorKey);
}
1
2
3
4
- (void)setBadgeBgColor:(UIColor *)badgeBgColor//setter
{
    objc_setAssociatedObject(self, &badgeBgColorKey, badgeBgColor, OBJC_ASSOCIATION_RETAIN);
}

关于动态添加属性的知识在这里就不具体展开了,想要了解更多的可以参考我的这篇《iOS运行时runtime初探(强制获取并修改私有变量,强制增加及修改私有方法等)》。这个知识点也是本文开源的WZLBadge的核心点,实际上这也是大多数开源工具的常规做法。另外,对于WZLBadge的其他技术细节在这里就不再细述,具体可以到文章末尾处转去Github查看。


使用方法

由于WZLBadge采用对UIView扩展category的方式,因此,所有的UIView及其继承子类(UIControl等)都可以无缝使用,当前版本开放的接口主要有以下几个:

1
2
3
4
/**
 *  show badge with red dot style and WBadgeAnimTypeNone by default.
 */
- (void)showBadge;
1
2
3
4
5
6
7
8
/**
 *  showBadge
 *
 *  @param style WBadgeStyle type
 *  @param value (if 'style' is WBadgeStyleRedDot or WBadgeStyleNew, this value will be ignored. In this case, any value will be ok.)
*   @param aniType
 */
- (void)showBadgeWithStyle:(WBadgeStyle)style value:(NSInteger)value animationType:(WBadgeAnimType)aniType;
1
2
3
4
/**
 *  clear badge
 */
- (void)clearBadge;

源代码分享

我将源代码托管在github上,我个人希望WZLBadge能不断优化成为iOS平台上推送红点的终极解决方案,如果你感兴趣,我非常欢迎你一起加入让WZLBadge变得更好。有什么问题或者建议请留言或者在github提issue。

此外,希望你能在github上Fellow我,并且对WZLBadge进行star/fork/watch,接下来我的更新会直接通知到你^^。

github地址:WZLBadge (https://github.com/weng1250/WZLBadge)

开源 一行代码实现多形式多动画的推送小红点WZLBadge(iOS)-备用的更多相关文章

  1. 【原】Github系列之二:开源 一行代码实现多形式多动画的推送小红点WZLBadge(iOS)

    更新日志 V1.2 2015.09.25 1.UITabBarItem badge is supproted; 2.Enable change badge properties when badge ...

  2. 一行代码实现自定义转场动画--iOS自定义转场动画集

    WXSTransition 这款非常不错,力推 这是作者源码简书地址: http://www.jianshu.com/p/fd3154946919 这是作者源码github地址 https://git ...

  3. EasyRTMP直播推送效率优化之开源librtmp CPU占用高效率优化

    本文转自EasyDarwin开源团队Kim的博客:http://blog.csdn.net/jinlong0603/article/details/52950948 EasyRTMP 前面介绍过Eas ...

  4. iOS 基于APNS消息推送原理与实现(包括JAVA后台代码)

    Push的原理: Push 的工作机制可以简单的概括为下图   图中,Provider是指某个iPhone软件的Push服务器,这篇文章我将使用.net作为Provider. APNS 是Apple ...

  5. 前端通信:SSE设计方案(二)--- 服务器推送技术的实践以及一些应用场景的demo(包括在线及时聊天系统以及线上缓存更新,代码热修复案例)

    距离上一篇博客,这篇文章的发布大概过了整整三个月.我也从饿了么度过了试用期,成为了正式员工.刚进来恰好遇到项目底层改造和迁移,将项目从angular全部迁移到vue上,所以适应这边的节奏和业务的开发任 ...

  6. sourcetree回退已推送的代码

    方法一: https://blog.csdn.net/gang544043963/article/details/71511958 我百度到博主用这种界面的方式进行的,可视化很好.我想应该可以很好的回 ...

  7. EasyDarwin开源手机直播方案:EasyPusher手机直播推送,EasyDarwin流媒体服务器,EasyPlayer手机播放器

    在不断进行EasyDarwin开源流媒体服务器的功能和性能完善的同时,我们也配套实现了目前在安防和移动互联网行业比较火热的移动端手机直播方案,主要就是我们的 EasyPusher直播推送项目 和 Ea ...

  8. 开源作品ThinkJDBC—一行代码搞定数据库操作

    1 简介 ThinkJD,又名ThinkJDBC,一个简洁而强大的开源JDBC操作库.你可以使用Java像ThinkPHP框架的M方法一样,一行代码搞定数据库操作.ThinkJD会自动管理数据库连接, ...

  9. Spring Cloud Alibaba迁移指南(一):一行代码从 Hystrix 迁移到 Sentinel

    摘要: 本文对Hystrix.Resilience4j.Sentinel进行对比,并探讨如何使用一行代码这种极简的方式,将Hystrix迁移到Sentinel. Hystrix 自从前段时间 宣布停止 ...

随机推荐

  1. 用PYTHON练练一些算法

    网上一个专门用来给新手练算法的: http://projecteuler.net/problem=1 Multiples of 3 and 5 Problem 1 Published on Frida ...

  2. [LeetCode 116 117] - 填充每一个节点的指向右边邻居的指针I & II (Populating Next Right Pointers in Each Node I & II)

    问题 给出如下结构的二叉树: struct TreeLinkNode { TreeLinkNode *left; TreeLinkNode *right; TreeLinkNode *next; } ...

  3. java多线程入门

    一.认识多任务.多进程.单线程.多线程 要认识多线程就要从操作系统的原理说起.   以前古老的DOS操作系统(V 6.22)是单任务的,还没有线程的概念,系统在每次只能做一件事情.比如你在copy东西 ...

  4. 百度搜索URL参数 搜索关键字

    http://www.baidu.com/s?wd=关键字 wd(Keyword):查询的关键词: http://www.baidu.com/s?wd=关键字&cl=3 cl(Class):搜 ...

  5. solr安装

    Windows solr(tomcat) 1.1. 安装步骤 1.1.1准备工作 1. 服务器:apache-tomcat-7.0.40压缩版,http://localhost:8080/安装是否成功 ...

  6. __device__ __global__ __host__

    __device__ 标记的函数从一个在器件中执行的函数呼叫,在器件中执行 __global__ 表示该函数从一个在主机中执行的函数呼叫,在器件中执行 __host__表示在主机中呼叫,在主机中执行的 ...

  7. android实现文本复制到剪切板功能(ClipboardManager)

    Android也有剪切板(ClipboardManager),可以复制一些有用的文本到剪贴板,以便用户可以粘贴的地方使用,下面是使用方法   注意:导包的时候 API 11之前: android.te ...

  8. error C2143: 语法错误 : 缺少“;”(在“using”的前面)

    class JJMenuScene : public cocos2d::CCLayer { public: // Here's a difference. Method 'init' in cocos ...

  9. 关于js中 document.body.scrollTop 不能返回正确值的原因

    本来是为了通过document.body.scrollTop来获取浏览器垂直滚动条向下滚动的像素,但是不管滚动条在什么位置总是返回是0,造成这样的原因和html的头部声明有关,如果头部声明 为:< ...

  10. (一)《Java编程思想》学习——按位运算符、移位运算符

    (第三章) (一)按位运算符 按位逻辑运算符有: “与”(AND)        & 1&1=1;1&0=0;0&0=0 “或”(OR) | 1|1=1;1|0=1;0 ...