flutter - 如何使行在 flutter 中充满整个空间而不会溢出？

我总是在UI flutter 时遇到问题，尤其是在转到行/列及其大小时。基本上，我拥有的是带有图片和列的行。我想拥有的第一件事是MainAxisAllignment.Spacebetween之间的行，以便TextA和TextB尽可能彼此远离。我不能有两列，因为那么很长的TextD会将TextB推离屏幕。我尝试了一些扩展的，灵活的和mainaxissize的方法，但是老实说，我不知道该怎么做。
通常我会使用MSPaint，但我使用的是Mac，却不知道任何像油漆一样完美的东西，所以这里是我的绘画外观。 “应该”状态将为内行另一端的TextB

|---------------------------------------------------|
|  I  |--------------------------------------------||
|  M  |  |TextATextB|                              ||
|  A  |  |-Row------|                              ||
|  G  |  TextC                                     ||
|  E  |  TextD                                     ||
|     |-Column-------------------------------------||
|-Row-----------------------------------------------|

Row(
        children: <Widget>[
          Image.network(
            picture,
            height: 63,
          ),
          SizedBox(
            width: 6,
          ),
          Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: <Widget>[
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: <Widget>[
                  Text(_viewModel.time),
                  Text(_viewModel.session),
                ],
              ),
              Text(_viewModel.room),
              SizedBox(
                height: 2,
              ),
              Text(
                _viewModel.title,
                overflow: TextOverflow.ellipsis,
                maxLines: 1,
                style: TextStyle(fontWeight: FontWeight.w900),
              ),
            ],
          ),
        ],
      ),

这是关于我如何执行此小部件的代码。谢谢!
编辑:我用Excel制作了一个希望不会混淆的版本。基本上:只要列宽，我就想排

最佳答案

这是一个整洁的问题。根据要求，已完成的大部分工作，缺少一些改进，因此，我将其添加到您的代码中，希望能在很大程度上对您有所帮助:)

最终解决方案

            // I have not used your data, just used mine for image, texts
            Row(
                mainAxisAlignment: MainAxisAlignment.start,
                children: <Widget>[
                  Image.network(
                   "https://images.unsplash.com/photo-1494548162494-384bba4ab999?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&w=1000&q=80",
                    height: 63.0,
                    width: 63.0
                  ),
                  SizedBox(width: 6.0),
                  Expanded(
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.center,
                      crossAxisAlignment: CrossAxisAlignment.stretch,
                      children: <Widget>[
                        Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: <Widget>[
                            Text('Text A'),
                            Text('Text B'),
                          ],
                        ),
                        Text('Text C'),
                        SizedBox(height: 2.0),
                        Text(
                          'Text D',
                          overflow: TextOverflow.ellipsis,
                          maxLines: 1,
                          style: TextStyle(fontWeight: FontWeight.w900),
                        ),
                      ]
                    )
                  )
                ]
              )

您将获得的结果

我希望这就是您想要的:)学习愉快