美文网首页Flutter
flutter UI适配

flutter UI适配

作者: 毛小兔的头发还在吗 | 来源:发表于2021-08-19 17:52 被阅读0次

    在lib文件夹下添加一个util.dart文件,在文件中写入如下代码:

    ///px转化为rpx
    double toRpx(BuildContext context,double size) {
      double rpx = MediaQuery.of(context).size.width/750;
      return size * rpx;
    

    使用示例:
    在需要使用的文件内
    import 'package:flutter_demo/utils/util.dart';
    在需要使用的地方套一层toRpx()即可

    //toRpx(context,size),这里的size值是以px为单位的
    Widget Content(context) {
      return Container(
        width: toRpx(context, 35),
        height: toRpx(context, 35),
        child: Text(
          'example',
          style:TextStyle(
          fontSize:toRpx(context, 20)
          )
        )
      )
    }
    

    相关文章

      网友评论

        本文标题:flutter UI适配

        本文链接:https://www.haomeiwen.com/subject/xksabltx.html