パッケージ、リポジトリ、アプリカテゴリを検索

flutter_breadcrumb のカバー
パッケージ詳細v1.0.1

flutter_breadcrumb

Flutterで簡単にパンくずを生成できるFlutterウィジェット。

AndroidiOSWebmacOSWindowsLinux
30日間ダウンロード
18.4万
いいね数
130
Pub ポイント
140

パッケージをインストール

flutter pub add flutter_breadcrumb

パッケージ概要

公開情報に基づく選定ガイドです。参考としてご利用ください。

Flutterパッケージで、パンくずナビゲーションコンポーネントの作成を簡素化します。階層的なナビゲーションパスを表示するクリーンで再利用可能なウィジェットを提供し、アプリ構造内の現在の場所を示すことで、ユーザー体験を向上させます。深いナビゲーションツリーを持つアプリに最適で、カスタマイズが可能であり、Flutterのルーティングシステムとシームレスに統合されます。このパッケージはクロスプラットフォームで、Android、iOS、Web、macOS、Windows、Linuxで動作します。

用途

  • 複雑なアプリケーションでナビゲーション階層を表示する
  • マルチレベルインターフェースにおけるユーザーの方向性の向上
  • 管理者ダッシュボードにおけるUXの向上
  • eコマースサイトにおけるパンくずリストのサポート
  • ドキュメンテーションポータルにおけるナビゲーションの簡素化

主な機能

  • Flutter ルーティングとの簡単な統合
  • カスタマイズ可能な外観とスタイル
  • クロスプラットフォーム互換性
  • 動的パスの更新をサポート
  • 軽量で依存関係なし

適している対象

  • 複雑なナビゲーションフローを構築している開発者
  • ユーザー誘導に焦点を当てるUI/UXデザイナー
  • 階層的なナビゲーションを必要とするアプリ
  • 深いネストを備えた Web およびモバイルアプリケーション
  • 一貫したナビゲーションパターンを重視するチーム

注意事項

  • 動的ルートには手動でのパス管理が必要です
  • 表示以外の組み込み相互作用は限定的
  • ナビゲータースタックからの自動ルート検出なし
  • 静的または予測可能なナビゲーション構造に最適
  • インタラクティブなパン屑に追加の論理が必要になる可能性があります

元の README

関連するソースリポジトリの README 原文のスナップショットです。最新の内容はリポジトリをご覧ください。

flutter_breadcrumb

pub package Twitter

Flutter Widget that can easily create Breadcrumb in Flutter.

A breadcrumb or breadcrumb trail is a graphical control element frequently used as a navigational aid in user interfaces and on web pages. It allows users to keep track and maintain awareness of their locations within applications, documents, or websites.

Flutter Breadcrumb

Show Cases

Show Case Wrap Behavior Scroll Behavior
showcase wrap behaivor scroll behavior

Getting Start

1. Add it to Your pubspec.yaml file as dependency:
dependencies:
  flutter_breadcrumb: ^1.0.1
2. Install packages from the command line
flutter pub get
3. Import it to your file
import 'package:flutter_breadcrumb/flutter_breadcrumb.dart';
4. Add BreadCrumb widget to your widget tree
BreadCrumb(
	items: <BreadCrumbItem>[
	//add your BreadCrumbItem here
	],
	divider: Icon(Icons.chevron_right),
)

Create Items

for creating items you can use primary constructor or builder named constructor.
1. Primary constructor:
BreadCrumb(
	items: <BreadCrumbItem>[
		 BreadCrumbItem(content: Text('Item1')),
		 BreadCrumbItem(content: Text('Item2')),
								 ...
	],
	divider: Icon(Icons.chevron_right),
)
2. Builder named constructor:
BreadCrumb.builder(
	itemCount: 8,
	builder: (index) {
		return BreadCrumbItem(content: Text('Item$index'));
	},
	divider: Icon(Icons.chevron_right),
)

Care about Overflow

select a right overflow behavior for your BreadCrumb widget.
1. WrapOverflow behavior: you can use this behavior when you want to your widget, wrap whenever it uses all of the main Side sizes:
BreadCrumb(
	items: <BreadCrumbItem>[
		//add your BreadCrumbItem here
	],
	divider: Icon(Icons.chevron_right),
	overflow: WrapOverflow(
		keepLastDivider: false,
		direction: Axis.horizontal,
	),
)
2. ScrollableOverflow behavior: use it whenever you want to content your widget scroll if it needed.
BreadCrumb(
	items: <BreadCrumbItem>[
		//add your BreadCrumbItem here
	],
	divider: Icon(Icons.chevron_right),
	overflow: ScrollableOverflow(
		keepLastDivider: false,
		reverse: false,
		direction: Axis.horizontal,
	),
)
3. Custom Overflow behavior: you can easily create your own overflow behavior. the only thing you need is to create a class and extends it from the BreadCrumbOverflow class and overwrite its dependencies.

class CustomOverflowBehavior extends BreadCrumbOverflow{
	@override
	Widget build(BuildContext context, List<BreadCrumbItem> items, Widget divider) {
		// TODO: implement build
	}

	@override
	// TODO: implement keepLastDivider
	bool get keepLastDivider => _keepLastDivider;

	@override
	List<Widget> widgetItems(List<BreadCrumbItem> items, Widget divider) {
		// TODO: implement widgetItems
	}
}
* override widgetItems method to create List<Widget> with items and divider parameters.
* override build method to create your own widget behavior. for example wrap behavior uses Wrap widget. and you can use widgetItems method in your build method to create List<Widget> items.

Contribution and Support

Feel free for Contributing. your Pull Requests are welcome.
if your like this repo please give a star to it. pub package

カテゴリー

依存関係

依存関係一覧 1 件

  • pedantic^1.11.0

ソースリポジトリ

このパッケージを使用しているプロジェクト