我做了一个应用来显示一个州下的医院列表。

这是 Main.dart

import 'package:flutter/material.dart';
import 'package:url_launcher/url_launcher.dart';
import 'dart:async' show Future;
import 'package:flutter/services.dart' show rootBundle;
import 'dart:convert';
import 'package:emas_app/model/accounts_model.dart';

Future<String> _loadAsset() async{
  return await rootBundle.loadString('Assets/accounts.json');
}

Future<Accounts> loadAccounts() async{

  final response = await _loadAsset();
  final jsonResponse = json.decode(response);

  Accounts accounts = new Accounts.fromJson(jsonResponse);

  return accounts;
}

class ProviderList extends StatefulWidget {

  @override
  ListState createState() {
    return new ListState();
  }
}

class ListState extends State<ProviderList> {

  @override
  Widget build(BuildContext context) {

    Widget newbody = new ExpansionTile(
        title: new Text("State Name"),
        children: <Widget>[
          new FutureBuilder<Accounts>(
              future: loadAccounts(),
              builder: (context, snapshot){
                if(snapshot.hasData){

                return new ListView.builder(
                      itemCount: snapshot.data.accountinfo.length,
                      itemBuilder: (context, index){

                        String username = snapshot.data.accountinfo[index].name;
                        String address = snapshot.data.accountinfo[index].street;
                        String lat = snapshot.data.accountinfo[index].coordinates.lat;
                        String lng = snapshot.data.accountinfo[index].coordinates.lng;

                        return new ListTile(
                            title: new Text(username),
                            trailing: new Row(
                              mainAxisSize: MainAxisSize.min,
                              mainAxisAlignment: MainAxisAlignment.end,
                              children: <Widget>[
                                new IconButton(
                                    icon: Icon(Icons.info),
                                    onPressed: null
                                ),
                                new IconButton(
                                    icon: Icon(Icons.directions),
                                    onPressed: null
                                )
                              ],
                            )
                        );
                      });
                }else{
                  return new Center(
                    child: new CircularProgressIndicator(),
                  );
                }
              })
    ]);

    return new Scaffold(
      appBar: new AppBar(title: new Text("Providers")),
      body: newbody
    );
  }
}

这是显示扩展的 ExpansionTile 为空白的输出:

这是捕获的错误:

I/flutter ( 6305): Vertical viewport was given unbounded height.
I/flutter ( 6305): Viewports expand in the scrolling direction to fill their container.In this case, a vertical
I/flutter ( 6305): viewport was given an unlimited amount of vertical space in which to expand. This situation
I/flutter ( 6305): typically happens when a scrollable widget is nested inside another scrollable widget.

我已经尝试了所有可以在 Stack Overflow 中找到的解决方案，方法是使用 Expanded 或 Flexible 包装 ListView.builder，但它不起作用。关于如何解决此问题的任何想法？

最佳答案

有两种解决方案:

1. 使用 ListView 的 shrinkWrap 属性

   new ListView.builder(
           shrinkWrap: true,
           itemCount: ...
   

   原因:

   在您的情况下，ListView 位于 ExpansionTile 内。 ExpansionTile 将显示展开并显示有多少 child 。 ListView 将在 scrollDirection 中扩展到最大尺寸，因为它被放置在 ExpansionTile(无界约束小部件)中。根据文档，

   If the scroll view does not shrink wrap, then the scroll view will expand
   to the maximum allowed size in the [scrollDirection]. If the scroll view
   has unbounded constraints in the [scrollDirection], then [shrinkWrap] must
   be true.
   

2. 使用 SizedBox 为 ListView 提供固定高度。

   SizedBox(height: 200.0, child: new ListView.builder(...))
   

关于dart - flutter 垂直视口(viewport)无界高度错误，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/52214706/