如何用flutter布局

问题描述 投票:0回答:1

我有一个包含 2 个项目的新 UI。 如果第一项中的文本太长,我需要将其换行,如屏幕截图所示。 我不知道该怎么办。 有人有解决办法吗? 谢谢你的建议。 [界面截图] (https://i.sstatic.net/kE1PCMrb.png)

我尝试使用 Wrap 小部件但不起作用。

flutter dart layout
1个回答
0
投票

具有softWrap和overflow属性的文本小部件。换行小部件对于管理多个小部件很有用,但对于一行中的长文本可能无法正常工作。

Column(
  crossAxisAlignment: CrossAxisAlignment.start,
  children: [
    Text(
      'builder name12345678901234567890123456789012345', // Your builder name here
      style: TextStyle(fontSize: 16), // Adjust font size as needed
      softWrap: true, // Allows text to wrap when it overflows
      overflow: TextOverflow.visible, // Ensures visibility of the overflowing text
    ),
    SizedBox(height: 4), // Adds some space between the text and the next row
    Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: [
        Text(
          '会社をフォローする',
          style: TextStyle(fontSize: 14),
        ),
        Icon(Icons.favorite_border), // Icon can be replaced with your favorite symbol
      ],
    ),
  ],
)
  • Text 小部件使用 softWrap: true 来允许文本在太长时换行。
  • Column 小部件确保构建器名称可以在必要时分成多行。
  • 第二行保存其他文本和图标,确保它们正确对齐。
© www.soinside.com 2019 - 2024. All rights reserved.