如何使 flutter app 字体响应平板电脑？

Question

**flutter app need to make responsive for tablet , how to write if ---------------------- size condition can u help me **

Widget build(BuildContext context) {
        var screenSize = MediaQuery.of(context).size;
        return WillPopScope(
          onWillPop: _onWillPop,
          child: Scaffold(
            backgroundColor: Constant.BLACK_COLOR,
            appBar: AppBar(
              centerTitle: true,


    ******this is my example code , i need to make bigger font only in tablet ******

我尝试了 sizer 但没有用我是新手，如果你知道请帮助我

Answer 1

你可以使用flutter_screenutil包

   Text(
     '16sp, will not change with the system.',
      style: TextStyle(
        color: Colors.black,
        fontSize: 16.sp, // this will make font responsive
      ),
    ),

或者您可以使用以下代码识别设备类型

  static bool isMobile(BuildContext context) =>
      MediaQuery.of(context).size.width < 650;

  static bool isTablet(BuildContext context) =>
      MediaQuery.of(context).size.width < 1100 &&
      MediaQuery.of(context).size.width >= 650;

  static bool isDesktop(BuildContext context) =>
      MediaQuery.of(context).size.width >= 1100;

Answer 2

您可以使用 auto_size_text 包来完成：

Container(
  child: ConstrainedBox(
    constraints: BoxConstraints(
      minWidth: MediaQuery.of(context).size.width,
      maxWidth: MediaQuery.of(context).size.width,
      minHeight: MediaQuery.of(context).size.height,
      maxHeight: MediaQuery.of(context).size.height,
    ),
    child: AutoSizeText(
      "yourText",
      style: TextStyle(fontSize: 16.0),
    ),
  ),
);

您可以相应地更改约束，这总体上会使您的应用响应速度更快。

如何使 flutter app 字体响应平板电脑？

how to make flutter app font responsive for tablet?

flutter

responsive