0

It's easy to understand what I want to do by looking at the following screenshots.

When there isn't too much text, I want the label to snuggle up to it. enter image description here

When the text doesn't fit completely on one line, I want it to overflow like in the screenshot. enter image description here

Has anyone encountered a similar problem and knows how to do it in the proper way?

UPDATE 1 What have I already tried?

  1. RichText
RichText(
    overflow: TextOverflow.ellipsis,
    text: TextSpan(
      children: [
        TextSpan(...),
        WidgetSpan(
          child: ...,
        ),
      ],
    ),
  )
  1. Row with Expanded. As a result, as expected, the label is no longer pinned to the text.

    Row( children: [ Expanded( child: Text( text, overflow: TextOverflow.ellipsis, ), ), Label(), ], ),

4

1 回答 1

1

我正在使用RowwithFlexible<Text>来处理这种情况。

Row(
  children: [
    Flexible(
      child: Text(
        "Left most text that overflows the screen and creates an ellipsis",
        maxLines: 1,
        overflow: TextOverflow.ellipsis,
        softWrap: false,
      ),
    ),
    Container(
      width: 40,
      height: 40,
      color: Colors.amber,
    )
  ],
),

在此处输入图像描述

于 2022-02-18T17:42:57.617 回答