ios 控件徽章_徽章控件(BadgeView),显示效果:气泡提示消息数量等

BadgeView

描述:控件实现简单,使用,功能较全面,逻辑简单,大家完全可以拿这用,不用造轮子,如果大家有其他需求也可以给我提。

使用说明:气泡提示消息数量等。

功能描述: 可以自定义气泡背景颜色、显示文本(字符串)、边框颜色、边框宽度、在界面中显示的位置

实例图:

使用说明

使用方式一:布局中使用

第一步:布局用BadgeView将目标view进行包裹,并定义相关属性

android:id="@+id/tag_process"

android:layout_width="0dp"

android:layout_height="match_parent"

android:layout_weight="1"

android:paddingTop="4dp"

app:badgeAnchorPosition="AnchorRightTop"

app:badgeBgColor="@color/NC10"

app:badgeBorderColor="@color/white"

app:badgeBorderWidth="2dp"

app:badgeMarginHorizon="16dp"

app:badgeTextColor="@color/white"

app:badgeTextSize="10sp">

android:id="@+id/tv_processing"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:drawablePadding="10dp"

android:drawableTop="@drawable/ic_home_progress"

android:gravity="center_horizontal"

android:text="@string/label_processing"

android:textColor="@color/NC4"

android:textSize="@dimen/font_size_12_SP" />

第二步:使用

//找到BadgeView

BadgeView badgeView = (BadgeView) findViewById(R.id.tag_solve);

//设置显示文本

badgeView.setBadgeText("99+");

使用方式二:动态添加徽章控件

//动态添加

TextView button = findViewById(R.id.button);

BadgeView.build(button)

.setBadgeAnchorPosition(BadgeView.ANCHOR_LEFT_TOP)

.setBadgeBgcolor(getResources().getColor(android.R.color.holo_green_light))

.setBadgeBordercolor(getResources().getColor(android.R.color.white))

.setBorderWidth(2)

.setMarginHorizon(8)

.setMarginVertical(2)

.setBadgeTextcolor(getResources().getColor(android.R.color.holo_red_light))

.setBadgeTextSize(14)

.setPaddingH(12)

.setPaddingV(7)

.showBadge("啦");

控件属性说明

特别说明:当只想显示一个气泡,不显示文本内容的时候,badgeText传入空格就好,传入 null则代表不绘制徽章

app:badgeText=" "

badgeAnchorPosition徽章显示位置说明

为了方便计算徽章在布局中的位置

特别提供了:左上、右上、左下、右下 ,四个方位

其次提供:badgeMarginHorizon、badgeMarginVertical 来控制在水平方向和垂直方向的margin,其实就是相对于 badgeAnchorPosition 这个方位值的x、y方向的偏移量 ,这个偏移量并Android坐标上的偏移,二是相对于badgeAnchorPosition的偏移

例如:

app:badgeAnchorPosition="AnchorRightTop"

app:badgeMarginHorizon="16dp"

app:badgeMarginVertical="2dp"

说明:代表将徽章放到该view的右上角,再距离右边16dp(也就是往左16dp),再往下2dp的位置

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值