#2 Советы Flutter + Dart

Перевод статьи #2 Flutter + Dart Tips.

Вторая часть из серии советов по Flutter и Dart.

Вот первая часть советов, если вы ее пропустили: #1 Советы Flutter + Dart.

Сегодня новая порция советов, частью — от автора, но также было получено много хороших советов от коммьюнити.

Ниже вторая часть советов:

4. Используйте стили из тем в виджете Text

Если вы Android разработчик, вы должны были использовать android:textAppearance в ваших TextView и использовали @style/TextAppearance.AppCompat.Body1 и так далее.

Для тех, кому это ничего не говорит: речь идет о заранее настроенном стиле, который позволяет вам стилизовать ваш Text в терминах Material гайдлайна как Title, Body, Caption и т.д.

Итак, как вам реализовать это во Flutter Text виджете?

Это просто, как и все во Flutter. ?

Вам просто нужно передать свой стиль textTheme используя Theme.of(context).textTheme.

Ниже пример кода.

Text(
  “Your Text”,
  style: Theme.of(context).textTheme.title,
),

Text(

“Your Text”,

style: Theme.of(context).textTheme.title,

Здесь мы использовали title.

Вы можете использовать еще много других стилей из темы, как…

Theme.of(context).textTheme.body1
Theme.of(context).textTheme.body2
Theme.of(context).textTheme.button
Theme.of(context).textTheme.caption
...
and Many more
...

Theme.of(context).textTheme.body1

Theme.of(context).textTheme.body2

Theme.of(context).textTheme.button

Theme.of(context).textTheme.caption

...

and Many more

...

Да…

Все работает, но есть проблема. ?

Как кастомизировать такие textTheme?? Например если вы хотите другой цвет или какой-нибудь другой шрифт, тогда что?

Для этого тоже есть решение.

Вам надо просто выполнить функцию merge() с вашей textTheme, как показано ниже.

Theme.of(context)
  .textTheme
  .title
  .merge(TextStyle(color: Colors.red)

Theme.of(context)

.textTheme

.title

.merge(TextStyle(color: Colors.red)

Здесь функция merge сливает уже примененную тему с новым TextStyle.

Есть еще несколько функций, по типу merge().

apply(): создает копию стиля текста, заменяя значения или изменяя в нем указанные свойства.
copyWith(): создает копию стиля текста, но с заменой переданных полей на новые значения.

5. Хотите выполнять задачу периодически в Dart?

Как насчет использования Timer.periodic? Он создаст повторяющийся таймер. Принимает два аргумента, один — duration (продолжительность), а второй — callback (обработчик), который принимает один параметр, Timer.

В Dart есть несколько альтернативных решений для этой ситуации и это одно из них.

Timer.periodic(const Duration(seconds: 2), (Timer timer) {
    print("Flutter");
  });

Timer.periodic(const Duration(seconds: 2), (Timer timer) {

print("Flutter");

});

6. Используйте тернарный оператор вместо if else, чтобы сократить ваш Dart код.

Используйте:

void main() {
  bool isAndroid = true;
  getDeviceType() => isAndroid ? "Android" : "Other";
  print("Device Type: " + getDeviceType());
}

void main() {

bool isAndroid = true;

getDeviceType() => isAndroid ? "Android" : "Other";

print("Device Type: " + getDeviceType());

}

Вместо:

void main() {
  bool isAndroid;
  getDeviceType() {
    if (isAndroid) {
      return "Android";
    } else {
      return "Other";
    }
  }
  print("Device Type: " + getDeviceType());
}

void main() {

bool isAndroid;

getDeviceType() {

if (isAndroid) {

return "Android";

} else {

return "Other";

}

print("Device Type: " + getDeviceType());

}

Это все от автора, но есть несколько хороших советов от других разработчиков из коммьюнити.

Вот некоторые из них:

Шорткаты Flutter IDE от Pooja Bhaumik, содержит список шорткатов, которые вы можете использовать, чтобы ускорить свою Flutter разработку: Flutter — IDE Shortcuts for Faster Development.
Remi Rousselet показал как вы можете использовать sync* чтобы построить динамический список виджетов и избежать null: Quick Tip #5 — sync*, a taste of the future.

. . .

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

. . .

На этом вторая часть советов заканчивается. Следите за обновлениями. Все советы могут быть найдены в репозитории автора “FlutterDartTips” на GitHub.

Хорошего и Флаттерного дня!

Если у вас есть какие-нибудь клевые советы и вы хотите ими поделиться со всем миром — форкайте репозиторий и делайте pull реквест.

. . .

Подписывайтесь на Twitter автора и следите за нашим Twitter’ом для обновлений.

Оригинал https://medium.com/flutter-community/2-flutter-dart-tips-f149ffe83381

←#1 Советы Flutter + Dart ○ #3 Советы Flutter + Dart→

4. Используйте стили из тем в виджете Text

5. Хотите выполнять задачу периодически в Dart?

6. Используйте тернарный оператор вместо if else, чтобы сократить ваш Dart код.

Добавить комментарий Отменить ответ