Question

我正在尝试实现带有视频的可滚动列表。我正在使用video_player小部件，并使用一个简单的按钮将播放器包装在Card中。现在我注意到，每当我将ListView.builder与列表中的视频一起使用时，它都是非常滞后的，尤其是在向上滚动时。如果您想查看该行为，我会发布GiF波纹管。仅在列表中有视频时，我才有此问题。如果我将视频替换为简单的“图像”小部件，则滚动会很流畅，并且可以按预期运行。（还在下面提供了GiF）

滚动列表时，会在控制台中收到以下消息：

flutter: Another exception was thrown: setState() or markNeedsBuild() called during build.

我认为（但不确定）这是问题的原因，也许是我实现video_player插件的方式（？）

class VideoPlayPause extends StatefulWidget {
  VideoPlayPause(this.controller);

  final VideoPlayerController controller;

  @override
  _VideoPlayPauseState createState() => _VideoPlayPauseState();
}

class _VideoPlayPauseState extends State<VideoPlayPause> {

//This Part here 
_VideoPlayPauseState() {
    listener = () {
      setState(() {});
    };
  }

也许每次我滚动它的设置状态？

我尝试了flutter run --release，但完全没有区别。我正在物理Iphone X上运行该应用程序。

Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('MVP_Test1'),
      ),
      body: ListView.builder(
        physics: const AlwaysScrollableScrollPhysics(),
        itemCount: videoUrl.length,
        itemBuilder: (context, i) {
          return Card(
            child: Column(
              children: <Widget>[
                Column(
                  children: <Widget>[
                    const ListTile(
                      leading: Icon(Icons.live_tv),
                      title: Text("Nature"),
                    ),
                    Stack(
                        alignment: FractionalOffset.bottomRight +
                            const FractionalOffset(-0.1, -0.1),
                        children: <Widget>[
// If I replace this with Image.asset("..."), the scrolling is very smooth.
                          AssetPlayerLifeCycle(
                              videoUrl[i],
                              (BuildContext context,
                                      VideoPlayerController controller) =>
                                  AspectRatioVideo(controller)),
                        ]),
                  ],
                ),
                ButtonTheme.bar(
                  child: ButtonBar(
                    children: <Widget>[
                      FlatButton(
                        child: const Text('ADD VIDEO'),
                        onPressed: () {
/* ... */
                        },
                      ),
                    ],
                  ),
                ),
              ],
            ),
          );
        },
      ),
    );
  }

运行Flutter Analyze的结果

flutter analyze
Analyzing mvp_1...                                                      
No issues found! (ran in 1.9s)

您可以看到在向上滚动时看起来好像应用程序正在跳过帧或其他内容。这是一个视频： https://giphy.com/gifs/u48BNQ13r15Zay5SnN

以下是包含照片而不是视频的视频： https://giphy.com/gifs/236RKyA8y1pfecmR1d

仅当列表中的小部件为Video_Player小部件时，ListView才会滞后

0 个答案: