flutter - 颤振 - 为拖动 showModalBottomSheet 设置捕捉
问题描述
我想在颤振中使用模态底页。但我不能拖动它。
showModalBottomSheet(
context: context,
isScrollControlled: true,
isDismissible: true,
enableDrag: true,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.vertical(top:
Radius.circular(20),), ),
clipBehavior: Clip.antiAliasWithSaveLayer,
builder: (context) {
return StreamBuilder(
stream: controller.stream,
builder: (context, snapshot) =>
GestureDetector( behavior: HitTestBehavior.translucent,
child: Container(
height: snapshot.hasData
? snapshot.data as double
: pageWidth * .9,
child: PlayerCardDialog(
epdId: episodes[index['Ep_ID'])), ),); });
谁能帮帮我?如何拖动底部工作表以及如何在四个位置([0.3、0.6、0.9、1.0])为其设置捕捉。
像这样 :
解决方案
您可以使用DraggableScrollableSheet。使用snap
andsnapSizes
进行捕捉。
但是,我认为捕捉是在 Flutter 的通道中添加master
的,所以如果你找不到它,你可能需要切换到master
.
或者您可以查看snapping_sheet包。
编辑:示例showModalBottomsheet()
void showBottomSheet(context) {
showModalBottomSheet(
context: context,
builder: (context) {
return DraggableScrollableSheet(
snap: true
// snapSizes: TODO
expand: false,
builder: (context, scrollController) {
return StreamBuilder(
stream: Stream.empty(),
builder: (context, snapshot) => GestureDetector(
behavior: HitTestBehavior.translucent,
child: Container(
height: snapshot.hasData ? snapshot.data as double : 500 * .9,
child: Text('Test'),
),
),
);
},
);
},
);
}
推荐阅读
- android - 如何使用 dp 移动按钮?
- reactjs - 如何将borderTop添加到React Material UI Table?
- visual-studio - 在启动时将多个解决方案加载到 Visual Studio 2015
- sparql - 在 GraphDB 的可视化图中可视化超类类型
- html - ITextsharp Html2Pdf CSS 问题
- mysql - 使用 sqlmap 从 MySQL 表中检索注释
- asp.net - web.config 中有多个 ASP.NET 目标框架。使用的是哪一个?
- ios - Swift 获取 UITextField 占位符标签颜色
- git - 在 git rebase -i 期间压缩提交时如何跳过编辑器提示?
- python - 聚合具有相同日期的列(总和)