徽章控件(BadgeView)，顯示效果：氣泡提示消息數量等

BadgeView

描述： 控件實現簡單，使用，功能較全面，邏輯簡單，你們徹底能夠拿這用，不用造輪子，若是你們有其餘需求也能夠給我提。 使用說明: 氣泡提示消息數量等。

功能描述: 能夠自定義氣泡背景顏色、顯示文本（字符串）、邊框顏色、邊框寬度、在界面中顯示的位置

實例圖:

使用說明

使用方式一:佈局中使用

第一步：佈局用BadgeView將目標view進行包裹，並定義相關屬性

<com.chinaway.android.view.BadgeView
                        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">

                        <TextView
                            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" />
                    </com.chinaway.android.view.BadgeView>
複製代碼

第二步：使用

//找到BadgeView
BadgeView badgeView = (BadgeView) findViewById(R.id.tag_solve);
//設置顯示文本
        badgeView.setBadgeText("99+");
複製代碼

使用方式二：動態添加徽章控件

//動態添加
        TextView button = findViewById(R.id.button);
        final BadgeView badgeV = new BadgeView(this);
        badgeV.attach(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("啦");
複製代碼

控件屬性說明

<declare-styleable name="BadgeView">
        <!--顯示文本-->
        <attr name="badgeText" format="string" />
        <!--文本字體大小-->
        <attr name="badgeTextSize" format="dimension" />
        <!--文本顏色-->
        <attr name="badgeTextColor" format="color" />
        <!--邊框寬度-->
        <attr name="badgeBorderWidth" format="dimension" />
        <!--邊框顏色-->
        <attr name="badgeBorderColor" format="color" />
        <!--氣泡背景色-->
        <attr name="badgeBgColor" format="color" />
        <!--徽章顯示的位置-->
        <attr name="badgeAnchorPosition">
            <enum name="AnchorLeftTop" value="0" />
            <enum name="AnchorLeftBottom" value="1" />
            <enum name="AnchorRightTop" value="2" />
            <enum name="AnchorRightBottom" value="3" />
        </attr>
        <!--徽章在水平方向的margin-->
        <attr name="badgeMarginHorizon" format="dimension" />
        <!--徽章在垂直方向的margin-->
        <attr name="badgeMarginVertical" format="dimension" />
        <!--徽章內部水平padding-->
        <attr name="badgePaddingHorizon" format="dimension" />
        <!--徽章內部垂直padding-->
        <attr name="badgePaddingVertical" format="dimension" />
    </declare-styleable>
複製代碼

特別說明： 當只想顯示一個氣泡，不顯示文本內容的時候，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的位置

源碼地址： BadgeView-master