搜索插件、代码仓与 APP 分类

插件详情v1.0.1

coordinator_layout

一个库包含用于处理折叠标题行为的 widget/布局

AndroidiOSWebmacOSWindowsLinux
近 30 天下载
73
喜欢数
4
Pub 分数
150

安装插件

flutter pub add coordinator_layout

插件介绍

基于插件公开信息、社区数据与项目使用情况整理的选型参考。

coordinator_layout 包提供了一组用于管理 Flutter 应用程序中折叠标题行为的控件和布局。受 Android 的 CoordinatorLayout 启发,它能够实现标题与底层内容之间的流畅、协调的滚动交互。该库非常适合创建动态、响应式的用户界面,其中标题在用户滚动时会折叠或显示内容。它支持多种平台,包括移动设备、网页和桌面端,使其成为跨平台开发的多功能选择。该包可与现有 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)),
),

所属分类

源码仓库

使用此插件的项目

暂无相关数据。