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

套件詳情v1.0.1

coordinator_layout

一個庫包含用於處理收合標題行為的 widget/佈局

AndroidiOSWebmacOSWindowsLinux
近 30 天下載
73
喜歡數
4
Pub 分數
150

安裝套件

flutter pub add coordinator_layout

套件介紹

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

coordinator_layout 套件提供了一組用於管理 Flutter 應用程式中收合標題行為的元件與佈局。受到 Android 的 CoordinatorLayout 啟發,它能實現標題與底層內容之間流暢、協調的捲動互動。此套件非常適合建立動態、回應式 UI,其中標題會隨著使用者滾動而收合或顯示內容。它支援多個平台,包括行動裝置、網頁與桌面,讓跨平台開發更具彈性。該套件可與現有的 Flutter 元件無縫整合,提供類似原生的捲動體驗。

適用情境

  • 實現可摺疊的應用欄
  • 建立動態可捲動介面
  • 建構響應式標題佈局
  • 透過平滑捲動增強使用者體驗
  • 設計複雜的滾動行為

主要特色

  • 收合標題動畫
  • 跨平台相容性
  • 與 ScrollController 的整合
  • 對嵌套捲動的支援
  • 可自訂的佈局行為

適合對象

  • 開發 Material Design 應用的開發者
  • 尋求進階滾動效果的UI設計師
  • 需要動態標題互動的應用
  • 跨平台 Flutter 項目
  • 複雜的滾動 UI 範式

使用建議

  • 需要理解滾動控制器
  • 可能增加簡單佈局的複雜性
  • 最適合高階UI設計
  • 性能取決於組件嵌套
  • 與核心Flutter組件相比,文件較少

原始 README

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

coordinator_layout

pub package

a Library contains widget/layout to handle collapsing header behavior

Alt Text

Example

CoordinatorLayout(
    headerMaxHeight: 200,
    headerMinHeight: kToolbarHeight + MediaQuery.of(context).padding.top,
    headers: [
        SliverCollapsingHeader(
            builder: (context, offset, diff) {
                return ...;
            },
        ),
    ],
    body: Container(height: null, child: buildBody(context)),
),
Fit content
CoordinatorLayout(
    headerMaxHeight: 200,
    headerMinHeight: kToolbarHeight + MediaQuery.of(context).padding.top,
    header:[ 
        Builder(builder: (context) {
            return SliverOverlapAbsorber(
            handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context),
            sliver: SliverSafeArea(
                top: false,
                sliver: SliverCollapsingHeader(
                builder: (context, offset, diff) {
                    return ...;
                },
                ),
            ),
            );
        }),
    ],
    body: Container(height: null, child: buildBody(context)),
),

所屬分類

原始碼儲存庫

使用此套件的專案

暫無相關資料。