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

简介:

更新日志

  • 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  object const  void  *key)
     __OSX_AVAILABLE_STARTING(__MAC_10_6, __IPHONE_3_1);

 

1
2
OBJC_EXPORT  void  objc_setAssociatedObject(id  object const  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;

 

 本文转自编程小翁博客园博客,原文链接:http://www.cnblogs.com/wengzilin/p/4633937.html,如需转载请自行联系原作者

相关文章
|
3天前
|
人工智能 网络安全 开发工具
vscode代码推送到github库菜鸡专用教程
vscode代码推送到github库菜鸡专用教程
|
13天前
|
运维 安全 开发工具
GitHub 热门开源运维工具 Websoft9:如何实现服务器管理效率翻倍?
Websoft9 提供 200+ 开源应用一键部署,支持容器化隔离、GitOps 自动化和企业级安全防护,助力服务器管理效率提升 80%。
50 1
|
2月前
|
Devops Shell 网络安全
git使用之如何将一套代码同时推送至github|gitee|gitcode|gitlab等多个仓库-含添加ssh-优雅草央千澈完美解决-提供整体提交代码
git使用之如何将一套代码同时推送至github|gitee|gitcode|gitlab等多个仓库-含添加ssh-优雅草央千澈完美解决-提供整体提交代码
126 16
git使用之如何将一套代码同时推送至github|gitee|gitcode|gitlab等多个仓库-含添加ssh-优雅草央千澈完美解决-提供整体提交代码
|
1月前
|
运维 数据可视化 开发者
Dpanel:Star2k,短短时间就被大家称为GitHub开源神器!轻量化Docker面板,还在等什么
如今的软件开发和运维领域,Docker容器技术已经成为一种主流的解决方案,它允许开发者和系统管理员以更高效、更灵活的方式部署和管理应用程序。然而,Docker的命令行界面虽然强大,但对于某些用户来说可能不够直观。今天,我们要介绍的开源项目——dpanel,就是一个轻量化的Docker可视化管理面板,它以其简洁、高效的特点,为用户提供了一个易于操作的界面来管理Docker容器和镜像。
|
5月前
|
开发工具 git Python
代码管理记录(二):Github代码上传实操
本文是关于如何使用Git将本地代码上传到GitHub的实操指南。介绍了Git的基本概念、安装方法,并通过详细的步骤指导用户从GitHub创建仓库到使用Git命令初始化、添加、提交代码,最终将代码推送到远程仓库。同时,还汇总了一些常见的错误及其解决方法。
144 2
代码管理记录(二):Github代码上传实操
|
4月前
|
Swift iOS开发 UED
如何使用Swift和UIKit在iOS应用中实现自定义按钮动画
本文通过一个具体案例,介绍如何使用Swift和UIKit在iOS应用中实现自定义按钮动画。当用户点击按钮时,按钮将从圆形变为椭圆形,颜色从蓝色渐变到绿色;释放按钮时,动画以相反方式恢复。通过UIView的动画方法和弹簧动画效果,实现平滑自然的过渡。
113 1
|
5月前
|
移动开发 网络协议 小程序
基于开源IM即时通讯框架MobileIMSDK:RainbowChat-iOS端v9.1版已发布
RainbowChat是一套基于开源IM聊天框架 MobileIMSDK 的产品级移动端IM系统。RainbowChat源于真实运营的产品,解决了大量的屏幕适配、细节优化、机器兼容问题
115 5
|
5月前
|
Swift iOS开发 UED
如何使用Swift和UIKit在iOS应用中实现自定义按钮动画
【10月更文挑战第18天】本文通过一个具体案例,介绍如何使用Swift和UIKit在iOS应用中实现自定义按钮动画。当用户按下按钮时,按钮将从圆形变为椭圆形并从蓝色渐变为绿色;释放按钮时,动画恢复原状。通过UIView的动画方法和弹簧动画效果,实现平滑自然的动画过渡。
95 5
|
4月前
|
存储 Linux 数据安全/隐私保护
一键部署 200+ 开源Github 2k+ 星星的软件
Websoft9面板是一款基于Web的PaaS/Linux面板,支持在个人服务器上一键部署200多种热门开源应用,适用于个人开发者、中小企业、创业团队、教育机构和技术爱好者。它集成了丰富的开源软件,提供便捷的部署方式、高效的资源利用、良好的可扩展性及低技术门槛,帮助用户快速搭建和管理各类应用。
|
5月前
|
编解码 人工智能 自然语言处理
MaskGCT:登上GitHub趋势榜榜首的TTS开源大模型
近日,香港中文大学(深圳)联手趣丸科技推出了新一代大规模声音克隆TTS模型——MaskGCT。一起看看该模型的一些表现吧!

热门文章

最新文章

  • 1
    苹果app上架-ios上架苹果商店app store 之苹果支付In - App Purchase内购配置-优雅草卓伊凡
    40
  • 2
    苹果app上架app store 之苹果开发者账户在mac电脑上如何使用钥匙串访问-发行-APP发布证书ios_distribution.cer-优雅草卓伊凡
    41
  • 3
    uniapp云打包ios应用证书的获取方法,生成指南
    39
  • 4
    iOS|解决 setBrightness 调节屏幕亮度不生效的问题
    124
  • 5
    iOS|记一名 iOS 开发新手的前两次 App 审核经历
    29
  • 6
    iOS各个证书生成细节
    39
  • 7
    【01】噩梦终结flutter配安卓android鸿蒙harmonyOS 以及next调试环境配鸿蒙和ios真机调试环境-flutter项目安卓环境配置-gradle-agp-ndkVersion模拟器运行真机测试环境-本地环境搭建-如何快速搭建android本地运行环境-优雅草卓伊凡-很多人在这步就被难倒了
    203
  • 8
    Cellebrite UFED 4PC 7.71 (Windows) - Android 和 iOS 移动设备取证软件
    62
  • 9
    【03】仿站技术之python技术,看完学会再也不用去购买收费工具了-修改整体页面做好安卓下载发给客户-并且开始提交网站公安备案-作为APP下载落地页文娱产品一定要备案-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
    82
  • 10
    【02】仿站技术之python技术,看完学会再也不用去购买收费工具了-本次找了小影-感觉页面很好看-本次是爬取vue需要用到Puppeteer库用node.js扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
    64