Как сделать так, чтобы Widget не переполнял ListView на Flutter Web - PullRequest
Новая
       22

Как сделать так, чтобы Widget не переполнял ListView на Flutter Web

0 голосов
/ 19 февраля 2020

Контекст : я пытаюсь создать веб-приложение с Flutter - так что все это в Chrome

Проблема : у меня есть диаграмма, из библиотеки charts_flutter , и она отображается ОК в столбце. Проблема в том, что я хочу иметь возможность прокручивать и добавлять больше контента под диаграмму. Когда я пытаюсь изменить столбец на ListView, он переполняется (кажется, что Chart пытается быть максимально большим, а ListView имеет бесконечную высоту). Я не уверен, как обойти эту проблему.

Текущий код : Только эшафот, потому что это все, что я считаю важным здесь 

Scaffold(
      appBar: AppBar(
        // Here we take the value from the MyHomePage object that was created by
        // the App.build method, and use it to set our appbar title.
        title: Text(widget.title),
      ),
      body: ListView(
        children: <Widget>[
          Row(
            children: <Widget>[
              FlatButton(onPressed: (){
                print("flat button pressed");
              }, child: Text("Flat Button 1")),
              FlatButton(onPressed: (){
                print("flat button pressed");
              }, child: Text("Flat Button 2")),
              FlatButton(onPressed: (){
                print("flat button pressed");
              }, child: Text("Flat Button 3")),
            ],
            mainAxisAlignment: MainAxisAlignment.center,
          ),
          Flexible(child: GroupedStackedBarChart.withRandomData()),
        ],
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ), // This trailing comma makes auto-formatting nicer for build methods.
    );

Ответы [ 2 ]

0 голосов
/ 19 февраля 2020

Я думаю, что Flexible заставляет диаграмму заполнить высоту родителя, которая бесконечна. Попробуйте вместо этого обернуть его в Column, чтобы получить заранее рассчитанный размер. 

body: ListView(
    children: <Widget>[
      Row(
        children: <Widget>[
          FlatButton(onPressed: (){
            print("flat button pressed");
          }, child: Text("Flat Button 1")),
          FlatButton(onPressed: (){
            print("flat button pressed");
          }, child: Text("Flat Button 2")),
          FlatButton(onPressed: (){
            print("flat button pressed");
          }, child: Text("Flat Button 3")),
        ],
        mainAxisAlignment: MainAxisAlignment.center,
      ),
      Column(
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: [GroupedStackedBarChart.withRandomData()],
      ),
    ],
  ),
0 голосов
/ 19 февраля 2020

приятель просто оборачивает ваш Listview с помощью Expanded и расширяет ваш виджет с помощью Column следующим образом: 

body: Column(
        children: <Widget>[
          Expanded( 
            child: ListView(
              children: <Widget>[

              ],
            ),
          ),
...