google_fonts в ThemeData - шрифты не применяются

Я пытаюсь добавить пару google_fonts в ThemeData. Применяется вся моя тема, за исключением шрифтов Google. Почему это? Вот настройка моего проекта:

Тема:

import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';

import 'theme_utils.dart';

MaterialColor primaryColorShades = generateMaterialColor(primaryColor);
MaterialColor accentColorShades = generateMaterialColor(accentColor);

const Color primaryColor = Color(0xFF62d9d5);
const Color accentColor = Color(0xFF27a562);
const Color blueText = Color(0xFF409491);

ThemeData blueTheme = ThemeData(
  colorScheme: const ColorScheme(
      brightness: Brightness.light,
      primary: primaryColor,
      secondary: accentColor,
      surface: Colors.white,
      background: primaryColor,
      error: Colors.red,
      onBackground: Colors.white,
      onError: Colors.white,
      onPrimary: Colors.white,
      onSecondary: Colors.white,
      onSurface: blueText,
      primaryVariant: Colors.white,
      secondaryVariant: Colors.white),
  visualDensity: VisualDensity.standard,
  canvasColor: primaryColor,
  textTheme: GoogleFonts.varelaRoundTextTheme().copyWith(
    headline1: const TextStyle(
        fontSize: 30.0, fontWeight: FontWeight.bold, color: Colors.white),
    subtitle1: TextStyle(
        fontSize: 18.0,
        fontWeight: FontWeight.bold,
        color: Colors.white.withOpacity(0.7)),
    button: GoogleFonts.hind(
        textStyle: const TextStyle(
            fontSize: 12.0, fontWeight: FontWeight.w500, color: blueText)),
  ),
);

main.dart:

import 'package:flutter/material.dart';
import 'package:get/get.dart';

import 'app/routes/app_pages.dart';
import 'app/theme/theme.dart';

void main() {
  runApp(GetMaterialApp(
    title: 'Application',
    initialRoute: AppPages.INITIAL,
    getPages: AppPages.routes,
    theme: blueTheme,
  ));
}

И используйте их, на мой взгляд, так:

Text('Hi there, \nI\'m Vepo',
                style: Theme.of(context).textTheme.headline1,
                textAlign: TextAlign.center),

Text('I can help you find vegan things in your local area',
     style: Theme.of(context).textTheme.subtitle1,
     textAlign: TextAlign.center),

RaisedButton(padding: const EdgeInsets.symmetric(
             vertical: 10, horizontal: 60),
             elevation: 20.00,
             shape: RoundedRectangleBorder(
             borderRadius: BorderRadius.circular(40.0)),
             child: Text(
             'COOL, SIGN ME UP!',
             style: Theme.of(context).textTheme.button,
             ),
             onPressed: () {}),

в моем pubspec.yaml:

flutter:
    uses-material-design: true
    assets:
        - assets/images/
        - google_fonts/

В корне моего проекта:

введите описание изображения здесь

Почему не применяются шрифты?

На странице паба google_fonts кажется, что мне может понадобиться сослаться на контекст из ThemeData, но у меня нет доступа, так как это другой файл, и я действительно не хочу, чтобы ThemeData был встроенным, как в своих документах:

MaterialApp(
  theme: ThemeData(
    textTheme: GoogleFonts.latoTextTheme(
      Theme.of(context).textTheme,
    ),
  ),
);

flutter flutter-theme getx google-fonts
person BeniaminoBaggins    schedule 17.10.2020    source источник
comment
Вы определили шрифты в своем файле pubspec? stackoverflow.com/a/64237403/5882307   -  person OMi Shah    schedule 17.10.2020
comment
@OMiShah Я не думаю, что мне нужно. Из google_fonts Примечание. Поскольку эти файлы указаны как ресурсы, нет необходимости перечислять их в шрифтах. раздел pubspec.yaml. Это может быть сделано, потому что файлы имеют одинаковые имена из Google Fonts API (поэтому не переименовывайте их!)   -  person BeniaminoBaggins    schedule 17.10.2020
comment
Ах, моя ошибка. Я пропустил пакет шрифтов Google.   -  person OMi Shah    schedule 17.10.2020

Ответы (1)


arrow_upward
0
arrow_downward

Я думал, что должен делать что-то по принципу google_fonts, но я этого не делаю. Кажется, что для способа google_fonts нужен контекст для определенных вещей в ThemeData. Переход на флаттер:

в pubspec.yaml:

flutter:
    uses-material-design: true
    fonts:
        - family: VarelaRound
          fonts:
              - asset: assets/fonts/VarelaRound-Regular.ttf

В моей теме:

import 'package:flutter/material.dart';

import 'theme_utils.dart';

MaterialColor primaryColorShades = generateMaterialColor(primaryColor);
MaterialColor accentColorShades = generateMaterialColor(accentColor);

const Color primaryColor = Color(0xFF62d9d5);
const Color accentColor = Color(0xFF27a562);
const Color blueText = Color(0xFF409491);

ThemeData blueTheme = ThemeData(
  colorScheme: const ColorScheme(
      brightness: Brightness.light,
      primary: primaryColor,
      secondary: accentColor,
      surface: Colors.white,
      background: primaryColor,
      error: Colors.red,
      onBackground: Colors.white,
      onError: Colors.white,
      onPrimary: Colors.white,
      onSecondary: Colors.white,
      onSurface: blueText,
      primaryVariant: Colors.white,
      secondaryVariant: Colors.white),
  visualDensity: VisualDensity.standard,
  canvasColor: primaryColor,
  fontFamily: 'varelaRound',
  textTheme: TextTheme(
    headline1: const TextStyle(
        fontSize: 30.0,
        fontWeight: FontWeight.bold,
        color: Colors.white,
        fontFamily: 'varelaRound'),
    subtitle1: TextStyle(
        fontSize: 18.0,
        fontWeight: FontWeight.bold,
        fontFamily: 'varelaRound',
        color: Colors.white.withOpacity(0.7)),
    caption: TextStyle(
        fontSize: 14.0,
        fontWeight: FontWeight.w600,
        fontFamily: 'hind',
        color: Colors.white.withOpacity(0.7)),
    button: const TextStyle(
        fontSize: 12.0,
        fontWeight: FontWeight.w500,
        color: blueText,
        fontFamily: 'hind'),
  ),
);

Затем используйте в представлении так:

Text('Hi there, \nI\'m Vepo',
     style: Theme.of(context).textTheme.headline1,
     textAlign: TextAlign.center),
),
person BeniaminoBaggins    schedule 17.10.2020