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

パッケージ詳細v0.1.8

snaplist

アイテムへのスナップ機能を備えたリストを作成できる小さなライブラリです。

30日間ダウンロード
46
いいね数
33
Pub ポイント
40

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

flutter pub add snaplist

パッケージ概要

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

SnapList は、リストのスナップ動作を滑らかに実現する軽量なFlutterパッケージです。ユーザーがアイテムをスクロールすると、自動的に最も近いアイテム境界にスナップします。画像ギャラリーまたはカルーセルのようなインターフェースにおいて、スクロール中の正確な整列と視覚フィードバックを提供することで、ユーザーエクスペリエンスを向上させます。シンプルさを重視して設計されており、複雑な設定なしに既存のリスト構造にシームレスに統合できます。直感的でタッチに優れたリスト操作を作成するのに最適です。

用途

  • 画像カルーセル
  • スクロール可能な製品グリッド
  • インタラクティブスライダー
  • オンボーディング画面
  • 垂直/水平スナップリスト

主な機能

  • スムーズなスナップアニメーション
  • カスタマイズ可能なスナップ間隔
  • 最小構成
  • 垂直方向および水平方向のスクロールをサポートしています
  • 組み込みの整列オプション

適している対象

  • インタラクティブなリストUIを構築する開発者
  • ジェスチャーに基づくナビゲーションに注力するデザイナー
  • 画像を多く含むコンテンツのアプリ
  • タッチ入力を備えたモバイルファーストアプリケーション

注意事項

  • 基本的なスナップロジックに限定
  • 組み込みのページネーションインジケーターなし
  • スクロールイベントの手動処理が必要です
  • 非常に大きなデータセットには最適化されていません
  • カスタムイージングカーブのサポートなし

元の README

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

awesome flutter pub package

snaplist

A small cozy library that allows you to make snappable list views.

Issues and Pull Requests are really appreciated!

Snaplist supports different and even dynamically sized children to be listed and correctly snapped.

Showcase

Showscase gif

Include to your project

In your pubspec.yaml root add:

dependencies:
  snaplist: ^0.1.8

Include

The library does provide StatefulWidget which is called SnapList.

Include the widget like this: import 'package:snaplist/snaplist.dart';

Usage

Use it as you'd use any widget:

Widget build(BuildContext context) {
  return SnapList(
    sizeProvider: (index, data) => Size(100.0, 100.0),
    separatorProvider: (index, data) => Size(10.0, 10.0),
    builder: (context, index, data) => SizedBox(),
    count: 1,
  );
}

Snaplist uses gesture detection for swiping the list, so, please, be sure that the gestures you apply to the widgets inside are not overlapping for best user experience.

Properties

There are 4 required fields:

  • sizeProvider is a provider of each widget size. The library will wrap each built widget to a sized box of specified size. This is required so snapping calculations will work correctly.
  • separatorProvider is similar to sizeProvider, but this size will be used to build the list separators.
  • builder works like a regular Flutter builder all of us are familiar with. It will pass you the context, current item index and some additional data.
  • count - Children count as in a ListView.

The data which is provided to each provider and the builder is a combination of three fields:

  • center - is the position which is now displayed and referenced as the center widget.
  • next - is the position which the user is scrolling to. It is -1 if idle.
  • progress - is the scroll and snip progress. The values are from 0 to 100.

Snaplist defaults to horizontal scrolling. You can set axis to Axis.vertical for vertical scrolling.

カテゴリー

ソースリポジトリ

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

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