snapping_page_scroll

套件介紹

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

一個增強 PageView 功能的 Flutter 套件，透過啟用平滑、基於速度的捲動並自動吸附至最近的頁面，提供更直覺且流暢的使用者體驗。非常適合用於類似幻燈片的介面或內容滑塊，其中精確的頁面對齊至關重要。該外掛程式可在所有主要平台（包括行動裝置、網頁和桌面）上運作，確保行為一致。設計輕量且易於整合到現有專案中。

適用情境

輪播滑塊
影像畫廊
引導頁
產品展示
互動式教程

主要特色

基於速度的滾動
自動頁面吸附
跨平台支援
最小設定
平滑動畫
可自訂的吸附行為

適合對象

開發互動式 UI 的開發者
具有多頁面內容的應用程式
尋求精緻滾動效果的設計師
需要響應式導航的專案
行動與Web應用程式

使用建議

可能需要調整以獲得最佳抓取靈敏度
不適合非頁面式捲動版面
性能取決於內容複雜度
對高級滾動邏輯的自訂有限

原始 README

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

Snapping Page Scroll

A plugin that acts similar to a PageView but either snaps to the closest page or scrolls multiple pages and then snaps, based on how fast the user scrolls.

If the user scrolls faster than a certain threshold, page snapping will be disabled until friction slows the velocity to below that threshold, leading to page snapping being enabled again.

If the user scrolls slower than the threshold, the widget will act like a regular PageView with pageSnapping: true.

Usage

To use this plugin, add snapping_page_scroll as a dependency in your pubspec.yaml file.

Example

import 'package:flutter/material.dart';
import 'package:snapping_page_scroll/snapping_page_scroll.dart';

void main() => runApp(App());

class App extends StatelessWidget {
  Widget customCard(String text) {
    return Padding(
      padding: const EdgeInsets.fromLTRB(20, 100, 20, 100),
      child: Card(
        child: Text(text),
      ),
    );
  }

  final controller = PageController(
    viewportFraction: 0.75,
  );

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        backgroundColor: Colors.amber,
        appBar: AppBar(),
        body: SnappingPageScroll(
          controller: controller,
          children: <Widget>[
            customCard('Card 1'),
            customCard('Card 2'),
            customCard('Card 3'),
            customCard('Card 4'),
            customCard('Card 5'),
            customCard('Card 6'),
          ],
        ),
      ),
    );
  }
}

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

安裝套件