Блог

Я пытаюсь использовать color fontWeight и fontFamily с style: style.copyWith помощью пользовательского шрифта, который я пытаюсь использовать Vonique , я импортировал его вот так в pubspec.yaml

 fonts:
       - family: Vonique
         fonts: 
           - assets: fonts/Vonique-64-Bold-Italic.ttf
           - assets: fonts/Vonique-64-Italic.ttf
           - assets: fonts/Vonique-64-Bold.ttf
           - assets: fonts/Vonique-64.ttf

  

Это правильный способ его импорта?

Я пробовал это как с «, так и без», по-прежнему не меняет шрифт текста.

 Text('Login',
 style: style.copyWith(
   color: Colors.redAccent, fontWeight: FontWeight.bold, fontFamily: 'Vonique'
),
),
  

и

 Text('Login',
 style: style.copyWith(
   color: Colors.redAccent, fontWeight: FontWeight.bold, fontFamily: Vonique
),
),
  

Я хочу, чтобы шрифт выглядел так, как здесь https://www.dafont.com/vonique-64.font но это не похоже на то, что было раньше.

Если вы хотите применить шрифт к тексту, вы не используете copyWith. Просто задайте свой стиль, используя новый TextStyle.

 Text('Login', style: TextStyle(fontFamily: 'Vonique',  fontWeight: FontWeight.bold))
  

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

 MaterialApp(
  title: 'Flutter Demo',
  theme: ThemeData(
     // Uncomment in phase 3 to apply white to text
    textTheme: Theme.of(context).textTheme.apply(
      bodyColor: Colors.white,
      displayColor: Colors.white
    ),
  ),
  home: HomeSingleFile(),
);
  

На том же примечании, если у вас есть существующий стиль, который вы хотите применить с некоторыми дополнительными изменениями, используйте метод .apply вместо copyWith .

Не забудьте остановить отладку приложения и снова запустить ваше приложение. Если вы этого не сделаете, изменения, внесенные вами для шрифтов, pubspec.yaml не будут видны с Hot Reload или даже Hot Restart .

     fonts:
      - family: Source Sans Pro
      fonts:
        - asset: fonts/SourceSansPro-Regular.ttf
        weight: 400
        - asset: fonts/SourceSansPro-SemiBold.ttf
        weight: 600
        - asset: fonts/SourceSansPro-Bold.ttf
        weight: 700
        - asset: fonts/SourceSansPro-Black.ttf
        weight: 900
  

Причина, по которой я указал вес под каждым шрифтом, заключается в том, что это позволяет FontWeight.w400 , например, ссылаться на обычный и FontWeight.w900 черный.

Вот как я использовал его в своем коде:

     Text("Planning",
         style: TextStyle(
         color: Color(0xFF43b3e0),
         fontFamily: "Source Sans Pro",  // <- Looks up the specified font in pubspec.yaml
         fontWeight: FontWeight.w700,    // <- uses the Bold font weight
         fontSize: 28.0),
    ),
  

Чтобы установить пользовательский шрифт в текстовом поле: (Используйте его с одинарными кавычками — правильный метод)

 Text(
  'I like custom fonts',
  style: TextStyle(fontFamily: 'Vonique'),
);
  

Чтобы задать пользовательский шрифт с размером шрифта:

 Text(
  'I like custom fonts',
  style: TextStyle(
            fontFamily: 'Vonique',
            fontSize: 20.0,
         ),
);
  

Если вы хотите определить вес шрифта, вы можете определить его в файле pubspec.yaml, например, как показано ниже:

 flutter:
  fonts:
    - family: Vonique
      fonts:
        - asset: Vonique-64-Bold-Italic.ttf
          weight: 500
  

Если мы используем пакет google_fonts, то .ttf файлы не нужно хранить в папке assets и отображать в pubspec. Вместо этого они извлекаются один раз через HTTP во время выполнения и кэшируются в файловой системе приложения.

 Text(
  'This is Fonts',
  style: GoogleFonts.lato(
    textStyle: TextStyle(color: Colors.blue, letterSpacing: .5),
  ),
),