Stepper 中的 ListView - Step

Question

我检查了Stepper类并发现它正在使用 ListView 以水平模式显示项目 (StepperType.horizo​​ntal)。

我不知道如何在步骤中使用嵌套的 ListView。

我尝试了其他线程中提到的几种方法，但没有一个有效(由于无法计算高度)。

同时，我使用 Column 而不是 ScrollView，但它有一个 BUG。

当我从Column中删除一个项目并调用setState刷新Step时，渲染的东西不一致，来自DataSource的Items数量等于Column中的Widget数量，但显示的Widget是以某种方式缓存显示已删除的项目。

Answer 1

您可以将 singlechildscrollview 与 row 一起使用

List<Step> steps = [
    Step(
        // Title of the Step
        title: Text("Send Money"),
        // Content, use SingleChildScrollView
        content:SingleChildScrollView(
                scrollDirection: Axis.horizontal,
                child: Row(
                children: <Widget>[

                  Container(
                    color: Colors.green, // Yellow
                    height: 200.0,
                    width: 200.0,
                  ),

                  Image.network('https://flutter-examples.com/wp-content/uploads/2019/09/blossom.jpg',
                     width: 300, height: 200, fit: BoxFit.contain),

                  Image.network('https://flutter-examples.com/wp-content/uploads/2019/09/sample_img.png',
                     width: 200, fit: BoxFit.contain),

                  Container(
                    color: Colors.pink, // Yellow
                    height: 200.0,
                    width: 200.0,
                  ),

                  Text('Some Sample Text - 1', style: TextStyle(fontSize: 28)),

                  Container(
                    color: Colors.redAccent, // Yellow
                    height: 200.0,
                    width: 200.0,
                  ),

                  Image.network('https://flutter-examples.com/wp-content/uploads/2019/09/blossom.jpg',
                     width: 300, height: 200, fit: BoxFit.contain),

                ],
              ),
             ),

        state: StepState.complete,
        isActive: true),] ...