如何在MaterialApp主题中设置fontSize的MediaQuery textScaleFactor [英] How to set MediaQuery textScaleFactor of fontSize in MaterialApp theme

问题描述

我想在MaterialApp主题中设置MediaQuery，以便在用户更改设置的情况下FontSize尊重用户设置.

I want to set MediaQuery inside the MaterialApp Theme so that in case user changes the setting the FontSize respects the user settings.

我尝试创建最终的curlScale = MediaQuery.of(context).textScaleFactor; 并据此使用，在MaterialApp内设置fontSize:20 * curlScale 但出现错误，因为使用不包含MediaQuery的上下文调用了MediaQuery.of()". 我该怎么解决.

I tried creating the final curlScale = MediaQuery.of(context).textScaleFactor; and used accordingly set the fontSize: 20 * curlScale inside the MaterialApp but getting error as "MediaQuery.of() called with a context that does not contain a MediaQuery." How can I solve this.

Widget build(BuildContext context) {
    final curlScale = MediaQuery.of(context).textScaleFactor;
    return MaterialApp(

      title: 'Expense Tracker App',
      theme: ThemeData(
        primarySwatch: Colors.orange,
        accentColor: Colors.limeAccent,
        fontFamily: 'QuickSand',
        errorColor: Colors.red,
        appBarTheme: AppBarTheme(textTheme: ThemeData.light().textTheme.copyWith(
          title: TextStyle(fontFamily: 'Open Sans', fontSize: 16 * curlScale),
          button: TextStyle(color: Colors.white),


          )
          )
      ),
      home: HomePage(),
    );

当用户更改字体设置时，字体大小"应遵循用户设置.

When the user changes the font settings the Fontsize should respects the user settings.

推荐答案

您可以使用以下方法实现此目的: MediaQuery.textScaleFactorOf(context)

You can achieve that by using this: MediaQuery.textScaleFactorOf(context)

例如:

textTheme: ThemeData.light().textTheme.copyWith(
                title: TextStyle(
                  fontFamily: 'OpenSans',
                  fontSize: 18 * MediaQuery.textScaleFactorOf(context), 
                ),

根据文档，此方法

为最近的MediaQuery祖先返回textScaleFactor，如果没有这样的祖先，则返回1.0.

Returns textScaleFactor for the nearest MediaQuery ancestor or 1.0, if no such ancestor exists.

文档:

• https://api.flutter.dev/flutter/widgets/MediaQueryData /textScaleFactor.html
• https://api.flutter.dev/flutter/widgets/MediaQuery /textScaleFactorOf.html

• https://api.flutter.dev/flutter/widgets/MediaQueryData/textScaleFactor.html
• https://api.flutter.dev/flutter/widgets/MediaQuery/textScaleFactorOf.html

这篇关于如何在MaterialApp主题中设置fontSize的MediaQuery textScaleFactor的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！