slinky_view
一个贴合 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
),
// ...
);
