实战|流式代码封装及ViewBadger角标的应用（附源码）

Vaccae

发布于 2020-02-17 11:51:17

4380

发布于 2020-02-17 11:51:17

文章被收录于专栏：微卡智享微卡智享

学更好的别人，

做更好的自己。

——《微卡智享》

本文长度为4220字，预计阅读10分钟

前言

本来这章只是想讲一个Android中的角标ViewBadger的使用，在写的过程中想起来前面文章中Glide的开源库加载网络图片用一行代码就可以直接实现了，这种代码风格我们叫做流式代码，写起来非常的方便，所以自己也想着做一个ViewBadger静态类，从外部用流式代码可以直接实现。

流式代码

下面这张图就是自己封装好的ViewBadger的类调用的方式，可以看出来就是用的流式代码的风格

实现效果

流式代码实现方法

流式代码其实和写静态类的方式基本差不多，只不过在后面觉得可以再扩展的方法里面加上类的反回值即可

在Kotlin中我们定义静态类直接用object，然后对应的函数方法后面都返回当前静态类，如下图：

ViewBadger介绍

微卡智享

ViewBadger是一个很方便的应用程序徽章的开源库，不过很长时间没有更新了，实现的效果如下图

使用方法

首先在工程的build.gradle中加入依赖项

android {
    repositories {
        jcenter()
        maven { url "https://jitpack.io" }
    }
}

dependencies {
    implementation 'com.github.deano2390:android-viewbadger:1.0.0'
}

调用ViewBadger方法

//获取添加“徽章”的目标View
  View target = (TextView) findViewById(R.id.text);
  BadgeView badge = new BadgeView(this, target);
  badge.setText("1");
  //设置文本颜色
  badge.setTextColor(Color.BLACK);
  //设置背景颜色
  badge.setBadgeBackgroundColor(Color.YELLOW);
  //显示
  badge.show();

使用上面的方法，ViewBadger就可以显示出来了。ViewBadger中基本的方法也是什么settext，settextsize，setTextColor等，这块我就不再说了，下面列几个别的可能用到的方法

方法	参数	说明
badgePosition	Int	徽章存在的位置，默认的右上，可以自己通过BadgerView中的参数定义
setBadgeMargin	Int	设置位置的水平或垂直的偏移量
increment	Int	计数增加，增加个数参数中自己输入
decrement	Int	计数减少，减少个数参数中自己输入
toggle		改变当前状态，如果是显示则隐藏，如果隐藏则显示

基本上上面ViewBadger中的常用方法都已经列出来了，接下来我们就说说封装的静态类的思路

思路

1. 静态类中定义一个当前正在使用的ViewBadger，然后再定义一个ViewBadger的集合

2. 写一个getBadgeView方法用于获取当前的VIewBadger，获取方式为先从集合中查找对应的ViewBadger，如果没有则进行创建。

3. 针对获取到的ViewBadger进行操作

核心方法

//获取当前的badgeview方法
    private fun getBadgeView(context: Context, view: View) {
        try {
            badgeView = badgeviewlist.first { it.target == view }
            Log.i(TAG, "text:" + badgeView.text.toString())
        } catch (e: Exception) {
            Log.i(TAG, e.message.toString())
            badgeView = BadgeView(context, view)
            badgeviewlist.add(badgeView)
        }
    }

上面的方法就是按思路2中写的首先从集合里查找，如果不存在则直接创建并加入到集合中的实现，外部再通过写一个build的方法进行调用。

//创建badgeView
    fun build(context: Context, view: View): BadgeViewUtil {
        getBadgeView(context, view)
        return BadgeViewUtil
    }

完整的静态类

package dem.vac.viewbagder

import android.content.Context
import android.graphics.Color
import android.util.Log
import android.view.View
import android.view.animation.Animation
import com.readystatesoftware.viewbadger.BadgeView

/**
 * 作者：Vaccae
 * 邮箱：3657447@qq.com
 * 创建时间：2019-12-24 10:49
 * 功能模块说明：
 */
object BadgeViewUtil {
    private val TAG = "badgeview"
    //定义存在的集合
    private val badgeviewlist = ArrayList<BadgeView>()
    //当前操作的badgeView
    private lateinit var badgeView: BadgeView

    //获取当前的badgeview方法
    private fun getBadgeView(context: Context, view: View) {
        try {
            badgeView = badgeviewlist.first { it.target == view }
            Log.i(TAG, "text:" + badgeView.text.toString())
        } catch (e: Exception) {
            Log.i(TAG, e.message.toString())
            badgeView = BadgeView(context, view)
            badgeviewlist.add(badgeView)
        }
    }

    //创建badgeView
    fun build(context: Context, view: View): BadgeViewUtil {
        getBadgeView(context, view)
        return BadgeViewUtil
    }

    //设置文字
    fun setText(title: String):BadgeViewUtil {
        badgeView.text = title
        return BadgeViewUtil
    }

    //设置字体大小
    fun setTextSize(size: Float): BadgeViewUtil {
        badgeView.setTextSize(size)
        return BadgeViewUtil
    }

    //设置位置微调
    fun setBadgeMargin(size: Int = 2): BadgeViewUtil {
        badgeView.setBadgeMargin(2)
        return BadgeViewUtil
    }

    fun setBadgeMargin(size: Int, size2: Int): BadgeViewUtil {
        badgeView.setBadgeMargin(size, size2)
        return BadgeViewUtil
    }

    //设置颜色
    fun setColor(
        textcolor: Int = Color.WHITE,
        bgcolor: Int = Color.RED
    ): BadgeViewUtil {
        //设置文本颜色
        badgeView.setTextColor(textcolor)
        //设置背景颜色
        badgeView.badgeBackgroundColor = bgcolor
        return BadgeViewUtil
    }

    //设置位置
    fun setPosition(position: Int = BadgeView.POSITION_TOP_RIGHT): BadgeViewUtil {
        badgeView.badgePosition = position
        return BadgeViewUtil
    }

    //计数加一
    fun increment(offset: Int = 1): BadgeViewUtil {
        badgeView.increment(offset)
        return BadgeViewUtil
    }

    //计数减一
    fun decrement(offset: Int = 1): BadgeViewUtil {
        badgeView.decrement(offset)
        if (badgeView.text == "0") {
            badgeView.hide()
        }
        return BadgeViewUtil
    }

    //修改当前状态,如果显示则隐藏，如果隐藏则显示
    fun toggle(animation: Animation? = null) {
        if (animation == null) badgeView.toggle()
        else badgeView.toggle(animation, animation)
    }

    //显示
    fun show(animation: Animation? = null) {
        if (animation == null) badgeView.show()
        else badgeView.show(animation)
    }

    //隐藏
    fun hide(animation: Animation? = null) {
        if (animation == null) badgeView.hide()
        else badgeView.hide(animation)
    }

    //获取文本
    fun getText(): String {
        return badgeView.text.toString()
    }

}

源码地址

https://github.com/Vaccae/ViewBagderTest.git

写在最后，刚写完这篇后，我在网上又找到了BadgeView的开源库，里面的扩展性要比现在这个ViewBadger多了不少，调用方式也是可以直接用流式代码风格，而且调用的方法和我这个基本差不多，所以用起也看这个很非常方便，地址为

https://github.com/qstumn/BadgeView.git

如果想用徽章的朋友可以直接用上面这个，我的这篇更多的是在于让大家了解了一下怎么样写流式的静态类。