diff --git a/.packages b/.packages index cc19ec0..5a46098 100644 --- a/.packages +++ b/.packages @@ -1,4 +1,4 @@ -# Generated by pub on 2018-10-17 15:16:22.083978. +# Generated by pub on 2018-10-17 16:39:18.833879. analyzer:file:///C:/Users/Frank/AppData/Roaming/Pub/Cache/hosted/pub.dartlang.org/analyzer-0.32.4/lib/ args:file:///C:/Users/Frank/AppData/Roaming/Pub/Cache/hosted/pub.dartlang.org/args-1.5.0/lib/ async:file:///C:/Users/Frank/AppData/Roaming/Pub/Cache/hosted/pub.dartlang.org/async-2.0.8/lib/ diff --git a/CHANGELOG.md b/CHANGELOG.md index e18f9f9..4715faa 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -9,3 +9,6 @@ ## [0.3.0] - Perfect documentation Width is enlarged relative to the design draft => The ratio of font and width to the size of the design Height is enlarged relative to the design draft => The ratio of height width to the size of the design + +## [0.4.0] - Optimize font adaptation method + diff --git a/README.md b/README.md index 852dd8e..7d90172 100644 --- a/README.md +++ b/README.md @@ -16,7 +16,7 @@ dependencies: flutter: sdk: flutter # add flutter_ScreenUtil - flutter_screenutil: ^0.3.1 + flutter_screenutil: ^0.4.0 ``` ### Add the following imports to your Dart code: @@ -76,8 +76,8 @@ Other related apis： ScreenUtil.statusBarHeight //Status bar height , Notch will be higher Unit px ScreenUtil.textScaleFactory //System font scaling factor - ScreenUtil().scaleWidth //The ratio of font and width to the size of the design - ScreenUtil().scaleHeight //The ratio of height width to the size of the design + ScreenUtil().scaleWidth //Ratio of actual width dp to design draft px + ScreenUtil().scaleHeight //Ratio of actual height dp to design draft px ``` @@ -100,9 +100,9 @@ import 'package:flutter_screenutil/flutter_screenutil.dart'; print( 'Status bar height:${ScreenUtil.statusBarHeight}px'); //Status bar height , Notch will be higher Unit px print( - 'The ratio of font and width to the size of the design:${ScreenUtil().scaleWidth}'); //The width is enlarged relative to the design draft + 'The ratio of font and width to the size of the design:${ScreenUtil().scaleWidth * ScreenUtil.pixelRatio}'); //The width is enlarged relative to the design draft print( - 'The ratio of height width to the size of the design:${ScreenUtil().scaleHeight}'); //The height is enlarged relative to the design draft + 'The ratio of height width to the size of the design:${ScreenUtil().scaleHeight * ScreenUtil.pixelRatio}'); //The height is enlarged relative to the design draft return new Scaffold( appBar: new AppBar( @@ -122,7 +122,7 @@ import 'package:flutter_screenutil/flutter_screenutil.dart'; 'My width:${ScreenUtil().setWidth(375)}dp', style: TextStyle( color: Colors.white, - fontSize: ScreenUtil().setSp(28, false)), + fontSize: ScreenUtil().setSp(12, false)), ), ), Container( @@ -132,7 +132,7 @@ import 'package:flutter_screenutil/flutter_screenutil.dart'; child: Text('My width:${ScreenUtil().setWidth(375)}dp', style: TextStyle( color: Colors.white, - fontSize: ScreenUtil().setSp(28, false))), + fontSize: ScreenUtil().setSp(12, false))), ), ], ), @@ -142,11 +142,11 @@ import 'package:flutter_screenutil/flutter_screenutil.dart'; Text('Bottom safe zone distance:${ScreenUtil.bottomBarHeight}px'), Text('Status bar height:${ScreenUtil.statusBarHeight}px'), Text( - 'The ratio of font and width to the size of the design:${ScreenUtil().scaleWidth}', + 'The ratio of font and width to the size of the design:${ScreenUtil().scaleWidth * ScreenUtil.pixelRatio}', textAlign: TextAlign.center, ), Text( - 'The ratio of height width to the size of the design:${ScreenUtil().scaleHeight}', + 'The ratio of height width to the size of the design:${ScreenUtil().scaleHeight * ScreenUtil.pixelRatio}', textAlign: TextAlign.center, ), SizedBox( @@ -157,13 +157,17 @@ import 'package:flutter_screenutil/flutter_screenutil.dart'; crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( - 'My font size is 28px and will not change with the system.', + 'My font size is 14px on the design draft and will not change with the system.', style: TextStyle( - color: Colors.black, - fontSize: ScreenUtil().setSp(28, false))), - Text('My font size is 28px and will change with the system.', + color: Colors.black, + fontSize: ScreenUtil().setSp(14, false), + )), + Text( + 'My font size is 14px on the design draft and will change with the system.', style: TextStyle( - color: Colors.black, fontSize: ScreenUtil().setSp(28))), + color: Colors.black, + fontSize: ScreenUtil().setSp(14), + )), ], ) ], diff --git a/README_CN.md b/README_CN.md index 8a9db1e..1ce8cea 100644 --- a/README_CN.md +++ b/README_CN.md @@ -19,7 +19,7 @@ dependencies: flutter: sdk: flutter # 添加依赖 - flutter_screenutil: ^0.3.1 + flutter_screenutil: ^0.4.0 ``` ### 在每个使用的地方导入包： @@ -77,8 +77,8 @@ for example: ScreenUtil.statusBarHeight //状态栏高度 刘海屏会更高 单位px ScreenUtil.textScaleFactory //系统字体缩放比例 - ScreenUtil().scaleWidth //字体和宽度相对设计稿放大的比例 - ScreenUtil().scaleHeight //高度相对于设计稿放大的比例 + ScreenUtil().scaleWidth // 实际宽度的dp与设计稿px的比例 + ScreenUtil().scaleHeight // 实际高度的dp与设计稿px的比例 ``` @@ -88,7 +88,7 @@ import 'package:flutter_screenutil/flutter_screenutil.dart'; ... -@override + @override Widget build(BuildContext context) { //设置适配尺寸 (填入设计稿中设备的屏幕尺寸) 假如设计稿是按iPhone6的尺寸设计的(iPhone6 750*1334) ScreenUtil.instance = ScreenUtil(width: 750, height: 1334)..init(context); @@ -100,9 +100,9 @@ import 'package:flutter_screenutil/flutter_screenutil.dart'; print( '状态栏高度:${ScreenUtil.statusBarHeight}px'); //Status bar height , Notch will be higher Unit px print( - '字体和宽度相对设计稿放大的比例:${ScreenUtil().scaleWidth}'); //The width is enlarged relative to the design draft + '实际宽度的dp与设计稿px的比例:${ScreenUtil().scaleWidth * ScreenUtil.pixelRatio}'); //The width is enlarged relative to the design draft print( - '高度相对于设计稿放大的比例:${ScreenUtil().scaleHeight}'); //The height is enlarged relative to the design draft + '实际高度的dp与设计稿px的比例:${ScreenUtil().scaleHeight * ScreenUtil.pixelRatio}'); //The height is enlarged relative to the design draft print('系统的字体缩放比例:${ScreenUtil.textScaleFactory}'); return new Scaffold( @@ -143,11 +143,11 @@ import 'package:flutter_screenutil/flutter_screenutil.dart'; Text('底部安全区距离:${ScreenUtil.bottomBarHeight}px'), Text('状态栏高度:${ScreenUtil.statusBarHeight}px'), Text( - '字体和宽度相对设计稿放大的比例:${ScreenUtil().scaleWidth}', + '实际宽度的dp与设计稿px的比例:${ScreenUtil().scaleWidth * ScreenUtil.pixelRatio}', textAlign: TextAlign.center, ), Text( - '高度相对于设计稿放大的比例:${ScreenUtil().scaleHeight}', + '实际高度的dp与设计稿px的比例:${ScreenUtil().scaleHeight * ScreenUtil.pixelRatio}', textAlign: TextAlign.center, ), SizedBox( @@ -157,13 +157,13 @@ import 'package:flutter_screenutil/flutter_screenutil.dart'; Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ - Text('我的文字大小是28px，不会随着系统的文字大小变化', + Text('我的文字大小是14px，不会随着系统的文字大小变化', style: TextStyle( color: Colors.black, - fontSize: ScreenUtil().setSp(28, false))), - Text('我的文字大小是28px，会随着系统的文字大小变化', + fontSize: ScreenUtil().setSp(14, false))), + Text('我的文字大小是14px，会随着系统的文字大小变化', style: TextStyle( - color: Colors.black, fontSize: ScreenUtil().setSp(28))), + color: Colors.black, fontSize: ScreenUtil().setSp(14))), ], ) ], diff --git a/example/lib/main.dart b/example/lib/main.dart index e33b9a8..d3a25f5 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -41,10 +41,9 @@ class _MyHomePageState extends State { print( 'Status bar height:${ScreenUtil.statusBarHeight}px'); //Status bar height , Notch will be higher Unit px print( - 'The ratio of font and width to the size of the design:${ScreenUtil().scaleWidth}'); //The width is enlarged relative to the design draft + 'Ratio of actual width dp to design draft px:${ScreenUtil().scaleWidth * ScreenUtil.pixelRatio}'); //The width is enlarged relative to the design draft print( - 'The ratio of height width to the size of the design:${ScreenUtil().scaleHeight}'); //The height is enlarged relative to the design draft - + 'Ratio of actual height dp to design draft px:${ScreenUtil().scaleHeight * ScreenUtil.pixelRatio}'); //The height is enlarged relative to the design draft return new Scaffold( appBar: new AppBar( title: new Text(widget.title), @@ -63,7 +62,7 @@ class _MyHomePageState extends State { 'My width:${ScreenUtil().setWidth(375)}dp', style: TextStyle( color: Colors.white, - fontSize: ScreenUtil().setSp(28, false)), + fontSize: ScreenUtil().setSp(12, false)), ), ), Container( @@ -73,7 +72,7 @@ class _MyHomePageState extends State { child: Text('My width:${ScreenUtil().setWidth(375)}dp', style: TextStyle( color: Colors.white, - fontSize: ScreenUtil().setSp(28, false))), + fontSize: ScreenUtil().setSp(12, false))), ), ], ), @@ -83,11 +82,11 @@ class _MyHomePageState extends State { Text('Bottom safe zone distance:${ScreenUtil.bottomBarHeight}px'), Text('Status bar height:${ScreenUtil.statusBarHeight}px'), Text( - 'The ratio of font and width to the size of the design:${ScreenUtil().scaleWidth}', + 'The ratio of font and width to the size of the design:${ScreenUtil().scaleWidth * ScreenUtil.pixelRatio}', textAlign: TextAlign.center, ), Text( - 'The ratio of height width to the size of the design:${ScreenUtil().scaleHeight}', + 'The ratio of height width to the size of the design:${ScreenUtil().scaleHeight * ScreenUtil.pixelRatio}', textAlign: TextAlign.center, ), SizedBox( @@ -98,13 +97,17 @@ class _MyHomePageState extends State { crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( - 'My font size is 28px and will not change with the system.', + 'My font size is 14px on the design draft and will not change with the system.', style: TextStyle( - color: Colors.black, - fontSize: ScreenUtil().setSp(28, false))), - Text('My font size is 28px and will change with the system.', + color: Colors.black, + fontSize: ScreenUtil().setSp(14, false), + )), + Text( + 'My font size is 14px on the design draft and will change with the system.', style: TextStyle( - color: Colors.black, fontSize: ScreenUtil().setSp(28))), + color: Colors.black, + fontSize: ScreenUtil().setSp(14), + )), ], ) ], diff --git a/example/lib/main_zh.dart b/example/lib/main_zh.dart index fa1fd56..f79c394 100644 --- a/example/lib/main_zh.dart +++ b/example/lib/main_zh.dart @@ -40,9 +40,9 @@ class _MyHomePageState extends State { print( '状态栏高度:${ScreenUtil.statusBarHeight}px'); //Status bar height , Notch will be higher Unit px print( - '字体和宽度相对设计稿放大的比例:${ScreenUtil().scaleWidth}'); //The width is enlarged relative to the design draft + '实际宽度的dp与设计稿px的比例:${ScreenUtil().scaleWidth * ScreenUtil.pixelRatio}'); //The width is enlarged relative to the design draft print( - '高度相对于设计稿放大的比例:${ScreenUtil().scaleHeight}'); //The height is enlarged relative to the design draft + '实际高度的dp与设计稿px的比例:${ScreenUtil().scaleHeight * ScreenUtil.pixelRatio}'); //The height is enlarged relative to the design draft print('系统的字体缩放比例:${ScreenUtil.textScaleFactory}'); return new Scaffold( @@ -83,11 +83,11 @@ class _MyHomePageState extends State { Text('底部安全区距离:${ScreenUtil.bottomBarHeight}px'), Text('状态栏高度:${ScreenUtil.statusBarHeight}px'), Text( - '字体和宽度相对设计稿放大的比例:${ScreenUtil().scaleWidth}', + '实际宽度的dp与设计稿px的比例:${ScreenUtil().scaleWidth * ScreenUtil.pixelRatio}', textAlign: TextAlign.center, ), Text( - '高度相对于设计稿放大的比例:${ScreenUtil().scaleHeight}', + '实际高度的dp与设计稿px的比例:${ScreenUtil().scaleHeight * ScreenUtil.pixelRatio}', textAlign: TextAlign.center, ), SizedBox( @@ -97,13 +97,13 @@ class _MyHomePageState extends State { Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ - Text('我的文字大小是28px，不会随着系统的文字大小变化', + Text('我的文字大小是14px，不会随着系统的文字大小变化', style: TextStyle( color: Colors.black, - fontSize: ScreenUtil().setSp(28, false))), - Text('我的文字大小是28px，会随着系统的文字大小变化', + fontSize: ScreenUtil().setSp(14, false))), + Text('我的文字大小是14px，会随着系统的文字大小变化', style: TextStyle( - color: Colors.black, fontSize: ScreenUtil().setSp(28))), + color: Colors.black, fontSize: ScreenUtil().setSp(14))), ], ) ], diff --git a/lib/flutter_screenutil.dart b/lib/flutter_screenutil.dart index 638b2e1..41417a8 100644 --- a/lib/flutter_screenutil.dart +++ b/lib/flutter_screenutil.dart @@ -62,7 +62,7 @@ class ScreenUtil { ///底部安全区距离 static double get bottomBarHeight => _bottomBarHeight * _pixelRatio; - ///相对于设计稿放大的倍数 + ///实际的dp与设计稿px的比例 get scaleWidth => _screenWidth / instance._designWidth; get scaleHeight => _screenHeight / instance._designHeight; @@ -82,6 +82,6 @@ class ScreenUtil { ///@param allowFontScaling 控制字体是否要根据系统的“字体大小”辅助选项来进行缩放。默认值为true。 ///@param allowFontScaling Specifies whether fonts should scale to respect Text Size accessibility settings. The default is true. setSp(int fontSize, [allowFontScaling = true]) => allowFontScaling - ? setWidth(fontSize) * _textScaleFactor - : setWidth(fontSize); + ? setWidth(fontSize) * _pixelRatio * _textScaleFactor + : setWidth(fontSize) * _pixelRatio; } diff --git a/pubspec.yaml b/pubspec.yaml index f19501a..8c6ff7f 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -1,6 +1,6 @@ name: flutter_screenutil description: A flutter plugin for adapting screen and font size.Guaranteed to look good on different models -version: 0.3.1 +version: 0.4.0 author: LiZhuoyuan homepage: https://github.com/OpenFlutter/flutter_ScreenUtil