开启Material3后SmartRefresher刷新时子组件放大问题的解决方法咨询

当开启Material3（useMaterial3: true）后，使用SmartRefresher组件执行刷新操作时，其内部子Widget会出现异常放大的行为，这是因为Material3默认的ScrollBehavior启用了缩放手势，与SmartRefresher的下拉刷新动作产生冲突导致的。

解决方法 #

方法一：局部禁用缩放手势

给SmartRefresher的子Widget套上ScrollConfiguration，自定义ScrollBehavior并禁用缩放手势：

Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      title: const Text('SmartRefresher Auto Zoom'),
    ),
    body: SmartRefresher(
      onRefresh: () async {
        await Future.delayed(const Duration(seconds: 1));
        refreshController.refreshCompleted();
      },
      controller: refreshController,
      child: ScrollConfiguration(
        behavior: ScrollBehavior().copyWith(
          pinchZoomEnabled: false, // 禁用缩放手势，解决放大异常
          physics: const ClampingScrollPhysics(),
        ),
        child: CustomScrollView(
          slivers: [
            SliverList.builder(
              itemBuilder: (_, i) => Text('data $i'),
              itemCount: 20,
            ),
          ],
        ),
      ),
    ),
  );
}

方法二：修改SmartRefresher的滚动物理效果

直接给SmartRefresher设置physics为ClampingScrollPhysics，避免触发Material3的默认缩放逻辑：

Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      title: const Text('SmartRefresher Auto Zoom'),
    ),
    body: SmartRefresher(
      physics: const ClampingScrollPhysics(),
      onRefresh: () async {
        await Future.delayed(const Duration(seconds: 1));
        refreshController.refreshCompleted();
      },
      controller: refreshController,
      child: CustomScrollView(
        slivers: [
          SliverList.builder(
            itemBuilder: (_, i) => Text('data $i'),
            itemCount: 20,
          ),
        ],
      ),
    ),
  );
}

内容的提问来源于stack exchange，提问作者Anjar Naufal