时间戳

首页 > 解决方案 > 在 Flutter 中获取“水平视口被赋予无界高度”错误

android - 在 Flutter 中获取“水平视口被赋予无界高度”错误

问题描述

我正在尝试将具有水平 GridView 子项的 ExpansionTile 放置在容器中。请参阅下面的代码。我收到错误消息“水平视口的高度没有限制。”

我不想明确指定 ExpansionTile 或 GridView 的高度，而是从 Expanded 小部件和 GridView 的子级计算得出。

我已尝试按照此处的建议在 GridView 中设置“shrinkWrap：true”，但没有成功。我还尝试根据这个答案将 GridView 包装在 Flexible 中，这给了我错误“RenderFlex 子级具有非零弹性，但传入的高度约束是无界的。”

我认为问题在于我如何使用 GridView，但我是 Flutter 的新手，不太确定。这是我的代码：

import 'package:flutter/material.dart';

void main() => runApp(
  MaterialApp(
    home: Scaffold(
      appBar: AppBar(title: Text("Title")),
      body: Column(
        children: <Widget>[
          Expanded(
            flex: 3,
            child: ExpansionTile(
              title: Text("Expandable"),
              children: <Widget>[
                GridView.count(
                  scrollDirection: Axis.horizontal,
                  crossAxisCount: 2,
                  children: <Widget>[
                    RawChip(label: Text("Hello")),
                    RawChip(label: Text("World")),
                  ],
                ),
              ],
            ),
          ),
          Expanded(
            flex: 7,
            child: Container(
              color: Colors.blue
            ),
          ),
        ],
      ),
    ),
  ),
);

标签： androidiosuser-interfacedartflutter

解决方案

您可以在您的 : 中添加一个高度约束GridView：

         ExpansionTile(
                        title: Text("Expandable"),
                        children: <Widget>[
                          SizedBox(
                            height: 200.0,
                            child: GridView.count(
                              scrollDirection: Axis.horizontal,
                              crossAxisCount: 2,
                              children: <Widget>[
                                RawChip(label: Text("Hello")),
                                RawChip(label: Text("World")),
                              ],
                            ),
                          ),
                        ],
                      ),

推荐阅读