Flutter - ListView 动画 - 增加最可见/最集中的项目的大小？答案

【问题标题】：Flutter - ListView Animation - Increse size of item that is most visible / focused?Flutter - ListView 动画 - 增加最可见/最集中的项目的大小？
【发布时间】：2026-01-24 08:25:02
【问题描述】：

是的，基本上标题说明了一切。我想看看哪个项目最集中，然后增加它的大小。这是我编写的代码，但它在性能方面存在一些大问题：

import 'dart:math';

import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:tastie/models/HomeFeed.dart';
import 'package:tastie/models/Restaurant.dart';
import 'package:visibility_detector/visibility_detector.dart';
import 'restaurant_preview.dart';

class Home extends StatelessWidget {
  Home(this.feed);
  final HomeFeed feed;
  @override
  Widget build(BuildContext context) {
    double visible = 0;
    return ListView(
      scrollDirection: Axis.horizontal,
      children: [
        for (Restaurant resto in feed.recents)
          (_restoprev(context, resto, visible)),
      ],
    );
  }
  Widget _restoprev(BuildContext context, Restaurant resto, double visible) {
    GlobalKey _key = GlobalKey();
    RestaurantPreview restopreview = RestaurantPreview(context, resto, key: _key);
    return Center(
      child: Card(
        clipBehavior: Clip.antiAlias,
        child: VisibilityDetector(
          key: Key(resto.id + Random().nextInt(10000).toString()),
          onVisibilityChanged: (VisibilityInfo info) {
            if (info.visibleFraction > visible) {
              final RestaurantPreviewState previewState = _key.currentState;
              previewState.update(true);
            } else {
              final RestaurantPreviewState previewState = _key.currentState;
              previewState.update(true);
            }
          },
          child: restopreview,
        ),
      ),
    );
  }
}

但是此代码不起作用，因为它与平滑相反，它落后并且影响了多个小部件。所以我的问题是如何检测哪个视图最受关注以及如何扩展它？还有另一种方法可以改变餐厅的状态，因为我读到 GlobalKey 仅用于调试。也许使用 ObjectKey？

【问题讨论】：

标签： flutter dart flutter-animation flutter-listview

【解决方案1】：

Hero 小部件可以完全满足您的需求。

在此处关注颤振文档： https://flutter.dev/docs/development/ui/animations/hero-animations

【讨论】：

【解决方案2】：

这个问题的答案会很长，幸运的是有一个视频描述了如何使用 ListView 控制器进行播放。视频很长，但我建议您全部观看，但是您感兴趣的部分在 9 分钟后开始。这里是链接：https://www.youtube.com/watch?v=Cn6VCTaHB-k&t=326s

【讨论】：