美文网首页Android开发Android学习知识Android使用基础
Android实践: 一步实现图标文本+小红点

Android实践: 一步实现图标文本+小红点

作者: AssIstne | 来源:发表于2017-02-04 17:31 被阅读1411次

图标+文本作为一个按钮这种形式在国内大部分app都会使用.

京东首页

虽然TextView可以包含图标, 但是存在问题,

TextView问题

当你指定了TextView的高度时, 图标和文本之间的间距并不等于drawablePadding.

所以当使用TextView实现的时候, TextView只能是wrap_content, 如果这个按钮是有指定尺寸并且可以点击的话, 那么单纯使用TextView就不能满足要求了, 需要在外部嵌套一个FrameLayout来捕捉点击事件.

当一个app有多个这种按钮的时候(通常都有好几个, 底部tab按钮, 个人中心的按钮等等), 这种实现显得非常臃肿.如果还需要实现"小红点"的需求, 则更加麻烦了.

另外值得一提的是, TextView是一个比较"重"的控件, SDK24中的源码超过1W行, 单纯的显示静态文本作为按钮, 显得有点大材小用.

所以写了一个控件来满足需要:
这个控件包含图标, 文本和红点以及红点内的文本. 可以任意设置元素的大小, 位置和内容. 能够满足常见的需求.

通过gradle添加依赖:

compile 'com.assistne.android:icon-dot-text-view:1.0'

一个控件满足所有需要:

<com.assistne.icondottextview.IconDotTextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"

    app:text="Category"
    app:icon="@drawable/ic_shopping_cart_black_48dp"
    app:dot_visible="true"
    app:dot_text="400"
    />

效果如图:

Demo

源码已经上传GitHub-IconDotTextView
欢迎提意见和issue :)
能帮到你的话, 点个star吧~ >-<

相关文章

  • Android实践: 一步实现图标文本+小红点

    图标+文本作为一个按钮这种形式在国内大部分app都会使用. 虽然TextView可以包含图标, 但是存在问题, 当...

  • MVP 笔记

    MVP 与 MVC 简单介绍 实践 参考资料:Android MVP 详解(下)一步一步实现 Android 的M...

  • Android实现分享和接收分享内容

    Android实现分享文本:(Intent): Android实现分享图片:(Intent): Android实现...

  • 2016.7

    7.1 给 Android 初学者的 Gradle 知识普及 教你一步一步实现图标无缝变形切换 7.4 解决Scr...

  • Android应用图标上的小红点Badge实践代码

    现在Android中有许多的应用仿苹果的在应用图标上显示小红点。当然有着一些手机ROM对小红点的支持,比如小米,三...

  • Android应用图标上的小红点Badge亲自实践

    现在Android中有许多的应用仿苹果的在应用图标上显示小红点。当然有着一些手机ROM对小红点的支持,比如小米,三...

  • 安卓

    ·Android O自适应图标的意义何在?Google设计师给你答案|科普 ·设计自适应图标 ·实现自适应图标 ·...

  • 厉害了,将 iPhone 小红点颜色改成小蓝点!

    上次我们分享过屏蔽设置图标小红点的技巧,有需要的小伙伴可以点击右边蓝字跳转教你去除iPhone设置图标的小红点 今...

  • Android 优化 图标文字 iconfont

    Android 优化 图标文字 iconfont 使用图标文字代替图片的实践 进入项目的main文件夹创建一个as...

  • Android歌词文本解析

    1. LRC文本解读 Android中要实现滚动歌词的第一步,是需要对LRC歌词文本进行解析,首先来看一份标准的歌...

网友评论

  • 78983551cc90:textview的图标不能制定大小
    AssIstne:@两津勘 首先获取一个Drawable实例, 然后Drawable#setBounds()方法设置大小, 然后TextView#setCompoundDrawables()
    78983551cc90: @AssIstne 怎么设置,给个提示
    AssIstne:@两津勘 可以,通过代码可以设置drawable的大小

本文标题:Android实践: 一步实现图标文本+小红点

本文链接:https://www.haomeiwen.com/subject/cxfsittx.html