搜尋套件、儲存庫與 APP 分類

scroll_snap_effect 封面
套件詳情v0.1.0

scroll_snap_effect

一個用於建立簡單滾動吸附效果的 Flutter 套件

AndroidiOSWebmacOSWindowsLinux
近 30 天下載
16
喜歡數
26
Pub 分數
150

安裝套件

flutter pub add scroll_snap_effect

套件介紹

根據套件公開資料產生的選型評估,僅供參考。

一個 Flutter 套件,可簡化在可滾動組件中實現捲動吸附效果。它能在捲動過程中實現順暢、精確地吸附至特定位置,非常適合建立類似幻燈片或分段捲動介面。此套件輕量且與現有的 ScrollView 無縫整合,為開發者提供一種簡單方式,透過直覺導航提升使用者體驗。支援所有主要平台,包括 Android、iOS、Web、macOS、Windows 和 Linux。

適用情境

  • 建立幻燈片或滑塊
  • 構建分段滾動介面
  • 增強入門畫面中的導航
  • 設計帶有網格對齊的圖像畫廊
  • 實現標籤滾動視圖

主要特色

  • 用於彈跳行為的簡單 API
  • 支援多種滾動方向
  • 平滑的吸附動畫
  • 跨平台相容性
  • 與 ListView 和 PageView 的輕鬆整合
  • 可自訂的吸附間隔

適合對象

  • 開發互動式滾動介面的開發者
  • 尋求直覺式捲動導航的設計師
  • 需要網格對齊捲動的應用程式
  • 針對多個平台的專案
  • 希望滾動效果設定最少的團隊

使用建議

  • 可能需要針對複雜佈局進行調整
  • 非線性吸附的自訂選項有限
  • 未針對極大資料集進行優化
  • 最適合固定大小的項目
  • 效能可能會因複雜的 widget 樹而有所差異

原始 README

以下為關聯原始碼儲存庫的 README 原文快照,最新內容請造訪原始碼儲存庫。

cover

flutter paypal
A Flutter package to create easy animation scroll snap effect in ListView


  // Example itemSize
  // itemSize = child width (ex: 100) + child padding (ex: 16);
  // itemSize = 116
  ScrollSnapEffect(
      itemSize: 116,
      itemCount: 15,
      padding: const EdgeInsets.symmetric(horizontal: 20),
      onChanged: (index) {
        debugPrint('$index');
      },
      itemBuilder: (context, index) {
        return Padding(
          padding: const EdgeInsets.only(right: 16),
          child: SizedBox(
            height: 100,
            width: 100,
            child: ColoredBox(
              color: Colors.blue,
              child: Center(
                child: Text(
                  '$index',
                  style: const TextStyle(
                    color: Colors.white,
                    fontSize: 20,
                  ),
                ),
              ),
            ),
          ),
        );
      },
    ),

Example Scroll Snap Effect

output


🚧 Maintener

account avatar
Farhan Fadila
📫 How to reach me: farhan.fadila1717@gmail.com

❤️ Suport Maintener

paypal badge linktree

所屬分類

原始碼儲存庫

使用此套件的專案

暫無相關資料。