首页 > 解决方案 > 如何使 PageView.Builder() 滚动动画从滞后到极其流畅 - Flutter

问题描述

我已经使用 PageView.Builder() 来构建从一组基本文本小部件提供的小部件。但在调试模式下,动画感觉非常滞后。在发布或分析模式下,动画仍然滞后,但要少得多。有没有办法在使用 PageView 时完全消除动画滞后。

这是我的代码,

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      home: pageView(),
    );
  }
}

class pageView extends StatelessWidget {
  var color = [
    Colors.white,
    Colors.lightBlue,
    Colors.lightGreen,
    Colors.limeAccent
  ];
  PageController controller = PageController();
  @override
  Widget build(BuildContext context) {
    return PageView.builder(
      itemCount: 5,
      controller: PageController(initialPage: 1),
      itemBuilder: (BuildContext context, int itemIndex) {
        return pageProvider(color[itemIndex]);
      },
    );
  }
}

class pageProvider extends StatelessWidget {
  Color color;
  pageProvider(this.color);
  Text fillText() {
    var str = "";
    for (int i = 0; i < 1000; i++) {
      str += (" " + 'allan $i');
      if (i % 10 == 0) {
        str += '\n';
      }
    }
    return Text(str);
  }

  Widget build(BuildContext context) {
    return Container(color: color, child: fillText());
  }
}

这是我的分析图的链接。我已经在具有 6 gb ram 和 snapdragon 636 以及一些 Nice gpu 的 android 手机上完成了此分析。链接:https ://drive.google.com/file/d/1khbhKQttVXbdHf0_z1b1iPA11BDOcmdW/view?usp=sharing

标签: flutterdartflutter-pageview

解决方案


推荐阅读