FLUTTER ECOSYSTEM

westdabestdb/bottom_navigation_badge

westdabestdb/bottom_navigation_badge open-source repository details.

ボトムナビゲーションバッジ のプロジェクト画像
Stars
48
Forks
16
最終プッシュ(UTC)
2022/06/24
プロジェクト状態
公開中
Görkem Erol GitHub avatar
GITHUB User

Görkem Erol ↗

orchestrator of agents

Istanbul, Turkey公式サイト ↗
言語DartObjective-CJava

このリポジトリが公開するパッケージ

使用している依存関係

依存関係一覧 2 件
  • flutter{"sdk":"flutter"}
  • flutter_test開発用{"sdk":"flutter"}

元の README

以下は英語原文のスナップショットです。最新版は GitHub をご覧ください。

README を開く / 閉じる

bottom_navigation_badge / BottomNavigationBadge

BottomNavigationBadge is a Flutter class developed by westdabestdb.

https://media.giphy.com/media/42vZBDJcxd97IHro95/giphy.gif

Getting Started

Add this to your package's pubspec.yaml file:

...
dependencies:
  bottom_navigation_badge: ^1.0.3

Now in your Dart code, you can use:

import 'package:bottom_navigation_badge/bottom_navigation_badge.dart';

Usage

Initialize the badger. Isn't it a nice variable name lol 😁

BottomNavigationBadge badger = new BottomNavigationBadge(
  backgroundColor: Colors.red,
  badgeShape: BottomNavigationBadgeShape.circle,
  textColor: Colors.white,
  position: BottomNavigationBadgePosition.topRight,
  textSize: 8);

Create a list of BottomNavigationBarItems

List<BottomNavigationBarItem> items = [
  BottomNavigationBarItem(icon: Icon(Icons.home), title: Text("Home")),
  BottomNavigationBarItem(icon: Icon(Icons.notifications), title: Text("Notifications")),
  BottomNavigationBarItem(icon: Icon(Icons.face), title: Text("Profile"))
];

Add badge to index with content "1"

setState(() {
  items = badger.setBadge(items, "1", index);
});

Remove the badge at index

setState(() {
  items = badger.removeBadge(items, index);
});

Remove all the badges

setState(() {
  items = badger.removeAll(items);
});