slinky_view

Pub Version Test

一个贴合 widget 底部并且在向上滚动时扩展的面板。

入门

添加依赖。

dependencies:
  slinky_view: ^1.0.0

用法

import 'package:slinky_view/slinky_view.dart';

SlinkyView(
  controller: SlinkyController(),
  panelParameter: SlinkyPanelParameter(
    contents: [
      SliverFixedExtentList(
        itemExtent: 150.0,
        delegate: SliverChildListDelegate([const Text('test')]),
      ),
      const SliverFillRemaining(
        hasScrollBody: false,
        child: ColoredBox(color: Colors.white),
      ),
    ],
  ),
  body: Container(
    color: Colors.blue.shade100,
    width: double.infinity,
    height: double.infinity,
  ),
);

SlinkyView

一个 DraggableScrollableSheet 的容器,它通过调整滚动视图的大小来响应拖动手势,直到达到限制,然后滚动。主体被遮盖,在向上滚动时无法进行操作。

名称 描述
SlinkyPanelParameter panelParameter 更多细节将在下面解释。
SlinkyController controller 更多细节将在下面解释。
SlinkyScrollParameter scrollParameter 更多细节将在下面解释。
Widget 主体 主体显示在面板下方。
Color maskColor maskColor 是 MaskView 的颜色。MaskView 是一个在面板滚动时显示在面板和主体之间的 Widget。默认值为 Color(0x99000000)
bool barrierDismissible barrierDismissible 参数用于指示点击遮罩层是否会向下滚动面板。默认值为 true

SlinkyController

一个可以用来以编程方式控制此面板的控制器。

SlinkyPanelParameter

此类管理面板的参数。

名称 描述
SliverAppBar appBar 显示在面板顶部的 Widget。
List<Widget> contents 显示在面板中的 Widget。Widget 必须是 Sliver 类型。
double maxSize 显示面板时用于面板高度的最大分数。默认值为 0.9
double minSize 显示面板时用于面板高度的最大分数。默认值为 0.9
BorderRadiusGeometry borderRadius 面板的圆角。默认值为 BorderRadius.all(Radius.circular(32)

SlinkyPanelParameter

此类管理滚动参数。

名称 描述
Duration duration 滚动时间。默认值为 Duration(milliseconds: 100)
Curves curve 动画曲线。默认值为 Curves.linear
double scrollTolerance 滚动量容差。默认值为 0.1

设置方法如下

import 'package:slinky_view/slinky_view.dart';

SlinkyView(
  // ...
  scrollParameter: const SlinkyScrollParameter(
    duration: Duration(microseconds: 200),
    curve: Curves.bounceIn,
    scrollTolerance: 0.05
  ),
  // ...
);

GitHub

查看 Github