Как установить значение максимальной длины текста флаттера?

Question

Я использую программирование Flutter. Мне нужно отобразить заголовок и кнопку рядом с заголовком. Если длина текста меньше, кнопка также должна отображаться рядом с текстом. Если длина текста больше, я хочу установить максимальную длину текста в 200 пикселей и мне нужно показать кнопку рядом с заголовком.

Я использую приведенный ниже код. И работает нормально с меньшей длиной текста .

Проблема в следующем: если длина текста больше, моя кнопка выходит за пределы экрана. Вы можете увидеть поведение на прилагаемом изображении ниже.

          Row(
            children: <Widget>[
                    Container(
                      child: RichText(
                        overflow: TextOverflow.ellipsis,
                        strutStyle: StrutStyle(fontSize: 12.0),
                        text: TextSpan(
                            style: TextStyle(color: Colors.white), text: model.title),
                      ),
                    ),

                    Text("My Button"),
                  ],
                )

Answer 1

Я думаю, что для виджета RichText и Text нет свойства maxLength. Если вы используете класс RichText, у вас будет свойство maxLines, которое можно использовать. Я попытался воссоздать ваш случай и обернул виджет RichText с виджетом Flexible, который позволяет дочернему виджету использовать только минимальное доступное пространство. Но я не смог воспроизвести ошибку, которую вы упомянули. Длинный текст, который я использовал, выводит ellipsis, а button не go из экрана. Обратите внимание, что я также использовал свойство maxLines, которое, если вы установите значение 2, будет переносить длинный текст в новую строку, не удаляя button, и длинный текст будет отображаться как ellipsis. Пример рабочего кода ниже:

body: Center(
          child: Row(
            children: <Widget>[
              Container(
                child: Flexible(
                  child: RichText(
                    maxLines: 2,
                    overflow: TextOverflow.ellipsis,
                    strutStyle: StrutStyle(fontSize: 12.0),
                    text: TextSpan(
                        style: TextStyle(color: Colors.white), text: 'I am using Flutter programming. I need to display a title and a button next to the title. If the text length is less button also should display next to the text. If text length is more i want to fix the text length as maximum 200px and need to show the button next to the title.'),
                  ),
                )

              ),

              Text("My Button"),
            ],
          )
        )

Если вы установите для maxLines значение 1, длинный текст будет переноситься многоточием.

Надеюсь, это поможет.

Answer 2

вы можете использовать Expanded или задать фиксированную ширину контейнера расширенного текста, например, с помощью виджета Expanded: -

Row(
                            children: <Widget>[
                              Expanded(
                                child: RichText(
                                  overflow: TextOverflow.ellipsis,
                                  strutStyle: StrutStyle(fontSize: 12.0),
                                  text: TextSpan(
                                      style: TextStyle(color: Colors.white), text: model.title),
                                ),
                              ),

                              Text("My Button"),
                            ],
                          )