You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

能否为Flutter的DraggableScrollableSheet指定BouncingScrollPhysics?

为DraggableScrollableSheet添加BouncingScrollPhysics的实现方法

其实DraggableScrollableSheet本身并不直接接收physics参数,但可以通过控制其内部嵌套的可滚动组件来实现弹性滚动效果,具体操作如下:

  • 在DraggableScrollableSheet的builder回调中,返回一个可滚动组件(比如ListView、SingleChildScrollView)
  • 给这个可滚动组件设置physics: const BouncingScrollPhysics()

示例代码:

DraggableScrollableSheet(
  expand: false,
  builder: (context, scrollController) {
    return ListView.builder(
      controller: scrollController,
      physics: const BouncingScrollPhysics(), // 此处设置弹性滚动
      itemCount: 20,
      itemBuilder: (context, index) {
        return ListTile(title: Text('Item $index'));
      },
    );
  },
)

若无需完整列表结构,使用SingleChildScrollView同样可行:

DraggableScrollableSheet(
  expand: false,
  builder: (context, scrollController) {
    return SingleChildScrollView(
      controller: scrollController,
      physics: const BouncingScrollPhysics(),
      child: Column(
        children: List.generate(20, (index) => ListTile(title: Text('Item $index'))),
      ),
    );
  },
)

注意:iOS设备默认滚动物理即为弹性效果,Android设备需显式设置BouncingScrollPhysics才能触发该效果。

内容的提问来源于stack exchange,提问作者sub

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.13 21:54:53