[Flutter/dart] 通知数バッジを作る
概要
LINE とかでよく使われる通知数を表すあのバッジ。自分のアプリでも作る必要があったので作り方を紹介します。
方法
static Widget NotificationNumberBadge(int num, Color col, [double size]) {
return Stack(
alignment: Alignment.center,
children: [
Icon(
Icons.brightness_1,
color: col,
size: size,
),
Text(num.toString()),
],
);
}Icons.brightness_1が円形のアイコン。通知数をTextに入れてStackで重ねればOK。通知数、色、サイズを引数にしてメソッドにしました。
実際は他のアイコンに重ねて表示することが多いと思います。その場合は以下のようにします。
Stack(
overflow: Overflow.visible,
children: [
CircleAvatar(
child: Icon(Icons.person),
),
Positioned(
top: -8,
left: 20,
child: NotificationNumberBadge(1, Colors.red)
)
],
)先ほど作った通知数バッジをさらに別のアイコンと重ねます。
今はサンプルのため「1」を表示していますが、実際は通知数を取得して0か1以上かでアイコンを変えるという処理が必要になると思います。
以上
最新記事
すべて表示現象 アプリ内にAdmobを追加して、アプリを起動すると、下記のエラーが発生 java.lang.RuntimeException: Unable to get provider com.google.android.gms.ads.MobileAdsInitProvider 原因 AndroidManifestの書き方が誤っていた。 <meta-data>はactivityと同じ階層にある必要が
概要 Uriを持っていて、Urlに変換したい場合の方法で少し手惑ったので共有します 方法 String url = uri.toString(); これだけです。 最後に ページを開くだけだとUriでもUrlでもいいんですが、WebViewはUrlを要求してくるんですよね。
問題 以前、日本語を含むURLを開くためには、エンコーディングしてやる必要がある、という記事を書きました。 しかし、すでにエンコーディングされているURLを再度エンコーディングしてしまうと、別のURLになってしまいます。 つまり、URLを開く処理の前に、 ・エンコーディングが必要なURLか ・すでにエンコーディングがされているか を判定しないといけないことになります。これは中々煩雑な処理です。 発
