一统天下 flutter - UI: MediaQuery - 获取屏幕的相关信息,使系统设置中的字体大小无效

源码 https://github.com/webabcd/flutter_demo
作者 webabcd

一统天下 flutter - UI: MediaQuery - 获取屏幕的相关信息,使系统设置中的字体大小无效

示例如下:

lib\ui\media_query.dart

/*
 * MediaQuery - 获取屏幕的相关信息,使系统设置中的字体大小无效
 */

import 'package:flutter/material.dart';

import '../helper.dart';

class MediaQueryDemo extends StatefulWidget {
  const MediaQueryDemo({Key? key}) : super(key: key);

  @override
  _MediaQueryDemoState createState() => _MediaQueryDemoState();
}

class _MediaQueryDemoState extends State<MediaQueryDemo> {

  @override
  Widget build(BuildContext context) {

    String message = "";

    /// 获取屏幕的相关信息
    MediaQueryData data = MediaQuery.of(context);
    message = 'size: ${data.size}\n'                              /// 逻辑分辨率
        'padding: ${data.padding}\n'                              /// 设备的安全区域的 padding
        'devicePixelRatio: ${data.devicePixelRatio}\n'            /// 物理分辨率与逻辑分辨率的比值
        '真实分辨率: ${data.size * data.devicePixelRatio}\n'        /// 真实分辨率
        'textScaleFactor: ${data.textScaleFactor}\n'              /// 系统设置中的字体大小
        'platformBrightness: ${data.platformBrightness}\n'        /// 当前处于浅色模式还是深色模式
        'padding: ${data.padding}\n'                              /// 安全区域的尺寸
        'viewInsets: ${data.viewInsets}\n'                        /// 通过 .bottom 获取当前软键盘的高度
        'alwaysUse24HourFormat: ${data.alwaysUse24HourFormat}\n'  /// 是否是 24 小时制
        'orientation: ${data.orientation}';                       /// 当前屏幕的方向

    return Scaffold(
      appBar: AppBar(title: const Text("title"),),
      backgroundColor: Colors.orange,
      body: Column(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        children: [
          MyTextSmall(message),
          MediaQuery(
            // 使系统设置中的字体大小无效,会强制用 textScaleFactor 指定的值代替系统设置中的字体大小
            data: MediaQuery.of(context).copyWith(textScaleFactor: 1.5),
            child: MyTextSmall(message),
          ),
        ],
      ),
    );
  }
}

源码 https://github.com/webabcd/flutter_demo
作者 webabcd

posted @ 2023-04-14 15:47  webabcd  阅读(60)  评论(0编辑  收藏  举报