如何使用 Badge Count (桌面圖示計數)

如何使用 Badge Count (桌面圖示計數)

情境

在 Android 系統上面,我們需要在外面 Icon 上面提示使用者有幾則未讀的訊息,方便使用者在還沒進入到 App 之前就能夠決定是否要進到 App 內查看,這時候,就會使用到 Badge Count 這個功能,比較奇怪的是 Google 對於這個設計卻沒有支援,因此,只能夠過第三方函式庫來完成這樣的功能。


我們在 GitHub 上面找到一套知名的第三方套件,擁有三千多顆星星,品質相當的穩定,而且有持續在更新。

程式碼下載

你可以到 GitHub 上面觀看或下載完整的程式碼

程式碼說明

使用上非常的簡單,只需要在程式內加上 Gradle 的引用,就可以直接在程式直接操作這個第三方函式庫了。

compile "me.leolin:ShortcutBadger:1.1.18@aar"

在官方網站上的教學 ,可以看到它的操作方法有 applyCount 、removeCount 兩種而已,非常容易,其實想一想只需要一種也是足夠的,因為如果只要自己操作變數,再將該變數設定到 Badge Count 就可以了,多一個 removeCount 其實我覺得是多餘的,在 readme 的說明中,作者也表示可以直接使用 applyCount 來進行歸零的動作,我猜想可能是多一種選擇讓開發者能夠自由地判斷會比較方便吧!
所以這個範例會非常的簡單,我們設定了三個按鈕,一個是 +1,一個是 -1,另外一個就是使用 remove 的功能來當作我們的歸零。

public class MainActivity extends AppCompatActivity {

    private Button remove;
    private Button add;
    private Button sub;
    public int badgeCount;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        remove = (Button) findViewById(R.id.btn);
        remove.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                badgeCount = 0;
                ShortcutBadger.removeCount(MainActivity.this);
            }
        });
        add = (Button) findViewById(R.id.add);
        add.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                badgeCount++;
                ShortcutBadger.applyCount(MainActivity.this, badgeCount);
            }
        });
        sub = (Button) findViewById(R.id.subtraction);
        sub.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                badgeCount--;
                ShortcutBadger.applyCount(MainActivity.this, badgeCount);
            }
        });
    }
}

程式碼需要三個 Button 來幫忙執行動作,每個按下去的事件就是直接透過 ShortcutBadger 的兩個方法 applyCount 以及 removeCount 來完成,這就可以看到以下的畫面。






當按兩下 +1 count 的按鈕,退回到桌面會看到我們的 App Icon 上面多出了 2 的數字,如下圖。





接著按下 -1 count 的按鈕,再退回到桌面看一下 App Icon 右上方的數字變成 1,如下圖。





最後只要按下 removeConut,回到桌面可以看到 App Icon 將所有數字全部清除掉了。





這樣就是一個簡單的 ShortcutBadger 操作範例了。