Flutter學習- Badge組件

 Badge 是 Flutter 中一個小控件，可以用來顯示小圖標或文本，通常用於在按鈕上提供提示性的消息或數量。

在使用前要先引用它的套件:https://pub.flutter-io.cn/packages/badges

影片連結:https://www.bilibili.com/video/BV1tG4y1u7fb/?spm_id_from=333.788.recommend_more_video.1&vd_source=fa9081c24751e12d42048a4d68c83d90

依下範例:

Badge(
  //要顯示的內容，1的部份可用變數，讓它依情況增加，大小視裡面的widget縮放
  //badgeContent: Text("1"),
  badgeContent: Text(_number.toString(), style: TextStyle(fontSize: 5)),
  //要包裹的組件
  child: Icon(Icons.timer),
  //顏色，默認為紅色
  badgeColor: Colors.yellow,
  //位置
  position: BadgePosition.topEnd(),
  //動畫類型
  animationType: BadgeAnimationType.slide,
  //動畫時長
  animationDuration: Duration(milliseconds: 600),
  //是否要有動畫
  toAnimate: false,
  //一開始是0的時候不會出現，因此要隱藏 false為顯藏。
  // 假如要顯示的變數_number>0才顯示
  showBadge: _number > 0 ? true : false,
  //形狀，有方形及圓形，預設圓形
  shape: BadgeShape.square,
),