Question

我想在页面中添加SingleChildScrollView，但是我具有PageView。

 @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new IneatAppBarPollWidget()
          .getAppBar('Blackblox', 'assets/img/logo_ineat.png', cand),
      body: new Center(
        child: SingleChildScrollView(
          child: new Column(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: <Widget>[
              new Expanded(
                child: new Container(
                  child: new FutureBuilder<List<PollQuestionsDto>>(
                      future: _future,
                      // ignore: missing_return
                      builder: (context, snapshot) {
                        switch (snapshot.connectionState) {
                          case ConnectionState.none:
                            return Text('Failed connection API');
                          case ConnectionState.waiting:
                            return new Text('Wait...');
                          case ConnectionState.done:
                            if (snapshot.hasData) {
                              if (snapshot.data != null) {
                                return PageView.builder(
                                  scrollDirection: Axis.horizontal,
                                  itemCount: snapshot.data.length,
                                  itemBuilder: (BuildContext context, index) {
                                    print(this.responses);
                                    return PollListViewItem(
                                      entitled: 
                                      snapshot.data[index].entitled,
                                      answers: 
                                      snapshot.data[index].answers,
                                      currentAnswer: 
                                      this.responses[index],
                                      onSelect: (Answer answer) {
                                        this.responses[index] = answer;
                                      },
                                    );
                                  },
                                );
                              }
                            }
                            break;
                          case ConnectionState.active:
                        }
                      }),
                ),
              ),
              new ProgressBar(),
              new Container(
                margin: EdgeInsets.only(right: 10.0),
                child: new RaisedButton.icon(
                  onPressed: () async {
                    //await Poll().submitPoll(answers: answers);
                    setState(() {
                      Navigator.pushReplacement(context,
                          MaterialPageRoute(builder: (context) => 
                          PollPage()));
                    });
                  },
                  label: Text('Suivant'),
                  icon: Icon(Icons.navigate_next),
                ),
                alignment: Alignment.bottomRight,
              ),
            ],
          ),
        ),
      ),
    );
  }
}

添加此内容时，出现此错误：

RenderFlex子级的flex为非零值，但传入的高度限制不受限制。

当一列位于不提供有限高度限制的父级中时（例如，如果它在垂直滚动条中），它将尝试沿垂直轴收缩包装其子级。在子级上设置伸缩（例如，使用扩展）表示子级将扩展以填充垂直方向上的剩余空间。这两个指令是互斥的。如果父母要收缩包裹其子女，则子女不能同时扩张以适合其父母。考虑将mainAxisSize设置为MainAxisSize.min并使用FlexFit.loose适合于灵活的子代（使用Flexible而不是Expanded）。这将使灵活的子代能够将其大小调整为小于他们将被迫占用的无限剩余空间，然后使RenderFlex收缩包装子代，而不是扩展以适应父代提供的最大约束。 / p>

RenderBox未被布置：RenderFlex＃4c442 relayoutBoundary = up12 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE 'package：flutter / src / rendering / box.dart'：断言失败：行1681位置12：'hasSize'

Answer 1

我用示例数据重新创建了您的案例。以下是我修复的问题：

SingleChildScrollView

mainAxisSize

列将扩展为填充垂直空间。因此，在这里，您将需要添加mainAxisSize: MainAxisSize.min,，它告诉column仅占用最小空间。
要在“列”中显示的子级被包裹在Expanded中，该子级再次为其子级占用默认空间。在这里，使用Expanded代替Flexible，而使用future builder来获取适用于其子级的空间。
如果未提供height，则用于显示height中数据的容器将再次扩展到整个屏幕。因此，只需为容器提供自定义body: Center( child: SingleChildScrollView( child: Column( mainAxisAlignment: MainAxisAlignment.spaceEvenly, mainAxisSize: MainAxisSize.min, children: <Widget>[ Flexible( child: Container( height: 200, child: FutureBuilder<Post>( future: post, builder: (context, snapshot) { switch (snapshot.connectionState) { case ConnectionState.none: return Text('Failed connection API'); case ConnectionState.waiting: return new Text('Wait...'); case ConnectionState.done: if (snapshot.hasData) { if (snapshot.data != null) { return PageView.builder( scrollDirection: Axis.horizontal, itemCount: 5, itemBuilder: (BuildContext context, index) { return Card( child: Text('test'), ); }, ); } } break; case ConnectionState.active: } // By default, show a loading spinner. return CircularProgressIndicator(); }, ), ) ), Container( margin: EdgeInsets.only(right: 10.0), child: new RaisedButton.icon( onPressed: () {}, label: Text('Suivant'), icon: Icon(Icons.navigate_next), ), alignment: Alignment.bottomRight, ) ], ), ) ),。

下面的工作代码：

print

基于我使用的示例数据，我能够看到以下结果，并且能够水平滚动以正确查看数据。

希望这能回答您的问题。

PageView颤抖的问题SingleChildScrollView

1 个答案: