如何在 Flutter 的 Row 中自定义对齐组件？

Question

我正在构建一个Card 来显示图像和一些文本信息。我希望 RED Container 内容与顶部对齐，而不是像当前一样居中。我使用Row 来划分Image 和Texts 内容。除此之外我想改变Texts在图片右侧整个空间的位置，我该如何管理呢？

卡片小部件

  Widget buildExerciseCard(BuildContext context, int index) {
    return Container(
      color: Colors.green,
      margin: EdgeInsets.fromLTRB(5, 2, 5, 0),
      child: Card(
          color: Colors.blue,
          child: Row(
            children: [
              Image.asset(
                exerciseList[index].imagePath,
                width: 75,
                height: 75,
                fit: BoxFit.contain,
              ),
              Container(
                color: Colors.red,
                child: Column(
                  children: [
                    Text(exerciseList[index].name),
                    Text(exerciseList[index].bodyPart),
                    Text(exerciseList[index].muscle)
                  ],
                ),
              ),
            ],
          )),
    );
  }

结果：

Answer 1

试试这个代码：

  Widget buildExerciseCard(BuildContext context, int index) {
    return Container(
      color: Colors.green,
      alignment: Alignment.topLeft,
      margin: EdgeInsets.fromLTRB(5, 2, 5, 0),
      child: Card(
          color: Colors.blue,
          child: Row(
            crossAxisAlignment: CrossAxisAlignment.start,
            mainAxisSize: MainAxisSize.min,
            children: [
              Image.asset(
                exerciseList[index].imagePath,
                width: 75,
                height: 75,
                fit: BoxFit.contain,
              ),
              Container(
                color: Colors.red,
                child: Column(
                  children: [
                    Text(exerciseList[index].name),
                    Text(exerciseList[index].bodyPart),
                    Text(exerciseList[index].muscle)
                  ],
                ),
              ),
            ],
          )),
    );
  }