Flutter 文本未在 Row 内换行

Question

我有一个简单的 Widget，里面有 Row 和 Text。如果 Text 更长，它应该简单地放在下一行，但现在它停留在一行并给我一个 overflow:

这是我的代码：

class HintKeyPoint extends StatelessWidget {
  final String text;

  const HintKeyPoint({
    required this.text,
  });
  @override
  Widget build(BuildContext context) {
    return Row(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        SizedBox(
          width: scaleWidth(10),
        ),
        Container(
          height: scaleWidth(16),
          width: scaleWidth(16),
          decoration: BoxDecoration(
              color: AppColors.primaryLight, shape: BoxShape.circle),
        ),
        SizedBox(
          width: scaleWidth(10),
        ),
        Text(
          text,
          style: AppTextStyles.h7,
        ),
      ],
    );
  }
}

为什么 Text 不采用垂直 space？我在这里做错了什么？

Answer 1

使用展开的环绕文本小部件。

Answer 2

您需要用 Expanded Widget 包裹 Text Widget。

示例：

Expanded(
    child: Text(
    "lorem10 lorem10 lorem10lorem10lorem10lorem10lorem10 lorem10lorem10lorem10lorem10lorem10 lorem10lorem10lorem10lorem10lorem10 lorem10",
    ),
),

Flutter 文本未在 Row 内换行

Flutter text is not wrapping inside Row

text

row

dart

flutter