Question

我有以下非常简单的Flutter代码：

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
        color: Colors.green,
        child: Row(
//          mainAxisAlignment: MainAxisAlignment.spaceBetween,
//          crossAxisAlignment: CrossAxisAlignment.start,
          children: <Widget>[
             Container(
               width: 100,
               height: 100,
               color: Colors.red,
             ),
             Container(
               width: 100,
               height: 100,
               color: Colors.blue,
             ),
          ],
        )
    );
  }
}

我希望看到一个绿色背景的应用程序，一行中有2个方形框。

但是，我似乎只看到绿色背景，没有框。

我还尝试了mainAxisAlignment和crossAxisAlignment。

我似乎在做错什么？

文档：

https://api.flutter.dev/flutter/widgets/Row-class.html

Answer 1

您需要将容器包装在WidgetsApp或基于WidgetsApp的更常用的MaterialApp或CupertinoApp中。这些小部件提供了Flutter应用程序所需的默认配置。与导航行为类似，请参见此链接以获取更多信息：https://api.flutter.dev/flutter/widgets/WidgetsApp/WidgetsApp.html

工作示例：

import 'package:flutter/material.dart';
//import 'package:flutter/cupertino.dart'; // If using CupertinoApp

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return WidgetsApp( // Alternatively replace with MaterialApp or CupertinoApp
      color: Colors.white,
      builder: (context, widget) {
        return Container(
            color: Colors.green,
            child: Row(
              children: <Widget>[
                Container(
                  width: 100,
                  height: 100,
                  color: Colors.red,
                ),
                Container(
                  width: 100,
                  height: 100,
                  color: Colors.blue,
                ),
              ],
            )
        );
      },
    );
  }
}

希望这会有所帮助：-）

Answer 2

我运行了您的代码，它引发了异常

具有多个子级的水平RenderFlex的文本方向为空，因此布局顺序未定义。

我将textDirection添加到Row并按预期运行

颤振行未在非实质性应用中显示孩子

2 个答案: