Samira827
Samira827

Reputation: 63

RichText overriding default font family

I'm working on an app that uses only one font. Therefore I set a default font in the main.dart file.

return MaterialApp(
          localizationsDelegates: AppLocalizations.localizationsDelegates,
          supportedLocales: AppLocalizations.supportedLocales,
          debugShowCheckedModeBanner: false,
          theme: ThemeData(
            fontFamily: 'Diodrum',
            textSelectionTheme: const TextSelectionThemeData(
              cursorColor: lrBlue, //<-- SEE HERE
            ),
          ),
          title: "Hello",

However, I noticed that sometimes on widgets like RichText/TextSpan, the widget ignores the font and instead uses the Flutter default one (Roboto?). For example, here on my Login page:

RichText(
                text: TextSpan(
                  text: 'Not a member yet? ',
                  style: const TextStyle(
                    color: lrDarkBlue,
                    fontSize: 12,
                    fontWeight: FontWeight.w500,
                  ),
                  children: <TextSpan>[
                    TextSpan(
                      text: 'Sign up!',
                      style: const TextStyle(
                        color: lrMediumBlue,
                        fontSize: 12,
                        fontWeight: FontWeight.w700,
                        decoration: TextDecoration.underline,
                      ),
                      recognizer: TapGestureRecognizer()
                        ..onTap = () {
                          Navigator.pushNamed(context, '/signup');
                        },
                    ),
                  ],
                ),
              ),

This is the result. The button has a correct font, but not the text under it.

enter image description here

I tested it by manually specifying the font and the text changed to the proper font. But by default it ignores the default font set in ThemeData.

Is it just a thing of RichText/TextSpan and I'll have to manually specify it for these widgets or is it a bug and it shouldn't happen?

Upvotes: 5

Views: 2023

Answers (1)

powerman23rus
powerman23rus

Reputation: 1583

For applying for RichText a default TextStyle, just use Text.rich:

Text.rich(
  TextSpan(
    children: [
      TextSpan(text: 'Aloha '),
      TextSpan(
        text: ' my friend',
        style: TextStyle(fontWeight: FontWeight.bold),
      ),
    ],
  ),
)

Upvotes: 17

Related Questions