Question

我有一个ListView，其中有一个200像素高的灰色框，当经过3秒时，我希望该灰色框变为一个500 px高的蓝色框。我为此使用了FutureBuilder，但是在滚动中存在一个错误，当您向下滚动并再次向上滚动时，会突然跳动。

复制步骤：

只需创建一个新的Flutter应用

在 main.dart

中粘贴以下代码

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: Scaffold(
        body: ListView(
          children: <Widget>[
            FutureBuilder(
              future: new Future.delayed(const Duration(seconds: 3), () => 'whatevs'),
              builder: (context, snapshot) {
                if (snapshot.hasData) {
                  return Container(width: 200, height: 500, color: Colors.blue);
                } else {
                  return Container(width: 200, height: 200, color: Colors.grey);
                }
              },
            ),
            Container(width: 200, height: 500, color: Colors.green),
            Container(width: 200, height: 500, color: Colors.orange),
            Container(width: 200, height: 500, color: Colors.red),
          ],
        ),
      ),
    );
  }
}

等待3秒
滚动到底部
再次向上滚动并在绿色框中看到跳转

如何删除不希望的跳转并使滚动平滑？

Answer 1

使用install.packages("Package_for_which_you_had_the_error", dependencies = T)方法而不是library("Package_for_which_you_had_the_error")中的init。每当您触摸屏幕时，任何事件触发都会像您一样构建窗口小部件。这就是跳跃的原因。

Future

如何使用FutureBuilder在ListView中构造更高的小部件？

1 个答案: