Текст

Виджет «Текст» используется для отображения текста на экране. Это один из наиболее часто используемых виджетов.

Чтобы добавить виджет «Текст» в ваш проект:

• Перетащите виджет Text с вкладки Base Elements или Most Frequently Used Elements (на панели виджетов) или добавьте его непосредственно из дерева виджетов.
• Чтобы изменить текст, перейдите в редактор свойств (в правой части экрана), найдите текст Hello World и измените его на Welcome.

Панель свойств можно использовать для настройки внешнего вида и поведения вашего виджета.

Здесь приведены инструкции по добавлению подкладок.

Здесь приведены инструкции по настройке выравнивания.

Здесь приведены инструкции по стилизации текста.

Здесь приведены инструкции по изменению высоты строки текста.

Вот как выровнять текст внутри виджета «Текст»:

• Выберите «Текст» в дереве виджетов или в области холста.
• Перейдите в редактор свойств (в правой части экрана) и прокрутите вниз до раздела «Свойства текста«.
• Найдите свойство Выравнивание текста. По умолчанию выбран первый вариант выравнивания — «Выровненный по левому краю«. Щелкните на другом варианте выравнивания, чтобы изменить выравнивание текста.

длинный текст в ограниченном размере. Если вы хотите отобразить весь текст, не изменяя размер шрифта, вы можете включить функцию авторазмера.

Чтобы включить и увидеть авторазмер в действии:

• Поместите виджет «Текст» внутрь виджета «Контейнер» и установите его ширину бесконечной, а высоту — 50.
• Выберите Текст в дереве виджетов или в области холста.
• Перейдите в редактор свойств (в правой части экрана) и прокрутите вниз до раздела «Свойства текста«.
• Прокрутите вниз еще больше, чтобы найти галочку Auto Size и включить ее. (Нажмите на нее).
• Попробуйте написать длинный текст.

Возможно, вы захотите ограничить количество символов, отображаемых внутри виджета «Текст», и заменить лишние символы многоточием или полностью скрыть их.

Чтобы установить замену переполнения текста:

• Выберите Текст в дереве виджетов или в области холста.
• Перейдите в редактор свойств (в правой части экрана) и прокрутите вниз до раздела Свойства текста.
• Прокрутите вниз и, найдя свойство Max character allowed, введите значение, чтобы ограничить количество символов.
• Установите для параметра «Замена переполнения текста» значение «Обрезка/Отсечение» или «Многоточие (…)».

Вот как это выглядит при запуске приложения:

Возможно, вы захотите разрешить своим пользователям копировать текст и вставлять его в другое место. Например, разрешить пользователям копировать идентификатор электронной почты.

Чтобы разрешить копирование текста:

• Выберите Текст в дереве виджетов или в области холста.
• Перейдите на панель свойств (в правой части экрана) и прокрутите вниз до раздела «Свойства текста«.
• Найдите переключатель Selectable и включите его.

Добавление градиентного цвета к тексту придает ему современный вид и ощущение. Вы можете воспользоваться нашими готовыми шаблонами или создать его с нуля.

Вот как это делается:

• Выберите Текст в дереве виджетов или в области холста.
• Перейдите на панель свойств (в правой части экрана) и прокрутите вниз до раздела «Свойства текста«.
• Найдите переключатель Градиент и включите его.
• Чтобы добавить цвета из шаблонов, нажмите на значок и выберите из списка.
• Чтобы добавить свои собственные цвета:
  • Выберите тип среди линейного и радиального. Линейный распределяет цвета горизонтально, а радиальный — по кругу.
  • Если вы выбрали Линейный, укажите Направление, а для Радиального — Радиус.
  • Добавьте/удалите или настройте существующие цвета.

Посмотрите, как установить цвет из переменной в любое свойство цвета этого виджета.

Вы можете захотеть отобразить число с особым форматом. Когда вы показываете большое число (например, 2354000, 4356634444) как оно есть, это создает плохое впечатление для пользователя. Форматирование большого числа помогает повысить удобочитаемость.

Например, показать население как 1 200 000 вместо 1200000 и валюту $2K/$5M вместо $2000/$50000.

Ниже перечислены типы форматирования, которые мы поддерживаем:

Используйте приведенные ниже инструкции для форматирования числа:

1. Выберите виджет Текст, перейдите на панель свойств и нажмите Установить из переменной.
2. Выберите Источник > Доступные параметры, чтобы отобразить значение из переменной типа Integer или Double. (например, Local State > Local State Variable Name).
3. После выбора переменной установите для Available Options (Доступные параметры) значение Number Format (Формат числа), а для Number Format Options (Параметры формата числа) — требуемый тип.
   1. Если вы выбрали Decimal, необходимо также установить Decimal Type. Десятичные значения могут быть показаны двумя способами, т.е. 1,200 (с запятой) и 1.200 (с точкой).
      1. Выберите Автоматически для отображения десятичного значения в зависимости от страны пользователя.
      2. Выберите Точка для десятичной дроби, чтобы показать десятичное значение с точкой (например, 1,200).
      3. Выберите Запятая для десятичной дроби, чтобы показать десятичное значение через запятую (например, 1,200).
   2. Если вы выбрали Custom (Пользовательский):
      1. Найдите поле Custom Format и введите свой формат. Например, ввод ###,###.### преобразует число 123456.789 в 123 456.789, а 000.00 преобразует число 12.786 в 012.79.
      2. В поле ввода Локаль введите локаль, в которой вы хотите отобразить число. (Если оставить это свойство пустым, локаль будет автоматически установлена в соответствии с местоположением пользователя). Подробнее о том, как форматировать число, можно узнать здесь.
   3. Чтобы отобразить это число в валюте, включите переключатель Display as Currency и укажите символ валюты.
   4. (Необязательно) установите значение переменной по умолчанию равным 0.
   5. Нажмите кнопку Подтвердить.

Чтобы выполнить какое-либо действие при щелчке по тексту, добавьте действие в FlutterFlow.

Инструкции по отображению/скрытию виджета находятся здесь.

Чтобы отобразить данные, извлеченные из коллекции Firestore, и документ в виджете Text, убедитесь, что вы:

• Понимаете структурирование базы данных Firebase.
• Выполнили все шаги в разделе «Настройка Firebase» для вашего проекта.
• Извлекли данные из коллекции или документа.
• Наконец, чтобы отобразить данные в виджете Text, выполните следующие шаги.