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

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

foldable_list

ユーザーがセルをクリックすると表示されるアニメーション付き折りたたみ可能なリスト

AndroidiOSWebmacOSWindowsLinux
30日間ダウンロード
70
いいね数
35
Pub ポイント
150

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

flutter pub add foldable_list

パッケージ概要

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

FoldableList は、タップするとアイテムがスムーズな遷移で展開および折りたたみ可能なアニメーション付きのインタラクティブリストを提供するFlutterパッケージです。ユーザー体験を向上させるために、リストセル内の追加コンテンツを動的に表示できるようにします。階層構造や詳細情報をコンパクトなレイアウトで表示する場合に最適であり、Android、iOS、Web、macOS、Windows、Linuxなどすべての主要プラットフォームをサポートしています。軽量で簡単に統合できるため、折りたたみ可能なコンテンツセクションが必要なアプリに適しています。

用途

  • コンパクトなリストで詳細情報を表示する
  • アコーディオンスタイルのインターフェースを作成する
  • 展開可能なセクションによるナビゲーションの強化
  • よくある質問や設定パネルの作成
  • ネストされたデータ階層を表示する

主な機能

  • スムーズなアニメーションによる拡張と折りたたみ
  • カスタマイズ可能なアニメーションの期間とカーブ
  • 複数の展開可能なアイテムをサポート
  • 既存の ListView との簡単な統合
  • クロスプラットフォーム互換性

適している対象

  • インタラクティブなUIを構築する開発者
  • 折りたたみ可能なコンテンツを必要とするアプリ
  • エレガントな展開可能なリストを探しているデザイナー
  • 動的なデータ表示を備えたプロジェクト
  • 豊富なインタラクションを備えたモバイルおよびWebアプリケーション

注意事項

  • 非常に大きなリストではパフォーマンスに影響する可能性があります
  • 状態管理の適切な取り扱いが必要です
  • アニメーションの挙動は、プラットフォームによってわずかに異なる場合があります
  • 複雑なレイアウトのカスタマイズが限られている
  • 中程度の展開可能アイテムに最適

元の README

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

Foldable List

An animated foldable list cells with dynamic widget list input, let you display detailed item cell without navigating to a new screen.

enter image description here foldable_list_slide_animation.gif foldable_list_without_animation.gif

Features

  • Display list of widgets
  • Display detailed cell item
  • Animation transition between item cell and foldable item

Getting Started

In order to use foldable list package you need to install it via pubspec.yaml file

dependencies:
	foldable_list: ^1.0.1

Parameters

Name Type Description Required
foldableItems List<Widget> List of widget items that will be shown when an item is clicked True
items List<Widget> List of widgets that will be shown by default in the listview True
animationDuration Duration the duration of the animation by default: Duration(milliseconds: 500) False
animationType ANIMATION_TYPE the animation that will applied on the transition between items False

possible values of animationType : NONE, SIZE_TRANSITION, SCALE

Example

return  Scaffold(
	backgroundColor:  Colors.white,
	body:  Container(
		child:  FoldableList(
			animationType:  ANIMATION_TYPE.NONE,
			foldableItems:  this.expandedWidgetList,
			items:  this.simpleWidgetList
		)
	)
);

Result:

foldable_list_without_animation.gif

Contribution

Of course the project is open source, and you can contribute to it repository link

  • If you found a bug, open an issue.

  • If you have a feature request, open an issue.

  • If you want to contribute, submit a pull request.

カテゴリー

ソースリポジトリ

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

データはまだありません。