Как мне использовать шрифты Google для определения темы в flutter

#flutter #fonts #google-fonts

#flutter #шрифты #google-шрифты

Вопрос:

Я новичок в flutter.

Я установил эту библиотеку, чтобы иметь возможность использовать шрифты Google.

Теперь мне нужно сделать это в определении данных темы, и я попробовал так, но это запрещено

 ThemeData appTheme() {
  return ThemeData(
    ...
    fontFamily: GoogleFonts.openSans(),
  );
}

Как мне это сделать? Большое вам спасибо

1. fontFamily ожидает String . Используйте GoogleFonts.openSans().fontFamily .

2. Большое вам спасибо @Riwen, если вы хотите добавить его в качестве ответа, я могу принять его тогда

3. Перепечатал мой комментарий как фактический ответ. Спасибо.

Ответ №1:

Повторная публикация моего комментария: fontFamily ожидает String . Используйте GoogleFonts.openSans().fontFamily .

Ответ №2:

Вставьте приведенный ниже код в свой файл темы и добавьте его в свои тематические данные (textTheme: textTheme)

 final TextTheme textTheme = TextTheme(
  headline1: GoogleFonts.roboto(
      fontSize: 97, fontWeight: FontWeight.w300, letterSpacing: -1.5),
  headline2: GoogleFonts.roboto(
      fontSize: 61, fontWeight: FontWeight.w300, letterSpacing: -0.5),
  headline3: GoogleFonts.roboto(fontSize: 48, fontWeight: FontWeight.w400),
  headline4: GoogleFonts.roboto(
      fontSize: 34, fontWeight: FontWeight.w400, letterSpacing: 0.25),
  headline5: GoogleFonts.roboto(fontSize: 24, fontWeight: FontWeight.w400),
  headline6: GoogleFonts.roboto(
      fontSize: 20, fontWeight: FontWeight.w500, letterSpacing: 0.15),
  subtitle1: GoogleFonts.roboto(
      fontSize: 16, fontWeight: FontWeight.w400, letterSpacing: 0.15),
  subtitle2: GoogleFonts.roboto(
      fontSize: 14, fontWeight: FontWeight.w500, letterSpacing: 0.1),
  bodyText1: GoogleFonts.roboto(
      fontSize: 16, fontWeight: FontWeight.w400, letterSpacing: 0.5),
  bodyText2: GoogleFonts.roboto(
      fontSize: 14, fontWeight: FontWeight.w400, letterSpacing: 0.25),
  button: GoogleFonts.roboto(
      fontSize: 14, fontWeight: FontWeight.w500, letterSpacing: 1.25),
  caption: GoogleFonts.roboto(
      fontSize: 12, fontWeight: FontWeight.w400, letterSpacing: 0.4),
  overline: GoogleFonts.roboto(
      fontSize: 10, fontWeight: FontWeight.w400, letterSpacing: 1.5),
);

В этом видео очень хорошо объясняется, как использовать темы и шрифты в flutter https://youtu.be/stoJpMeS5aY?t=640

1. доступен ли веб-сайт для получения кода, который она показывает в видео?

2. Доступен, вы можете получить код для flutter, web и Android xml. material.io/design/typography/the-type-system.html#type-scale

3. Спасибо. Я должен был дать принятый ответ Riwen, потому что это было именно то, что я спросил

4. Это способ, если вы используете шрифт Google и хотите настроить размеры шрифта.

5. Однако нет необходимости делать это 1 на 1, просто используйте метод, чтобы получить всю текстовую тему для используемого вами шрифта. Например: GoogleFonts.robotoTextTheme() или GoogleFonts.cinzelDecorativeTextTheme()

Ответ №3:

В main.dart файле добавить

  fontFamily: GoogleFonts.poppins().fontFamily,