Showing
11 changed files
with
99 additions
and
59 deletions
@@ -82,6 +82,7 @@ class MyApp extends StatelessWidget { | @@ -82,6 +82,7 @@ class MyApp extends StatelessWidget { | ||
82 | ScreenUtil().scaleWidth //The ratio of actual width to UI design | 82 | ScreenUtil().scaleWidth //The ratio of actual width to UI design |
83 | ScreenUtil().scaleHeight //The ratio of actual height to UI design | 83 | ScreenUtil().scaleHeight //The ratio of actual height to UI design |
84 | 84 | ||
85 | + ScreenUtil().orientation //Screen orientation | ||
85 | 0.2.sw //0.2 times the screen width | 86 | 0.2.sw //0.2 times the screen width |
86 | 0.5.sh //50% of screen height | 87 | 0.5.sh //50% of screen height |
87 | ``` | 88 | ``` |
@@ -181,11 +182,31 @@ Column( | @@ -181,11 +182,31 @@ Column( | ||
181 | ) | 182 | ) |
182 | ``` | 183 | ``` |
183 | 184 | ||
185 | +#### Setting font does not change with system font size | ||
186 | + | ||
187 | +``` | ||
188 | + MaterialApp( | ||
189 | + debugShowCheckedModeBanner: false, | ||
190 | + title: 'Flutter_ScreenUtil', | ||
191 | + theme: ThemeData( | ||
192 | + primarySwatch: Colors.blue, | ||
193 | + ), | ||
194 | + builder: (context, widget) { | ||
195 | + return MediaQuery( | ||
196 | + ///Setting font does not change with system font size | ||
197 | + data: MediaQuery.of(context).copyWith(textScaleFactor: 1.0), | ||
198 | + child: widget, | ||
199 | + ); | ||
200 | + }, | ||
201 | + home: HomePage(title: 'FlutterScreenUtil Demo'), | ||
202 | + ), | ||
203 | +``` | ||
204 | + | ||
184 | [widget test](https://github.com/OpenFlutter/flutter_screenutil/issues/115) | 205 | [widget test](https://github.com/OpenFlutter/flutter_screenutil/issues/115) |
185 | 206 | ||
186 | ### Example: | 207 | ### Example: |
187 | 208 | ||
188 | -[example demo](https://github.com/OpenFlutter/flutter_screenutil/blob/master/example/lib/main_zh.dart) | 209 | +[example demo](https://github.com/OpenFlutter/flutter_screenutil/blob/master/example/lib/main.dart) |
189 | 210 | ||
190 | ### Effect: | 211 | ### Effect: |
191 | 212 |
@@ -49,24 +49,22 @@ import 'package:flutter_screenutil/flutter_screenutil.dart'; | @@ -49,24 +49,22 @@ import 'package:flutter_screenutil/flutter_screenutil.dart'; | ||
49 | ```dart | 49 | ```dart |
50 | //填入设计稿中设备的屏幕尺寸 | 50 | //填入设计稿中设备的屏幕尺寸 |
51 | 51 | ||
52 | -class HomePage extends StatelessWidget { | ||
53 | - const HomePage({Key key}) : super(key: key); | 52 | +void main() => runApp(MyApp()); |
54 | 53 | ||
54 | +class MyApp extends StatelessWidget { | ||
55 | @override | 55 | @override |
56 | Widget build(BuildContext context) { | 56 | Widget build(BuildContext context) { |
57 | - // 初始化 | ||
58 | - ScreenUtil.init( | ||
59 | - // 设备像素大小(必须在首页中获取) | ||
60 | - BoxConstraints( | ||
61 | - maxWidth: MediaQuery.of(context).size.width, | ||
62 | - maxHeight: MediaQuery.of(context).size.height, | ||
63 | - ), | ||
64 | - // 设计尺寸 | ||
65 | - designSize: Size(750, 1334), | 57 | + return ScreenUtilInit( |
58 | + designSize: Size(360, 690), | ||
66 | allowFontScaling: false, | 59 | allowFontScaling: false, |
67 | - ); | ||
68 | - return Container( | ||
69 | - child: child, | 60 | + builder: () => MaterialApp( |
61 | + debugShowCheckedModeBanner: false, | ||
62 | + title: 'Flutter_ScreenUtil', | ||
63 | + theme: ThemeData( | ||
64 | + primarySwatch: Colors.blue, | ||
65 | + ), | ||
66 | + home: HomePage(title: 'FlutterScreenUtil Demo'), | ||
67 | + ), | ||
70 | ); | 68 | ); |
71 | } | 69 | } |
72 | } | 70 | } |
@@ -94,6 +92,8 @@ class HomePage extends StatelessWidget { | @@ -94,6 +92,8 @@ class HomePage extends StatelessWidget { | ||
94 | ScreenUtil().scaleWidth // 实际宽度设计稿宽度的比例 | 92 | ScreenUtil().scaleWidth // 实际宽度设计稿宽度的比例 |
95 | ScreenUtil().scaleHeight // 实际高度与设计稿高度度的比例 | 93 | ScreenUtil().scaleHeight // 实际高度与设计稿高度度的比例 |
96 | 94 | ||
95 | + ScreenUtil().orientation //屏幕方向 | ||
96 | + | ||
97 | 0.2.sw //屏幕宽度的0.2倍 | 97 | 0.2.sw //屏幕宽度的0.2倍 |
98 | 0.5.sh //屏幕高度的50% | 98 | 0.5.sh //屏幕高度的50% |
99 | ``` | 99 | ``` |
@@ -182,6 +182,26 @@ Column( | @@ -182,6 +182,26 @@ Column( | ||
182 | ) | 182 | ) |
183 | ``` | 183 | ``` |
184 | 184 | ||
185 | +#### 设置字体不随系统字体大小进行改变 | ||
186 | + | ||
187 | +``` | ||
188 | + MaterialApp( | ||
189 | + debugShowCheckedModeBanner: false, | ||
190 | + title: 'Flutter_ScreenUtil', | ||
191 | + theme: ThemeData( | ||
192 | + primarySwatch: Colors.blue, | ||
193 | + ), | ||
194 | + builder: (context, widget) { | ||
195 | + return MediaQuery( | ||
196 | + ///设置文字大小不随系统设置改变 | ||
197 | + data: MediaQuery.of(context).copyWith(textScaleFactor: 1.0), | ||
198 | + child: widget, | ||
199 | + ); | ||
200 | + }, | ||
201 | + home: HomePage(title: 'FlutterScreenUtil Demo'), | ||
202 | + ), | ||
203 | +``` | ||
204 | + | ||
185 | 205 | ||
186 | [widget test](https://github.com/OpenFlutter/flutter_screenutil/issues/115) | 206 | [widget test](https://github.com/OpenFlutter/flutter_screenutil/issues/115) |
187 | 207 |
@@ -84,6 +84,8 @@ class MyApp extends StatelessWidget { | @@ -84,6 +84,8 @@ class MyApp extends StatelessWidget { | ||
84 | ScreenUtil().scaleWidth //The ratio of actual width to UI design | 84 | ScreenUtil().scaleWidth //The ratio of actual width to UI design |
85 | ScreenUtil().scaleHeight //The ratio of actual height to UI design | 85 | ScreenUtil().scaleHeight //The ratio of actual height to UI design |
86 | 86 | ||
87 | + ScreenUtil().orientation //Screen orientation | ||
88 | + | ||
87 | 0.2.sw //0,2 vezes a largura da tela | 89 | 0.2.sw //0,2 vezes a largura da tela |
88 | 0.5.sh //50% altura da tela | 90 | 0.5.sh //50% altura da tela |
89 | ``` | 91 | ``` |
@@ -334,7 +336,7 @@ class _HomePageState extends State<HomePage> { | @@ -334,7 +336,7 @@ class _HomePageState extends State<HomePage> { | ||
334 | 336 | ||
335 | ### Exemplo: | 337 | ### Exemplo: |
336 | 338 | ||
337 | -[Demonstração](https://github.com/OpenFlutter/flutter_screenutil/blob/master/example/lib/main_zh.dart) | 339 | +[Demonstração](https://github.com/OpenFlutter/flutter_screenutil/blob/master/example/lib/main.dart) |
338 | 340 | ||
339 | Efeito: | 341 | Efeito: |
340 | 342 |
@@ -5,12 +5,9 @@ export "FLUTTER_APPLICATION_PATH=/Users/lizhuoyuan/Development/Project/flutter_s | @@ -5,12 +5,9 @@ export "FLUTTER_APPLICATION_PATH=/Users/lizhuoyuan/Development/Project/flutter_s | ||
5 | export "FLUTTER_TARGET=/Users/lizhuoyuan/Development/Project/flutter_screenutil/example/lib/main.dart" | 5 | export "FLUTTER_TARGET=/Users/lizhuoyuan/Development/Project/flutter_screenutil/example/lib/main.dart" |
6 | export "FLUTTER_BUILD_DIR=build" | 6 | export "FLUTTER_BUILD_DIR=build" |
7 | export "SYMROOT=${SOURCE_ROOT}/../build/ios" | 7 | export "SYMROOT=${SOURCE_ROOT}/../build/ios" |
8 | -export "OTHER_LDFLAGS=$(inherited) -framework Flutter" | ||
9 | -export "FLUTTER_FRAMEWORK_DIR=/Users/lizhuoyuan/Development/flutter/bin/cache/artifacts/engine/ios" | ||
10 | export "FLUTTER_BUILD_NAME=1.0.0" | 8 | export "FLUTTER_BUILD_NAME=1.0.0" |
11 | export "FLUTTER_BUILD_NUMBER=1" | 9 | export "FLUTTER_BUILD_NUMBER=1" |
12 | -export "DART_DEFINES=flutter.inspector.structuredErrors%3Dtrue" | ||
13 | export "DART_OBFUSCATION=false" | 10 | export "DART_OBFUSCATION=false" |
14 | export "TRACK_WIDGET_CREATION=true" | 11 | export "TRACK_WIDGET_CREATION=true" |
15 | export "TREE_SHAKE_ICONS=false" | 12 | export "TREE_SHAKE_ICONS=false" |
16 | -export "PACKAGE_CONFIG=.packages" | 13 | +export "PACKAGE_CONFIG=/Users/lizhuoyuan/Development/Project/flutter_screenutil/example/.dart_tool/package_config.json" |
@@ -34,8 +34,6 @@ class HomePage extends StatefulWidget { | @@ -34,8 +34,6 @@ class HomePage extends StatefulWidget { | ||
34 | class _HomePageState extends State<HomePage> { | 34 | class _HomePageState extends State<HomePage> { |
35 | @override | 35 | @override |
36 | Widget build(BuildContext context) { | 36 | Widget build(BuildContext context) { |
37 | - //Set the fit size (fill in the screen size of the device in the design) If the design is based on the size of the iPhone6 (iPhone6 750*1334) | ||
38 | - | ||
39 | printScreenInformation(); | 37 | printScreenInformation(); |
40 | return Scaffold( | 38 | return Scaffold( |
41 | appBar: AppBar( | 39 | appBar: AppBar( |
@@ -105,20 +103,17 @@ class _HomePageState extends State<HomePage> { | @@ -105,20 +103,17 @@ class _HomePageState extends State<HomePage> { | ||
105 | textAlign: TextAlign.center, | 103 | textAlign: TextAlign.center, |
106 | ), | 104 | ), |
107 | SizedBox( | 105 | SizedBox( |
108 | - height: 50.h, | 106 | + height: 10.h, |
109 | ), | 107 | ), |
110 | Text('System font scaling factor:${ScreenUtil().textScaleFactor}'), | 108 | Text('System font scaling factor:${ScreenUtil().textScaleFactor}'), |
111 | Column( | 109 | Column( |
112 | crossAxisAlignment: CrossAxisAlignment.start, | 110 | crossAxisAlignment: CrossAxisAlignment.start, |
113 | children: <Widget>[ | 111 | children: <Widget>[ |
114 | - Container( | ||
115 | - height: 32.h, | ||
116 | - child: Text( | 112 | + Text( |
117 | 'My font size is 16sp on the design draft and will not change with the system.', | 113 | 'My font size is 16sp on the design draft and will not change with the system.', |
118 | style: TextStyle( | 114 | style: TextStyle( |
119 | color: Colors.black, | 115 | color: Colors.black, |
120 | - fontSize: 16.sp, | ||
121 | - ), | 116 | + fontSize: 16.nsp, |
122 | ), | 117 | ), |
123 | ), | 118 | ), |
124 | Text( | 119 | Text( |
@@ -147,5 +142,6 @@ class _HomePageState extends State<HomePage> { | @@ -147,5 +142,6 @@ class _HomePageState extends State<HomePage> { | ||
147 | print('System font scaling:${ScreenUtil().textScaleFactor}'); | 142 | print('System font scaling:${ScreenUtil().textScaleFactor}'); |
148 | print('0.5 times the screen width:${0.5.sw}dp'); | 143 | print('0.5 times the screen width:${0.5.sw}dp'); |
149 | print('0.5 times the screen height:${0.5.sh}dp'); | 144 | print('0.5 times the screen height:${0.5.sh}dp'); |
145 | + print('Screen orientation:${ScreenUtil().orientation}'); | ||
150 | } | 146 | } |
151 | } | 147 | } |
@@ -8,7 +8,7 @@ class MyApp extends StatelessWidget { | @@ -8,7 +8,7 @@ class MyApp extends StatelessWidget { | ||
8 | Widget build(BuildContext context) { | 8 | Widget build(BuildContext context) { |
9 | //Set the fit size (fill in the screen size of the device in the design) If the design is based on the size of the iPhone6 (iPhone6 750*1334) | 9 | //Set the fit size (fill in the screen size of the device in the design) If the design is based on the size of the iPhone6 (iPhone6 750*1334) |
10 | return ScreenUtilInit( | 10 | return ScreenUtilInit( |
11 | - designSize: Size(750, 1334), | 11 | + designSize: Size(360, 690), |
12 | allowFontScaling: false, | 12 | allowFontScaling: false, |
13 | builder: () => MaterialApp( | 13 | builder: () => MaterialApp( |
14 | debugShowCheckedModeBanner: false, | 14 | debugShowCheckedModeBanner: false, |
@@ -51,9 +51,9 @@ class _HomePageState extends State<HomePage> { | @@ -51,9 +51,9 @@ class _HomePageState extends State<HomePage> { | ||
51 | height: 200.h, | 51 | height: 200.h, |
52 | color: Colors.red, | 52 | color: Colors.red, |
53 | child: Text( | 53 | child: Text( |
54 | - '我的实际宽度:${0.5.sw}dp \n' | ||
55 | - '我的实际高度:${ScreenUtil().setHeight(200)}dp', | ||
56 | - style: TextStyle(color: Colors.white, fontSize: ScreenUtil().setSp(12)), | 54 | + '我的实际宽度:${180.w}dp \n' |
55 | + '我的实际高度:${200.h}dp', | ||
56 | + style: TextStyle(color: Colors.white, fontSize: 12.sp), | ||
57 | ), | 57 | ), |
58 | ), | 58 | ), |
59 | Container( | 59 | Container( |
@@ -64,7 +64,9 @@ class _HomePageState extends State<HomePage> { | @@ -64,7 +64,9 @@ class _HomePageState extends State<HomePage> { | ||
64 | child: Text( | 64 | child: Text( |
65 | '我的设计稿宽度: 180dp \n' | 65 | '我的设计稿宽度: 180dp \n' |
66 | '我的设计稿高度: 200dp', | 66 | '我的设计稿高度: 200dp', |
67 | - style: TextStyle(color: Colors.white, fontSize: ScreenUtil().setSp(12))), | 67 | + style: TextStyle( |
68 | + color: Colors.white, | ||
69 | + fontSize: ScreenUtil().setSp(12))), | ||
68 | ), | 70 | ), |
69 | ], | 71 | ], |
70 | ), | 72 | ), |
@@ -131,10 +133,13 @@ class _HomePageState extends State<HomePage> { | @@ -131,10 +133,13 @@ class _HomePageState extends State<HomePage> { | ||
131 | print('状态栏高度:${ScreenUtil().statusBarHeight}dp'); | 133 | print('状态栏高度:${ScreenUtil().statusBarHeight}dp'); |
132 | print('实际宽度的dp与设计稿px的比例:${ScreenUtil().scaleWidth}'); | 134 | print('实际宽度的dp与设计稿px的比例:${ScreenUtil().scaleWidth}'); |
133 | print('实际高度的dp与设计稿px的比例:${ScreenUtil().scaleHeight}'); | 135 | print('实际高度的dp与设计稿px的比例:${ScreenUtil().scaleHeight}'); |
134 | - print('宽度和字体相对于设计稿放大的比例:${ScreenUtil().scaleWidth * ScreenUtil().pixelRatio}'); | ||
135 | - print('高度相对于设计稿放大的比例:${ScreenUtil().scaleHeight * ScreenUtil().pixelRatio}'); | 136 | + print( |
137 | + '宽度和字体相对于设计稿放大的比例:${ScreenUtil().scaleWidth * ScreenUtil().pixelRatio}'); | ||
138 | + print( | ||
139 | + '高度相对于设计稿放大的比例:${ScreenUtil().scaleHeight * ScreenUtil().pixelRatio}'); | ||
136 | print('系统的字体缩放比例:${ScreenUtil().textScaleFactor}'); | 140 | print('系统的字体缩放比例:${ScreenUtil().textScaleFactor}'); |
137 | print('屏幕宽度的0.5:${0.5.sw}dp'); | 141 | print('屏幕宽度的0.5:${0.5.sw}dp'); |
138 | print('屏幕高度的0.5:${0.5.sh}dp'); | 142 | print('屏幕高度的0.5:${0.5.sh}dp'); |
143 | + print('屏幕方向:${ScreenUtil().orientation}'); | ||
139 | } | 144 | } |
140 | } | 145 | } |
@@ -3,9 +3,8 @@ | @@ -3,9 +3,8 @@ | ||
3 | * email: zhuoyuan93@gmail.com | 3 | * email: zhuoyuan93@gmail.com |
4 | */ | 4 | */ |
5 | 5 | ||
6 | -import 'dart:ui' as ui; | ||
7 | - | ||
8 | import 'dart:math'; | 6 | import 'dart:math'; |
7 | +import 'dart:ui' as ui; | ||
9 | 8 | ||
10 | import 'package:flutter/material.dart'; | 9 | import 'package:flutter/material.dart'; |
11 | 10 | ||
@@ -21,6 +20,9 @@ class ScreenUtil { | @@ -21,6 +20,9 @@ class ScreenUtil { | ||
21 | /// allowFontScaling Specifies whether fonts should scale to respect Text Size accessibility settings. The default is false. | 20 | /// allowFontScaling Specifies whether fonts should scale to respect Text Size accessibility settings. The default is false. |
22 | late bool allowFontScaling; | 21 | late bool allowFontScaling; |
23 | 22 | ||
23 | + ///屏幕方向 | ||
24 | + static late Orientation _orientation; | ||
25 | + | ||
24 | static late double _pixelRatio; | 26 | static late double _pixelRatio; |
25 | static late double _textScaleFactor; | 27 | static late double _textScaleFactor; |
26 | static late double _screenWidth; | 28 | static late double _screenWidth; |
@@ -36,8 +38,7 @@ class ScreenUtil { | @@ -36,8 +38,7 @@ class ScreenUtil { | ||
36 | 38 | ||
37 | static void init( | 39 | static void init( |
38 | BoxConstraints constraints, | 40 | BoxConstraints constraints, |
39 | - Orientation orientation, | ||
40 | - { | 41 | + Orientation orientation, { |
41 | Size designSize = defaultSize, | 42 | Size designSize = defaultSize, |
42 | bool allowFontScaling = false, | 43 | bool allowFontScaling = false, |
43 | }) { | 44 | }) { |
@@ -45,10 +46,12 @@ class ScreenUtil { | @@ -45,10 +46,12 @@ class ScreenUtil { | ||
45 | _instance | 46 | _instance |
46 | ..uiSize = designSize | 47 | ..uiSize = designSize |
47 | ..allowFontScaling = allowFontScaling; | 48 | ..allowFontScaling = allowFontScaling; |
48 | - if(orientation == Orientation.portrait){ | 49 | + |
50 | + _orientation = orientation; | ||
51 | + if (orientation == Orientation.portrait) { | ||
49 | _screenWidth = constraints.maxWidth; | 52 | _screenWidth = constraints.maxWidth; |
50 | _screenHeight = constraints.maxHeight; | 53 | _screenHeight = constraints.maxHeight; |
51 | - }else{ | 54 | + } else { |
52 | _screenWidth = constraints.maxHeight; | 55 | _screenWidth = constraints.maxHeight; |
53 | _screenHeight = constraints.maxWidth; | 56 | _screenHeight = constraints.maxWidth; |
54 | } | 57 | } |
@@ -60,6 +63,10 @@ class ScreenUtil { | @@ -60,6 +63,10 @@ class ScreenUtil { | ||
60 | _textScaleFactor = window.textScaleFactor; | 63 | _textScaleFactor = window.textScaleFactor; |
61 | } | 64 | } |
62 | 65 | ||
66 | + ///获取屏幕方向 | ||
67 | + ///Get screen orientation | ||
68 | + Orientation get orientation => _orientation; | ||
69 | + | ||
63 | /// 每个逻辑像素的字体像素数,字体的缩放比例 | 70 | /// 每个逻辑像素的字体像素数,字体的缩放比例 |
64 | /// The number of font pixels for each logical pixel. | 71 | /// The number of font pixels for each logical pixel. |
65 | double get textScaleFactor => _textScaleFactor; | 72 | double get textScaleFactor => _textScaleFactor; |
@@ -119,12 +126,7 @@ class ScreenUtil { | @@ -119,12 +126,7 @@ class ScreenUtil { | ||
119 | ///Font size adaptation method | 126 | ///Font size adaptation method |
120 | ///- [fontSize] The size of the font on the UI design, in dp. | 127 | ///- [fontSize] The size of the font on the UI design, in dp. |
121 | ///- [allowFontScaling] | 128 | ///- [allowFontScaling] |
122 | - double setSp(num fontSize, {bool? allowFontScalingSelf}) => | ||
123 | - allowFontScalingSelf == null | ||
124 | - ? (allowFontScaling | ||
125 | - ? (fontSize * scaleText) * _textScaleFactor | ||
126 | - : (fontSize * scaleText)) | ||
127 | - : (allowFontScalingSelf | ||
128 | - ? (fontSize * scaleText) * _textScaleFactor | ||
129 | - : (fontSize * scaleText)); | 129 | + double setSp(num fontSize, {bool? allowFontScalingSelf}) => allowFontScalingSelf == null |
130 | + ? (allowFontScaling ? (fontSize * scaleText) * _textScaleFactor : (fontSize * scaleText)) | ||
131 | + : (allowFontScalingSelf ? (fontSize * scaleText) * _textScaleFactor : (fontSize * scaleText)); | ||
130 | } | 132 | } |
1 | -import 'package:flutter/widgets.dart'; | 1 | +import 'package:flutter/material.dart'; |
2 | +import 'package:flutter_screenutil/screen_util.dart'; | ||
2 | 3 | ||
3 | -import 'screenutil.dart'; | ||
4 | 4 | ||
5 | class ScreenUtilInit extends StatelessWidget { | 5 | class ScreenUtilInit extends StatelessWidget { |
6 | /// A helper widget that initializes [ScreenUtil] | 6 | /// A helper widget that initializes [ScreenUtil] |
@@ -21,11 +21,9 @@ class ScreenUtilInit extends StatelessWidget { | @@ -21,11 +21,9 @@ class ScreenUtilInit extends StatelessWidget { | ||
21 | 21 | ||
22 | @override | 22 | @override |
23 | Widget build(BuildContext context) { | 23 | Widget build(BuildContext context) { |
24 | - return LayoutBuilder( | ||
25 | - builder: (_, BoxConstraints constraints) { | 24 | + return LayoutBuilder(builder: (_, BoxConstraints constraints) { |
26 | return OrientationBuilder( | 25 | return OrientationBuilder( |
27 | builder: (_, Orientation orientation) { | 26 | builder: (_, Orientation orientation) { |
28 | - // ignore: missing_return | ||
29 | if (constraints.maxWidth != 0) { | 27 | if (constraints.maxWidth != 0) { |
30 | ScreenUtil.init( | 28 | ScreenUtil.init( |
31 | constraints, | 29 | constraints, |
@@ -37,7 +35,6 @@ class ScreenUtilInit extends StatelessWidget { | @@ -37,7 +35,6 @@ class ScreenUtilInit extends StatelessWidget { | ||
37 | return builder(); | 35 | return builder(); |
38 | }, | 36 | }, |
39 | ); | 37 | ); |
40 | - }, | ||
41 | - ); | 38 | + }); |
42 | } | 39 | } |
43 | } | 40 | } |
-
Please register or login to post a comment