flutter - 两列两行 flutter 布局

Question

我需要帮助来构建布局，如下图所示

我的代码如下

Container(
  child: Padding(
    padding: const EdgeInsets.all(8.0),
    child: Row(
      children: <Widget>[
        Flexible(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              Container(
                color: Colors.black,
                alignment: Alignment.topLeft,
                child: Image.network(
                  'https://images.freeimages.com/images/large-previews/13f/natal-sofia-4-1431300.jpg',
                  width: 200,
                  height: 200,
                ),
              ),
              Container(
                child: Text("Image Text", style: Theme.of(context).textTheme.bodyText1),
              ),
            ],
          ),
        ),
        Flexible(
          child: Container(
            padding: EdgeInsets.only(left: 8),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              mainAxisAlignment: MainAxisAlignment.start,
              mainAxisSize: MainAxisSize.max,
              children: <Widget>[
                Text(
                  'Heading',
                  style: Theme.of(context).textTheme.headline1,
                ),
                SizedBox(
                  height: 4,
                ),
                Text(
                  'Value',
                  style: Theme.of(context).textTheme.headline5,
                ),
              ],
            ),
          ),
        ),
      ],
    ),
  ),
);

它正在生成一个UI，如下所示。

如何将第二列字段对齐到顶部而不是中间？
任何帮助将非常感激。

Answer 1

尝试将crossAxisAlignment: CrossAxisAlignment.start,添加到Row。