Showing
8 changed files
with
309 additions
and
348 deletions
@@ -5,7 +5,12 @@ | @@ -5,7 +5,12 @@ | ||
5 | * @LastEditTime: 2020年6月20日 11:20:02 | 5 | * @LastEditTime: 2020年6月20日 11:20:02 |
6 | * @Description: Update log | 6 | * @Description: Update log |
7 | --> | 7 | --> |
8 | - | 8 | +# 3.0.0 |
9 | +**BREAKING CHANGES** | ||
10 | +- `BuildContext` is no more required while initializing. i.e. ScreenUtil.init(~~context~~) | ||
11 | +- Initialize size of design draft using `designSize` instead of width & height. | ||
12 | +- All the static methods are now member methods. | ||
13 | + | ||
9 | # 2.3.1 | 14 | # 2.3.1 |
10 | - add textStyle Example. | 15 | - add textStyle Example. |
11 | 16 |
@@ -24,7 +24,7 @@ dependencies: | @@ -24,7 +24,7 @@ dependencies: | ||
24 | flutter: | 24 | flutter: |
25 | sdk: flutter | 25 | sdk: flutter |
26 | # add flutter_screenutil | 26 | # add flutter_screenutil |
27 | - flutter_screenutil: ^2.3.0 | 27 | + flutter_screenutil: ^3.0.0 |
28 | ``` | 28 | ``` |
29 | 29 | ||
30 | ### Add the following imports to your Dart code: | 30 | ### Add the following imports to your Dart code: |
@@ -36,26 +36,25 @@ import 'package:flutter_screenutil/flutter_screenutil.dart'; | @@ -36,26 +36,25 @@ import 'package:flutter_screenutil/flutter_screenutil.dart'; | ||
36 | 36 | ||
37 | |Property|Type|Default Value|Description| | 37 | |Property|Type|Default Value|Description| |
38 | |:---|:---|:---|:---| | 38 | |:---|:---|:---|:---| |
39 | -|width|double|1080px|The width of the device in the design draft, in px| | ||
40 | -|height|double|1920px|The height of the device in the design draft, in px| | 39 | +|designSize|Size|Size(1080, 1920)|The size of the device in the design draft, in px| |
41 | |allowFontScaling|bool|false|Sets whether the font size is scaled according to the system's "font size" assist option| | 40 | |allowFontScaling|bool|false|Sets whether the font size is scaled according to the system's "font size" assist option| |
42 | 41 | ||
43 | ### Initialize and set the fit size and font size to scale according to the system's "font size" accessibility option | 42 | ### Initialize and set the fit size and font size to scale according to the system's "font size" accessibility option |
44 | -Please set the width and height of the design draft before use, the width and height of the design draft (unit px). | ||
45 | -Be sure to set the page in the MaterialApp's home/initialRoute(ie the entry file, just set it once) to ensure that the fit size is set before each use: | 43 | +Please set the size of the design draft before use, the width and height of the design draft (unit px). |
44 | + | ||
46 | 45 | ||
47 | ```dart | 46 | ```dart |
48 | 47 | ||
49 | //fill in the screen size of the device in the design | 48 | //fill in the screen size of the device in the design |
50 | 49 | ||
51 | //default value : width : 1080px , height:1920px , allowFontScaling:false | 50 | //default value : width : 1080px , height:1920px , allowFontScaling:false |
52 | -ScreenUtil.init(context); | 51 | +ScreenUtil.init(); |
53 | 52 | ||
54 | //If the design is based on the size of the iPhone6 (iPhone6 750*1334) | 53 | //If the design is based on the size of the iPhone6 (iPhone6 750*1334) |
55 | -ScreenUtil.init(context, width: 750, height: 1334); | 54 | +ScreenUtil.init(designSize: Size(750, 1334)); |
56 | 55 | ||
57 | //If you want to set the font size is scaled according to the system's "font size" assist option | 56 | //If you want to set the font size is scaled according to the system's "font size" assist option |
58 | -ScreenUtil.init(context, width: 750, height: 1334, allowFontScaling: true); | 57 | +ScreenUtil.init(designSize: Size(750, 1334), allowFontScaling: true); |
59 | 58 | ||
60 | ``` | 59 | ``` |
61 | 60 | ||
@@ -72,12 +71,12 @@ ScreenUtil.init(context, width: 750, height: 1334, allowFontScaling: true); | @@ -72,12 +71,12 @@ ScreenUtil.init(context, width: 750, height: 1334, allowFontScaling: true); | ||
72 | ScreenUtil().setSp(24, allowFontScalingSelf: true) (sdk>=2.6 : 24.ssp) //Adapter font(fonts will scale to respect Text Size accessibility settings) | 71 | ScreenUtil().setSp(24, allowFontScalingSelf: true) (sdk>=2.6 : 24.ssp) //Adapter font(fonts will scale to respect Text Size accessibility settings) |
73 | ScreenUtil().setSp(24, allowFontScalingSelf: false) (sdk>=2.6 : 24.nsp) //Adapter font(fonts will not scale to respect Text Size accessibility settings) | 72 | ScreenUtil().setSp(24, allowFontScalingSelf: false) (sdk>=2.6 : 24.nsp) //Adapter font(fonts will not scale to respect Text Size accessibility settings) |
74 | 73 | ||
75 | - ScreenUtil.pixelRatio //Device pixel density | ||
76 | - ScreenUtil.screenWidth (sdk>=2.6 : 1.wp) //Device width | ||
77 | - ScreenUtil.screenHeight (sdk>=2.6 : 1.hp) //Device height | ||
78 | - ScreenUtil.bottomBarHeight //Bottom safe zone distance, suitable for buttons with full screen | ||
79 | - ScreenUtil.statusBarHeight //Status bar height , Notch will be higher Unit px | ||
80 | - ScreenUtil.textScaleFactor //System font scaling factor | 74 | + ScreenUtil().pixelRatio //Device pixel density |
75 | + ScreenUtil().screenWidth (sdk>=2.6 : 1.wp) //Device width | ||
76 | + ScreenUtil().screenHeight (sdk>=2.6 : 1.hp) //Device height | ||
77 | + ScreenUtil().bottomBarHeight //Bottom safe zone distance, suitable for buttons with full screen | ||
78 | + ScreenUtil().statusBarHeight //Status bar height , Notch will be higher Unit px | ||
79 | + ScreenUtil().textScaleFactor //System font scaling factor | ||
81 | 80 | ||
82 | ScreenUtil().scaleWidth //Ratio of actual width dp to design draft px | 81 | ScreenUtil().scaleWidth //Ratio of actual width dp to design draft px |
83 | ScreenUtil().scaleHeight //Ratio of actual height dp to design draft px | 82 | ScreenUtil().scaleHeight //Ratio of actual height dp to design draft px |
@@ -166,167 +165,11 @@ Column( | @@ -166,167 +165,11 @@ Column( | ||
166 | ) | 165 | ) |
167 | ``` | 166 | ``` |
168 | 167 | ||
169 | -```dart | ||
170 | -//import | ||
171 | -import 'package:flutter/material.dart'; | ||
172 | -import 'package:flutter_screenutil/flutter_screenutil.dart'; | ||
173 | - | ||
174 | -void main() => runApp(MyApp()); | ||
175 | - | ||
176 | -class MyApp extends StatelessWidget { | ||
177 | - @override | ||
178 | - Widget build(BuildContext context) { | ||
179 | - return MaterialApp( | ||
180 | - debugShowCheckedModeBanner: false, | ||
181 | - title: 'Flutter_ScreenUtil', | ||
182 | - theme: ThemeData( | ||
183 | - primarySwatch: Colors.blue, | ||
184 | - ), | ||
185 | - home: MyHomePage(), | ||
186 | - ); | ||
187 | - } | ||
188 | -} | ||
189 | - | ||
190 | -class MyHomePage extends StatefulWidget { | ||
191 | - @override | ||
192 | - _MyHomePageState createState() => _MyHomePageState(); | ||
193 | -} | ||
194 | - | ||
195 | -class _MyHomePageState extends State<MyHomePage> { | ||
196 | - @override | ||
197 | - Widget build(BuildContext context) { | ||
198 | - //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) | ||
199 | - ScreenUtil.init(width: 750, height: 1334, allowFontScaling: false); | ||
200 | - | ||
201 | - return ExampleWidget(title: 'FlutterScreenUtil Demo'); | ||
202 | - } | ||
203 | -} | ||
204 | - | ||
205 | -class ExampleWidget extends StatefulWidget { | ||
206 | - const ExampleWidget({Key key, this.title}) : super(key: key); | ||
207 | - | ||
208 | - final String title; | ||
209 | - | ||
210 | - @override | ||
211 | - _ExampleWidgetState createState() => _ExampleWidgetState(); | ||
212 | -} | ||
213 | - | ||
214 | -class _ExampleWidgetState extends State<ExampleWidget> { | ||
215 | - @override | ||
216 | - Widget build(BuildContext context) { | ||
217 | - printScreenInformation(); | ||
218 | - return Scaffold( | ||
219 | - appBar: AppBar( | ||
220 | - title: Text(widget.title), | ||
221 | - ), | ||
222 | - body: SingleChildScrollView( | ||
223 | - child: Column( | ||
224 | - crossAxisAlignment: CrossAxisAlignment.center, | ||
225 | - children: <Widget>[ | ||
226 | - Row( | ||
227 | - children: <Widget>[ | ||
228 | - Container( | ||
229 | - padding: EdgeInsets.all(ScreenUtil().setWidth(10)), | ||
230 | - width: ScreenUtil().setWidth(375), | ||
231 | - height: ScreenUtil().setHeight(200), | ||
232 | - color: Colors.red, | ||
233 | - child: Text( | ||
234 | - 'My width:${ScreenUtil().setWidth(375)}dp \n' | ||
235 | - 'My height:${ScreenUtil().setHeight(200)}dp', | ||
236 | - style: TextStyle( | ||
237 | - color: Colors.white, fontSize: ScreenUtil().setSp(24)), | ||
238 | - ), | ||
239 | - ), | ||
240 | - Container( | ||
241 | - padding: EdgeInsets.all(ScreenUtil().setWidth(10)), | ||
242 | - width: ScreenUtil().setWidth(375), | ||
243 | - height: ScreenUtil().setHeight(200), | ||
244 | - color: Colors.blue, | ||
245 | - child: Text( | ||
246 | - 'My width:${ScreenUtil().setWidth(375)}dp \n' | ||
247 | - 'My height:${ScreenUtil().setHeight(200)}dp', | ||
248 | - style: TextStyle( | ||
249 | - color: Colors.white, | ||
250 | - fontSize: ScreenUtil().setSp(24))), | ||
251 | - ), | ||
252 | - ], | ||
253 | - ), | ||
254 | - Text('Device width:${ScreenUtil.screenWidth}dp'), | ||
255 | - Text('Device height:${ScreenUtil.screenHeight}dp'), | ||
256 | - Text('Device width:${ScreenUtil.screenWidthPx}px'), | ||
257 | - Text('Device height:${ScreenUtil.screenHeightPx}px'), | ||
258 | - Text('Device pixel density:${ScreenUtil.pixelRatio}'), | ||
259 | - Text('Bottom safe zone distance:${ScreenUtil.bottomBarHeight}dp'), | ||
260 | - Text('Status bar height:${ScreenUtil.statusBarHeight}dp'), | ||
261 | - Text( | ||
262 | - 'Ratio of actual width dp to design draft px:${ScreenUtil().scaleWidth}', | ||
263 | - textAlign: TextAlign.center, | ||
264 | - ), | ||
265 | - Text( | ||
266 | - 'Ratio of actual height dp to design draft px:${ScreenUtil().scaleHeight}', | ||
267 | - textAlign: TextAlign.center, | ||
268 | - ), | ||
269 | - SizedBox( | ||
270 | - height: ScreenUtil().setHeight(100), | ||
271 | - ), | ||
272 | - Text('System font scaling factor:${ScreenUtil.textScaleFactor}'), | ||
273 | - Column( | ||
274 | - crossAxisAlignment: CrossAxisAlignment.start, | ||
275 | - children: <Widget>[ | ||
276 | - Text( | ||
277 | - 'My font size is 24px on the design draft and will not change with the system.', | ||
278 | - style: TextStyle( | ||
279 | - color: Colors.black, | ||
280 | - fontSize: ScreenUtil().setSp(24), | ||
281 | - )), | ||
282 | - Text( | ||
283 | - 'My font size is 24px on the design draft and will change with the system.', | ||
284 | - style: TextStyle( | ||
285 | - color: Colors.black, | ||
286 | - fontSize: ScreenUtil() | ||
287 | - .setSp(24, allowFontScalingSelf: true))), | ||
288 | - ], | ||
289 | - ) | ||
290 | - ], | ||
291 | - ), | ||
292 | - ), | ||
293 | - floatingActionButton: FloatingActionButton( | ||
294 | - child: Icon(Icons.title), | ||
295 | - onPressed: () { | ||
296 | - ScreenUtil.init(width: 1500, height: 1334, allowFontScaling: false); | ||
297 | - setState(() {}); | ||
298 | - }, | ||
299 | - ), | ||
300 | - ); | ||
301 | - } | ||
302 | - | ||
303 | - void printScreenInformation() { | ||
304 | - print('Device width dp:${ScreenUtil.screenWidth}'); //Device width | ||
305 | - print('Device height dp:${ScreenUtil.screenHeight}'); //Device height | ||
306 | - print( | ||
307 | - 'Device pixel density:${ScreenUtil.pixelRatio}'); //Device pixel density | ||
308 | - print( | ||
309 | - 'Bottom safe zone distance dp:${ScreenUtil.bottomBarHeight}'); //Bottom safe zone distance,suitable for buttons with full screen | ||
310 | - print( | ||
311 | - 'Status bar height dp:${ScreenUtil.statusBarHeight}dp'); //Status bar height , Notch will be higher Unit dp | ||
312 | - print( | ||
313 | - 'Ratio of actual width dp to design draft px:${ScreenUtil().scaleWidth}'); | ||
314 | - print( | ||
315 | - 'Ratio of actual height dp to design draft px:${ScreenUtil().scaleHeight}'); | ||
316 | - print( | ||
317 | - 'The ratio of font and width to the size of the design:${ScreenUtil().scaleWidth * ScreenUtil.pixelRatio}'); | ||
318 | - print( | ||
319 | - 'The ratio of height width to the size of the design:${ScreenUtil().scaleHeight * ScreenUtil.pixelRatio}'); | ||
320 | - } | ||
321 | -} | ||
322 | - | ||
323 | -``` | ||
324 | - | ||
325 | -### example: | 168 | +### Example: |
326 | 169 | ||
327 | [example demo](/example/lib/main.dart) | 170 | [example demo](/example/lib/main.dart) |
328 | 171 | ||
329 | -effect: | 172 | +### Effect: |
330 | 173 | ||
331 |  | 174 |  |
332 |  | 175 |  |
1 | -# example | ||
2 | - | ||
3 | -flutter_screenutil example | 1 | +# Example |
4 | 2 | ||
5 |  | 3 |  |
6 |  | 4 |  |
7 | 5 | ||
8 |  | 6 |  |
9 |  | 7 |  |
10 | -## Getting Started | 8 | + |
9 | +```dart | ||
10 | +void main() { | ||
11 | + WidgetsFlutterBinding.ensureInitialized(); | ||
12 | + //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) | ||
13 | + ScreenUtil.init(designSize: Size(750, 1334), allowFontScaling: false); | ||
14 | + runApp(MyApp()); | ||
15 | +} | ||
16 | + | ||
17 | +class MyApp extends StatelessWidget { | ||
18 | + @override | ||
19 | + Widget build(BuildContext context) { | ||
20 | + return MaterialApp( | ||
21 | + debugShowCheckedModeBanner: false, | ||
22 | + title: 'Flutter_ScreenUtil', | ||
23 | + theme: ThemeData( | ||
24 | + primarySwatch: Colors.blue, | ||
25 | + ), | ||
26 | + home: ExampleWidget(title: 'FlutterScreenUtil Demo'), | ||
27 | + ); | ||
28 | + } | ||
29 | +} | ||
30 | + | ||
31 | +class ExampleWidget extends StatefulWidget { | ||
32 | + const ExampleWidget({Key key, this.title}) : super(key: key); | ||
33 | + | ||
34 | + final String title; | ||
35 | + | ||
36 | + @override | ||
37 | + _ExampleWidgetState createState() => _ExampleWidgetState(); | ||
38 | +} | ||
39 | + | ||
40 | +class _ExampleWidgetState extends State<ExampleWidget> { | ||
41 | + @override | ||
42 | + Widget build(BuildContext context) { | ||
43 | + printScreenInformation(); | ||
44 | + return Scaffold( | ||
45 | + appBar: AppBar( | ||
46 | + title: Text(widget.title), | ||
47 | + ), | ||
48 | + body: SingleChildScrollView( | ||
49 | + child: Column( | ||
50 | + crossAxisAlignment: CrossAxisAlignment.center, | ||
51 | + children: <Widget>[ | ||
52 | + Row( | ||
53 | + children: <Widget>[ | ||
54 | + // Using Extensions | ||
55 | + Container( | ||
56 | + padding: EdgeInsets.all(10.w), | ||
57 | + width: 0.5.wp, | ||
58 | + height: 200.h, | ||
59 | + color: Colors.red, | ||
60 | + child: Text( | ||
61 | + 'My width:${0.5.wp}dp \n' | ||
62 | + 'My height:${200.h}dp', | ||
63 | + style: TextStyle( | ||
64 | + color: Colors.white, | ||
65 | + fontSize: 24.sp, | ||
66 | + ), | ||
67 | + ), | ||
68 | + ), | ||
69 | + // Without using Extensions | ||
70 | + Container( | ||
71 | + padding: EdgeInsets.all(ScreenUtil().setWidth(10)), | ||
72 | + width: ScreenUtil().screenWidth * 0.5, | ||
73 | + height: ScreenUtil().setHeight(200), | ||
74 | + color: Colors.blue, | ||
75 | + child: Text( | ||
76 | + 'My width:${ScreenUtil().screenWidth * 0.5}dp \n' | ||
77 | + 'My height:${ScreenUtil().setHeight(200)}dp', | ||
78 | + style: TextStyle( | ||
79 | + color: Colors.white, | ||
80 | + fontSize: ScreenUtil().setSp(24), | ||
81 | + ), | ||
82 | + ), | ||
83 | + ), | ||
84 | + ], | ||
85 | + ), | ||
86 | + Text('Device width:${ScreenUtil().screenWidthPx}px'), | ||
87 | + Text('Device height:${ScreenUtil().screenHeightPx}px'), | ||
88 | + Text('Device width:${ScreenUtil().screenWidth}dp'), | ||
89 | + Text('Device height:${ScreenUtil().screenHeight}dp'), | ||
90 | + Text('Device pixel density:${ScreenUtil().pixelRatio}'), | ||
91 | + Text('Bottom safe zone distance:${ScreenUtil().bottomBarHeight}dp'), | ||
92 | + Text('Status bar height:${ScreenUtil().statusBarHeight}dp'), | ||
93 | + Text( | ||
94 | + 'Ratio of actual width dp to design draft px:${ScreenUtil().scaleWidth}', | ||
95 | + textAlign: TextAlign.center, | ||
96 | + ), | ||
97 | + Text( | ||
98 | + 'Ratio of actual height dp to design draft px:${ScreenUtil().scaleHeight}', | ||
99 | + textAlign: TextAlign.center, | ||
100 | + ), | ||
101 | + SizedBox( | ||
102 | + height: ScreenUtil().setHeight(100), | ||
103 | + ), | ||
104 | + Text('System font scaling factor:${ScreenUtil().textScaleFactor}'), | ||
105 | + Column( | ||
106 | + crossAxisAlignment: CrossAxisAlignment.start, | ||
107 | + children: <Widget>[ | ||
108 | + Text( | ||
109 | + 'My font size is 24px on the design draft and will not change with the system.', | ||
110 | + style: TextStyle( | ||
111 | + color: Colors.black, | ||
112 | + fontSize: 24.sp, | ||
113 | + ), | ||
114 | + ), | ||
115 | + Text( | ||
116 | + 'My font size is 24px on the design draft and will change with the system.', | ||
117 | + style: ts.t1, | ||
118 | + ), | ||
119 | + ], | ||
120 | + ) | ||
121 | + ], | ||
122 | + ), | ||
123 | + ), | ||
124 | + floatingActionButton: FloatingActionButton( | ||
125 | + child: Icon(Icons.title), | ||
126 | + onPressed: () { | ||
127 | + ScreenUtil.init( | ||
128 | + designSize: Size(1500, 1334), | ||
129 | + allowFontScaling: false, | ||
130 | + ); | ||
131 | + setState(() {}); | ||
132 | + }, | ||
133 | + ), | ||
134 | + ); | ||
135 | + } | ||
136 | + | ||
137 | + void printScreenInformation() { | ||
138 | + print('Device width dp:${ScreenUtil().screenWidth}'); //Device width | ||
139 | + print('Device height dp:${ScreenUtil().screenHeight}'); //Device height | ||
140 | + print( | ||
141 | + 'Device pixel density:${ScreenUtil().pixelRatio}'); //Device pixel density | ||
142 | + print( | ||
143 | + 'Bottom safe zone distance dp:${ScreenUtil().bottomBarHeight}'); //Bottom safe zone distance,suitable for buttons with full screen | ||
144 | + print( | ||
145 | + 'Status bar height px:${ScreenUtil().statusBarHeight}dp'); //Status bar height , Notch will be higher Unit px | ||
146 | + print( | ||
147 | + 'Ratio of actual width dp to design draft px:${ScreenUtil().scaleWidth}'); | ||
148 | + print( | ||
149 | + 'Ratio of actual height dp to design draft px:${ScreenUtil().scaleHeight}'); | ||
150 | + print( | ||
151 | + 'The ratio of font and width to the size of the design:${ScreenUtil().scaleWidth * ScreenUtil().pixelRatio}'); | ||
152 | + print( | ||
153 | + 'The ratio of height width to the size of the design:${ScreenUtil().scaleHeight * ScreenUtil().pixelRatio}'); | ||
154 | + print('System font scaling:${ScreenUtil().textScaleFactor}'); | ||
155 | + print('0.5 times the screen width:${0.5.wp}'); | ||
156 | + print('0.5 times the screen height:${0.5.hp}'); | ||
157 | + } | ||
158 | +} | ||
159 | +``` | ||
11 | 160 |
1 | import 'dart:ui'; | 1 | import 'dart:ui'; |
2 | 2 | ||
3 | -import 'package:example/text_style.dart'; | ||
4 | import 'package:flutter/material.dart'; | 3 | import 'package:flutter/material.dart'; |
5 | import 'package:flutter_screenutil/flutter_screenutil.dart'; | 4 | import 'package:flutter_screenutil/flutter_screenutil.dart'; |
6 | 5 | ||
7 | -void main() => runApp(MyApp()); | 6 | +import 'text_style.dart'; |
7 | + | ||
8 | +void main() { | ||
9 | + WidgetsFlutterBinding.ensureInitialized(); | ||
10 | + //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) | ||
11 | + ScreenUtil.init(designSize: Size(750, 1334), allowFontScaling: false); | ||
12 | + runApp(MyApp()); | ||
13 | +} | ||
8 | 14 | ||
9 | class MyApp extends StatelessWidget { | 15 | class MyApp extends StatelessWidget { |
10 | @override | 16 | @override |
@@ -15,20 +21,11 @@ class MyApp extends StatelessWidget { | @@ -15,20 +21,11 @@ class MyApp extends StatelessWidget { | ||
15 | theme: ThemeData( | 21 | theme: ThemeData( |
16 | primarySwatch: Colors.blue, | 22 | primarySwatch: Colors.blue, |
17 | ), | 23 | ), |
18 | - home: MyHomePage(), | 24 | + home: ExampleWidget(title: 'FlutterScreenUtil Demo'), |
19 | ); | 25 | ); |
20 | } | 26 | } |
21 | } | 27 | } |
22 | 28 | ||
23 | -class MyHomePage extends StatelessWidget { | ||
24 | - @override | ||
25 | - Widget build(BuildContext context) { | ||
26 | - //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) | ||
27 | - ScreenUtil.init(context, width: 750, height: 1334, allowFontScaling: false); | ||
28 | - return ExampleWidget(title: 'FlutterScreenUtil Demo'); | ||
29 | - } | ||
30 | -} | ||
31 | - | ||
32 | class ExampleWidget extends StatefulWidget { | 29 | class ExampleWidget extends StatefulWidget { |
33 | const ExampleWidget({Key key, this.title}) : super(key: key); | 30 | const ExampleWidget({Key key, this.title}) : super(key: key); |
34 | 31 | ||
@@ -52,39 +49,45 @@ class _ExampleWidgetState extends State<ExampleWidget> { | @@ -52,39 +49,45 @@ class _ExampleWidgetState extends State<ExampleWidget> { | ||
52 | children: <Widget>[ | 49 | children: <Widget>[ |
53 | Row( | 50 | Row( |
54 | children: <Widget>[ | 51 | children: <Widget>[ |
52 | + // Using Extensions | ||
55 | Container( | 53 | Container( |
56 | - padding: EdgeInsets.all(ScreenUtil().setWidth(10)), | ||
57 | - width: 375.w, | 54 | + padding: EdgeInsets.all(10.w), |
55 | + width: 0.5.wp, | ||
58 | height: 200.h, | 56 | height: 200.h, |
59 | color: Colors.red, | 57 | color: Colors.red, |
60 | child: Text( | 58 | child: Text( |
61 | - 'My width:${375.w}dp \n' | 59 | + 'My width:${0.5.wp}dp \n' |
62 | 'My height:${200.h}dp', | 60 | 'My height:${200.h}dp', |
63 | style: TextStyle( | 61 | style: TextStyle( |
64 | - color: Colors.white, fontSize: ScreenUtil().setSp(24)), | 62 | + color: Colors.white, |
63 | + fontSize: 24.sp, | ||
64 | + ), | ||
65 | ), | 65 | ), |
66 | ), | 66 | ), |
67 | + // Without using Extensions | ||
67 | Container( | 68 | Container( |
68 | padding: EdgeInsets.all(ScreenUtil().setWidth(10)), | 69 | padding: EdgeInsets.all(ScreenUtil().setWidth(10)), |
69 | - width: ScreenUtil().setWidth(375), | 70 | + width: ScreenUtil().screenWidth * 0.5, |
70 | height: ScreenUtil().setHeight(200), | 71 | height: ScreenUtil().setHeight(200), |
71 | color: Colors.blue, | 72 | color: Colors.blue, |
72 | child: Text( | 73 | child: Text( |
73 | - 'My width:${0.5.wp}dp \n' | ||
74 | - 'My height:${ScreenUtil().setHeight(200)}dp', | ||
75 | - style: TextStyle( | ||
76 | - color: Colors.white, | ||
77 | - fontSize: ScreenUtil().setSp(24))), | 74 | + 'My width:${ScreenUtil().screenWidth * 0.5}dp \n' |
75 | + 'My height:${ScreenUtil().setHeight(200)}dp', | ||
76 | + style: TextStyle( | ||
77 | + color: Colors.white, | ||
78 | + fontSize: ScreenUtil().setSp(24), | ||
79 | + ), | ||
80 | + ), | ||
78 | ), | 81 | ), |
79 | ], | 82 | ], |
80 | ), | 83 | ), |
81 | - Text('Device width:${ScreenUtil.screenWidthPx}px'), | ||
82 | - Text('Device height:${ScreenUtil.screenHeightPx}px'), | ||
83 | - Text('Device width:${ScreenUtil.screenWidth}dp'), | ||
84 | - Text('Device height:${ScreenUtil.screenHeight}dp'), | ||
85 | - Text('Device pixel density:${ScreenUtil.pixelRatio}'), | ||
86 | - Text('Bottom safe zone distance:${ScreenUtil.bottomBarHeight}dp'), | ||
87 | - Text('Status bar height:${ScreenUtil.statusBarHeight}dp'), | 84 | + Text('Device width:${ScreenUtil().screenWidthPx}px'), |
85 | + Text('Device height:${ScreenUtil().screenHeightPx}px'), | ||
86 | + Text('Device width:${ScreenUtil().screenWidth}dp'), | ||
87 | + Text('Device height:${ScreenUtil().screenHeight}dp'), | ||
88 | + Text('Device pixel density:${ScreenUtil().pixelRatio}'), | ||
89 | + Text('Bottom safe zone distance:${ScreenUtil().bottomBarHeight}dp'), | ||
90 | + Text('Status bar height:${ScreenUtil().statusBarHeight}dp'), | ||
88 | Text( | 91 | Text( |
89 | 'Ratio of actual width dp to design draft px:${ScreenUtil().scaleWidth}', | 92 | 'Ratio of actual width dp to design draft px:${ScreenUtil().scaleWidth}', |
90 | textAlign: TextAlign.center, | 93 | textAlign: TextAlign.center, |
@@ -96,19 +99,21 @@ class _ExampleWidgetState extends State<ExampleWidget> { | @@ -96,19 +99,21 @@ class _ExampleWidgetState extends State<ExampleWidget> { | ||
96 | SizedBox( | 99 | SizedBox( |
97 | height: ScreenUtil().setHeight(100), | 100 | height: ScreenUtil().setHeight(100), |
98 | ), | 101 | ), |
99 | - Text('System font scaling factor:${ScreenUtil.textScaleFactor}'), | 102 | + Text('System font scaling factor:${ScreenUtil().textScaleFactor}'), |
100 | Column( | 103 | Column( |
101 | crossAxisAlignment: CrossAxisAlignment.start, | 104 | crossAxisAlignment: CrossAxisAlignment.start, |
102 | children: <Widget>[ | 105 | children: <Widget>[ |
103 | Text( | 106 | Text( |
104 | - 'My font size is 24px on the design draft and will not change with the system.', | ||
105 | - style: TextStyle( | ||
106 | - color: Colors.black, | ||
107 | - fontSize: 24.sp, | ||
108 | - )), | 107 | + 'My font size is 24px on the design draft and will not change with the system.', |
108 | + style: TextStyle( | ||
109 | + color: Colors.black, | ||
110 | + fontSize: 24.sp, | ||
111 | + ), | ||
112 | + ), | ||
109 | Text( | 113 | Text( |
110 | - 'My font size is 24px on the design draft and will change with the system.', | ||
111 | - style: ts.t1), | 114 | + 'My font size is 24px on the design draft and will change with the system.', |
115 | + style: ts.t1, | ||
116 | + ), | ||
112 | ], | 117 | ], |
113 | ) | 118 | ) |
114 | ], | 119 | ], |
@@ -117,8 +122,10 @@ class _ExampleWidgetState extends State<ExampleWidget> { | @@ -117,8 +122,10 @@ class _ExampleWidgetState extends State<ExampleWidget> { | ||
117 | floatingActionButton: FloatingActionButton( | 122 | floatingActionButton: FloatingActionButton( |
118 | child: Icon(Icons.title), | 123 | child: Icon(Icons.title), |
119 | onPressed: () { | 124 | onPressed: () { |
120 | - ScreenUtil.init(context, | ||
121 | - width: 1500, height: 1334, allowFontScaling: false); | 125 | + ScreenUtil.init( |
126 | + designSize: Size(1500, 1334), | ||
127 | + allowFontScaling: false, | ||
128 | + ); | ||
122 | setState(() {}); | 129 | setState(() {}); |
123 | }, | 130 | }, |
124 | ), | 131 | ), |
@@ -126,23 +133,23 @@ class _ExampleWidgetState extends State<ExampleWidget> { | @@ -126,23 +133,23 @@ class _ExampleWidgetState extends State<ExampleWidget> { | ||
126 | } | 133 | } |
127 | 134 | ||
128 | void printScreenInformation() { | 135 | void printScreenInformation() { |
129 | - print('Device width dp:${ScreenUtil.screenWidth}'); //Device width | ||
130 | - print('Device height dp:${ScreenUtil.screenHeight}'); //Device height | 136 | + print('Device width dp:${ScreenUtil().screenWidth}'); //Device width |
137 | + print('Device height dp:${ScreenUtil().screenHeight}'); //Device height | ||
131 | print( | 138 | print( |
132 | - 'Device pixel density:${ScreenUtil.pixelRatio}'); //Device pixel density | 139 | + 'Device pixel density:${ScreenUtil().pixelRatio}'); //Device pixel density |
133 | print( | 140 | print( |
134 | - 'Bottom safe zone distance dp:${ScreenUtil.bottomBarHeight}'); //Bottom safe zone distance,suitable for buttons with full screen | 141 | + 'Bottom safe zone distance dp:${ScreenUtil().bottomBarHeight}'); //Bottom safe zone distance,suitable for buttons with full screen |
135 | print( | 142 | print( |
136 | - 'Status bar height px:${ScreenUtil.statusBarHeight}dp'); //Status bar height , Notch will be higher Unit px | 143 | + 'Status bar height px:${ScreenUtil().statusBarHeight}dp'); //Status bar height , Notch will be higher Unit px |
137 | print( | 144 | print( |
138 | 'Ratio of actual width dp to design draft px:${ScreenUtil().scaleWidth}'); | 145 | 'Ratio of actual width dp to design draft px:${ScreenUtil().scaleWidth}'); |
139 | print( | 146 | print( |
140 | 'Ratio of actual height dp to design draft px:${ScreenUtil().scaleHeight}'); | 147 | 'Ratio of actual height dp to design draft px:${ScreenUtil().scaleHeight}'); |
141 | print( | 148 | print( |
142 | - 'The ratio of font and width to the size of the design:${ScreenUtil().scaleWidth * ScreenUtil.pixelRatio}'); | 149 | + 'The ratio of font and width to the size of the design:${ScreenUtil().scaleWidth * ScreenUtil().pixelRatio}'); |
143 | print( | 150 | print( |
144 | - 'The ratio of height width to the size of the design:${ScreenUtil().scaleHeight * ScreenUtil.pixelRatio}'); | ||
145 | - print('System font scaling:${ScreenUtil.textScaleFactor}'); | 151 | + 'The ratio of height width to the size of the design:${ScreenUtil().scaleHeight * ScreenUtil().pixelRatio}'); |
152 | + print('System font scaling:${ScreenUtil().textScaleFactor}'); | ||
146 | print('0.5 times the screen width:${0.5.wp}'); | 153 | print('0.5 times the screen width:${0.5.wp}'); |
147 | print('0.5 times the screen height:${0.5.hp}'); | 154 | print('0.5 times the screen height:${0.5.hp}'); |
148 | } | 155 | } |
1 | -import 'package:example/text_style.dart'; | ||
2 | import 'package:flutter/material.dart'; | 1 | import 'package:flutter/material.dart'; |
3 | import 'package:flutter_screenutil/flutter_screenutil.dart'; | 2 | import 'package:flutter_screenutil/flutter_screenutil.dart'; |
4 | 3 | ||
5 | -void main() => runApp(MyApp()); | 4 | +import 'text_style.dart'; |
5 | + | ||
6 | +void main() { | ||
7 | + WidgetsFlutterBinding.ensureInitialized(); | ||
8 | + //设置适配尺寸 (填入设计稿中设备的屏幕尺寸) 此处假如设计稿是按iPhone6的尺寸设计的(iPhone6 750*1334) | ||
9 | + ScreenUtil.init(designSize: Size(750, 1334), allowFontScaling: false); | ||
10 | + runApp(MyApp()); | ||
11 | +} | ||
6 | 12 | ||
7 | class MyApp extends StatelessWidget { | 13 | class MyApp extends StatelessWidget { |
8 | @override | 14 | @override |
@@ -13,31 +19,11 @@ class MyApp extends StatelessWidget { | @@ -13,31 +19,11 @@ class MyApp extends StatelessWidget { | ||
13 | theme: ThemeData( | 19 | theme: ThemeData( |
14 | primarySwatch: Colors.blue, | 20 | primarySwatch: Colors.blue, |
15 | ), | 21 | ), |
16 | - home: MyHomePage(), | 22 | + home: ExampleWidget(title: 'FlutterScreenUtil示例'), |
17 | ); | 23 | ); |
18 | } | 24 | } |
19 | } | 25 | } |
20 | 26 | ||
21 | -class MyHomePage extends StatefulWidget { | ||
22 | - MyHomePage({Key key, this.title}) : super(key: key); | ||
23 | - | ||
24 | - final String title; | ||
25 | - | ||
26 | - @override | ||
27 | - _MyHomePageState createState() => _MyHomePageState(); | ||
28 | -} | ||
29 | - | ||
30 | -class _MyHomePageState extends State<MyHomePage> { | ||
31 | - @override | ||
32 | - Widget build(BuildContext context) { | ||
33 | - //设置适配尺寸 (填入设计稿中设备的屏幕尺寸) 此处假如设计稿是按iPhone6的尺寸设计的(iPhone6 750*1334) | ||
34 | - | ||
35 | - ScreenUtil.init(context, width: 750, height: 1334, allowFontScaling: false); | ||
36 | - | ||
37 | - return ExampleWidget(title: 'FlutterScreenUtil示例'); | ||
38 | - } | ||
39 | -} | ||
40 | - | ||
41 | class ExampleWidget extends StatefulWidget { | 27 | class ExampleWidget extends StatefulWidget { |
42 | const ExampleWidget({Key key, this.title}) : super(key: key); | 28 | const ExampleWidget({Key key, this.title}) : super(key: key); |
43 | 29 | ||
@@ -87,13 +73,13 @@ class _ExampleWidgetState extends State<ExampleWidget> { | @@ -87,13 +73,13 @@ class _ExampleWidgetState extends State<ExampleWidget> { | ||
87 | ), | 73 | ), |
88 | ], | 74 | ], |
89 | ), | 75 | ), |
90 | - Text('设备宽度:${ScreenUtil.screenWidthPx}px'), | ||
91 | - Text('设备高度:${ScreenUtil.screenHeightPx}px'), | ||
92 | - Text('设备宽度:${ScreenUtil.screenWidth}dp'), | ||
93 | - Text('设备高度:${ScreenUtil.screenHeight}dp'), | ||
94 | - Text('设备的像素密度:${ScreenUtil.pixelRatio}'), | ||
95 | - Text('底部安全区距离:${ScreenUtil.bottomBarHeight}dp'), | ||
96 | - Text('状态栏高度:${ScreenUtil.statusBarHeight}dp'), | 76 | + Text('设备宽度:${ScreenUtil().screenWidthPx}px'), |
77 | + Text('设备高度:${ScreenUtil().screenHeightPx}px'), | ||
78 | + Text('设备宽度:${ScreenUtil().screenWidth}dp'), | ||
79 | + Text('设备高度:${ScreenUtil().screenHeight}dp'), | ||
80 | + Text('设备的像素密度:${ScreenUtil().pixelRatio}'), | ||
81 | + Text('底部安全区距离:${ScreenUtil().bottomBarHeight}dp'), | ||
82 | + Text('状态栏高度:${ScreenUtil().statusBarHeight}dp'), | ||
97 | Text( | 83 | Text( |
98 | '实际宽度的dp与设计稿px的比例:${ScreenUtil().scaleWidth}', | 84 | '实际宽度的dp与设计稿px的比例:${ScreenUtil().scaleWidth}', |
99 | textAlign: TextAlign.center, | 85 | textAlign: TextAlign.center, |
@@ -105,7 +91,7 @@ class _ExampleWidgetState extends State<ExampleWidget> { | @@ -105,7 +91,7 @@ class _ExampleWidgetState extends State<ExampleWidget> { | ||
105 | SizedBox( | 91 | SizedBox( |
106 | height: 100.h, | 92 | height: 100.h, |
107 | ), | 93 | ), |
108 | - Text('系统的字体缩放比例:${ScreenUtil.textScaleFactor}'), | 94 | + Text('系统的字体缩放比例:${ScreenUtil().textScaleFactor}'), |
109 | Column( | 95 | Column( |
110 | crossAxisAlignment: CrossAxisAlignment.start, | 96 | crossAxisAlignment: CrossAxisAlignment.start, |
111 | children: <Widget>[ | 97 | children: <Widget>[ |
@@ -125,8 +111,10 @@ class _ExampleWidgetState extends State<ExampleWidget> { | @@ -125,8 +111,10 @@ class _ExampleWidgetState extends State<ExampleWidget> { | ||
125 | floatingActionButton: FloatingActionButton( | 111 | floatingActionButton: FloatingActionButton( |
126 | child: Icon(Icons.title), | 112 | child: Icon(Icons.title), |
127 | onPressed: () { | 113 | onPressed: () { |
128 | - ScreenUtil.init(context, | ||
129 | - width: 1500, height: 1334, allowFontScaling: false); | 114 | + ScreenUtil.init( |
115 | + designSize: Size(1500, 1334), | ||
116 | + allowFontScaling: false, | ||
117 | + ); | ||
130 | setState(() {}); | 118 | setState(() {}); |
131 | }, | 119 | }, |
132 | ), | 120 | ), |
@@ -134,21 +122,26 @@ class _ExampleWidgetState extends State<ExampleWidget> { | @@ -134,21 +122,26 @@ class _ExampleWidgetState extends State<ExampleWidget> { | ||
134 | } | 122 | } |
135 | 123 | ||
136 | void printScreenInformation() { | 124 | void printScreenInformation() { |
137 | - print('设备宽度:${ScreenUtil.screenWidth}'); //Device width | ||
138 | - print('设备高度:${ScreenUtil.screenHeight}'); //Device height | ||
139 | - print('设备的像素密度:${ScreenUtil.pixelRatio}'); //Device pixel density | 125 | + print('设备宽度:${ScreenUtil().screenWidth}'); //Device width |
126 | + print('设备高度:${ScreenUtil().screenHeight}'); //Device height | ||
127 | + print('设备的像素密度:${ScreenUtil().pixelRatio}'); //Device pixel density | ||
140 | print( | 128 | print( |
141 | - '底部安全区距离:${ScreenUtil.bottomBarHeight}dp'); //Bottom safe zone distance,suitable for buttons with full screen | 129 | + '底部安全区距离:${ScreenUtil().bottomBarHeight}dp', |
130 | + ); //Bottom safe zone distance,suitable for buttons with full screen | ||
142 | print( | 131 | print( |
143 | - '状态栏高度:${ScreenUtil.statusBarHeight}dp'); //Status bar height , Notch will be higher Unit px | 132 | + '状态栏高度:${ScreenUtil().statusBarHeight}dp', |
133 | + ); //Status bar height , Notch will be higher Unit px | ||
144 | 134 | ||
145 | print('实际宽度的dp与设计稿px的比例:${ScreenUtil().scaleWidth}'); | 135 | print('实际宽度的dp与设计稿px的比例:${ScreenUtil().scaleWidth}'); |
146 | print('实际高度的dp与设计稿px的比例:${ScreenUtil().scaleHeight}'); | 136 | print('实际高度的dp与设计稿px的比例:${ScreenUtil().scaleHeight}'); |
147 | 137 | ||
148 | print( | 138 | print( |
149 | - '宽度和字体相对于设计稿放大的比例:${ScreenUtil().scaleWidth * ScreenUtil.pixelRatio}'); | ||
150 | - print('高度相对于设计稿放大的比例:${ScreenUtil().scaleHeight * ScreenUtil.pixelRatio}'); | ||
151 | - print('系统的字体缩放比例:${ScreenUtil.textScaleFactor}'); | 139 | + '宽度和字体相对于设计稿放大的比例:${ScreenUtil().scaleWidth * ScreenUtil().pixelRatio}', |
140 | + ); | ||
141 | + print( | ||
142 | + '高度相对于设计稿放大的比例:${ScreenUtil().scaleHeight * ScreenUtil().pixelRatio}', | ||
143 | + ); | ||
144 | + print('系统的字体缩放比例:${ScreenUtil().textScaleFactor}'); | ||
152 | 145 | ||
153 | print('屏幕宽度的0.5:${0.5.wp}'); | 146 | print('屏幕宽度的0.5:${0.5.wp}'); |
154 | print('屏幕高度的0.5:${0.5.hp}'); | 147 | print('屏幕高度的0.5:${0.5.hp}'); |
@@ -4,91 +4,90 @@ | @@ -4,91 +4,90 @@ | ||
4 | */ | 4 | */ |
5 | 5 | ||
6 | import 'package:flutter/material.dart'; | 6 | import 'package:flutter/material.dart'; |
7 | +import 'package:flutter/scheduler.dart'; | ||
7 | 8 | ||
8 | class ScreenUtil { | 9 | class ScreenUtil { |
9 | static ScreenUtil _instance; | 10 | static ScreenUtil _instance; |
10 | - static const int defaultWidth = 1080; | ||
11 | - static const int defaultHeight = 1920; | 11 | + static const Size defaultSize = Size(1080, 1920); |
12 | 12 | ||
13 | /// UI设计中手机尺寸 , px | 13 | /// UI设计中手机尺寸 , px |
14 | /// Size of the phone in UI Design , px | 14 | /// Size of the phone in UI Design , px |
15 | - num uiWidthPx; | ||
16 | - num uiHeightPx; | 15 | + Size uiSize = defaultSize; |
17 | 16 | ||
18 | /// 控制字体是否要根据系统的“字体大小”辅助选项来进行缩放。默认值为false。 | 17 | /// 控制字体是否要根据系统的“字体大小”辅助选项来进行缩放。默认值为false。 |
19 | /// allowFontScaling Specifies whether fonts should scale to respect Text Size accessibility settings. The default is false. | 18 | /// allowFontScaling Specifies whether fonts should scale to respect Text Size accessibility settings. The default is false. |
20 | - bool allowFontScaling; | ||
21 | - | ||
22 | - static double _screenWidth; | ||
23 | - static double _screenHeight; | ||
24 | - static double _pixelRatio; | ||
25 | - static double _statusBarHeight; | ||
26 | - static double _bottomBarHeight; | ||
27 | - static double _textScaleFactor; | ||
28 | - | ||
29 | - ScreenUtil._(); | ||
30 | - | ||
31 | - factory ScreenUtil() { | ||
32 | - return _instance; | 19 | + bool allowFontScaling = false; |
20 | + | ||
21 | + double _pixelRatio; | ||
22 | + double _screenWidth; | ||
23 | + double _screenHeight; | ||
24 | + double _statusBarHeight; | ||
25 | + double _bottomBarHeight; | ||
26 | + double _textScaleFactor; | ||
27 | + | ||
28 | + ScreenUtil._() { | ||
29 | + final window = SchedulerBinding.instance?.window; | ||
30 | + assert( | ||
31 | + window != null, | ||
32 | + '\nYou need to explicitly call the `WidgetsFlutterBinding.ensureInitialized()`, before initializing ScreenUtil.', | ||
33 | + ); | ||
34 | + _pixelRatio = window.devicePixelRatio; | ||
35 | + _screenWidth = window.physicalSize.width / _pixelRatio; | ||
36 | + _screenHeight = window.physicalSize.height / _pixelRatio; | ||
37 | + _statusBarHeight = window.padding.top; | ||
38 | + _bottomBarHeight = window.padding.bottom; | ||
39 | + _textScaleFactor = window.textScaleFactor; | ||
33 | } | 40 | } |
34 | 41 | ||
35 | - static void init(BuildContext context, | ||
36 | - {num width = defaultWidth, | ||
37 | - num height = defaultHeight, | ||
38 | - bool allowFontScaling = false}) { | ||
39 | - if (_instance == null) { | ||
40 | - _instance = ScreenUtil._(); | ||
41 | - } | ||
42 | - _instance.uiWidthPx = width; | ||
43 | - _instance.uiHeightPx = height; | ||
44 | - _instance.allowFontScaling = allowFontScaling; | ||
45 | - | ||
46 | - MediaQueryData mediaQuery = MediaQuery.of(context); | ||
47 | - _pixelRatio = mediaQuery.devicePixelRatio; | ||
48 | - _screenWidth = mediaQuery.size.width; | ||
49 | - _screenHeight = mediaQuery.size.height; | ||
50 | - _statusBarHeight = mediaQuery.padding.top; | ||
51 | - _bottomBarHeight = mediaQuery.padding.bottom; | ||
52 | - _textScaleFactor = mediaQuery.textScaleFactor; | 42 | + factory ScreenUtil() => _instance; |
43 | + | ||
44 | + static void init({ | ||
45 | + Size designSize = defaultSize, | ||
46 | + bool allowFontScaling = false, | ||
47 | + }) { | ||
48 | + _instance ??= ScreenUtil._(); | ||
49 | + _instance | ||
50 | + ..uiSize = designSize | ||
51 | + ..allowFontScaling = allowFontScaling; | ||
53 | } | 52 | } |
54 | 53 | ||
55 | /// 每个逻辑像素的字体像素数,字体的缩放比例 | 54 | /// 每个逻辑像素的字体像素数,字体的缩放比例 |
56 | /// The number of font pixels for each logical pixel. | 55 | /// The number of font pixels for each logical pixel. |
57 | - static double get textScaleFactor => _textScaleFactor; | 56 | + double get textScaleFactor => _textScaleFactor; |
58 | 57 | ||
59 | /// 设备的像素密度 | 58 | /// 设备的像素密度 |
60 | /// The size of the media in logical pixels (e.g, the size of the screen). | 59 | /// The size of the media in logical pixels (e.g, the size of the screen). |
61 | - static double get pixelRatio => _pixelRatio; | 60 | + double get pixelRatio => _pixelRatio; |
62 | 61 | ||
63 | /// 当前设备宽度 dp | 62 | /// 当前设备宽度 dp |
64 | /// The horizontal extent of this size. | 63 | /// The horizontal extent of this size. |
65 | - static double get screenWidth => _screenWidth; | 64 | + double get screenWidth => _screenWidth; |
66 | 65 | ||
67 | ///当前设备高度 dp | 66 | ///当前设备高度 dp |
68 | ///The vertical extent of this size. dp | 67 | ///The vertical extent of this size. dp |
69 | - static double get screenHeight => _screenHeight; | 68 | + double get screenHeight => _screenHeight; |
70 | 69 | ||
71 | /// 当前设备宽度 px | 70 | /// 当前设备宽度 px |
72 | /// The vertical extent of this size. px | 71 | /// The vertical extent of this size. px |
73 | - static double get screenWidthPx => _screenWidth * _pixelRatio; | 72 | + double get screenWidthPx => _screenWidth * _pixelRatio; |
74 | 73 | ||
75 | /// 当前设备高度 px | 74 | /// 当前设备高度 px |
76 | /// The vertical extent of this size. px | 75 | /// The vertical extent of this size. px |
77 | - static double get screenHeightPx => _screenHeight * _pixelRatio; | 76 | + double get screenHeightPx => _screenHeight * _pixelRatio; |
78 | 77 | ||
79 | /// 状态栏高度 dp 刘海屏会更高 | 78 | /// 状态栏高度 dp 刘海屏会更高 |
80 | /// The offset from the top | 79 | /// The offset from the top |
81 | - static double get statusBarHeight => _statusBarHeight; | 80 | + double get statusBarHeight => _statusBarHeight; |
82 | 81 | ||
83 | /// 底部安全区距离 dp | 82 | /// 底部安全区距离 dp |
84 | /// The offset from the bottom. | 83 | /// The offset from the bottom. |
85 | - static double get bottomBarHeight => _bottomBarHeight; | 84 | + double get bottomBarHeight => _bottomBarHeight; |
86 | 85 | ||
87 | /// 实际的dp与UI设计px的比例 | 86 | /// 实际的dp与UI设计px的比例 |
88 | /// The ratio of the actual dp to the design draft px | 87 | /// The ratio of the actual dp to the design draft px |
89 | - double get scaleWidth => _screenWidth / uiWidthPx; | 88 | + double get scaleWidth => _screenWidth / uiSize.width; |
90 | 89 | ||
91 | - double get scaleHeight => _screenHeight / uiHeightPx; | 90 | + double get scaleHeight => _screenHeight / uiSize.height; |
92 | 91 | ||
93 | double get scaleText => scaleWidth; | 92 | double get scaleText => scaleWidth; |
94 | 93 |
@@ -18,9 +18,9 @@ extension SizeExtension on num { | @@ -18,9 +18,9 @@ extension SizeExtension on num { | ||
18 | 18 | ||
19 | ///屏幕宽度的倍数 | 19 | ///屏幕宽度的倍数 |
20 | ///Multiple of screen width | 20 | ///Multiple of screen width |
21 | - num get wp => ScreenUtil.screenWidth * this; | 21 | + num get wp => ScreenUtil().screenWidth * this; |
22 | 22 | ||
23 | ///屏幕高度的倍数 | 23 | ///屏幕高度的倍数 |
24 | ///Multiple of screen height | 24 | ///Multiple of screen height |
25 | - num get hp => ScreenUtil.screenHeight * this; | 25 | + num get hp => ScreenUtil().screenHeight * this; |
26 | } | 26 | } |
1 | name: flutter_screenutil | 1 | name: flutter_screenutil |
2 | description: A flutter plugin for adapting screen and font size.Guaranteed to look good on different models | 2 | description: A flutter plugin for adapting screen and font size.Guaranteed to look good on different models |
3 | -version: 2.3.1 | 3 | +version: 3.0.0 |
4 | homepage: https://github.com/OpenFlutter/flutter_screenutil | 4 | homepage: https://github.com/OpenFlutter/flutter_screenutil |
5 | 5 | ||
6 | environment: | 6 | environment: |
@@ -13,38 +13,3 @@ dependencies: | @@ -13,38 +13,3 @@ dependencies: | ||
13 | dev_dependencies: | 13 | dev_dependencies: |
14 | flutter_test: | 14 | flutter_test: |
15 | sdk: flutter | 15 | sdk: flutter |
16 | - | ||
17 | -# For information on the generic Dart part of this file, see the | ||
18 | -# following page: https://www.dartlang.org/tools/pub/pubspec | ||
19 | - | ||
20 | -# The following section is specific to Flutter. | ||
21 | -flutter: | ||
22 | - # To add assets to your package, add an assets section, like this: | ||
23 | - # assets: | ||
24 | - # - images/a_dot_burr.jpeg | ||
25 | - # - images/a_dot_ham.jpeg | ||
26 | - # | ||
27 | - # For details regarding assets in packages, see | ||
28 | - # https://flutter.io/assets-and-images/#from-packages | ||
29 | - # | ||
30 | - # An image asset can refer to one or more resolution-specific "variants", see | ||
31 | - # https://flutter.io/assets-and-images/#resolution-aware. | ||
32 | - # To add custom fonts to your package, add a fonts section here, | ||
33 | - # in this "flutter" section. Each entry in this list should have a | ||
34 | - # "family" key with the font family name, and a "fonts" key with a | ||
35 | - # list giving the asset and other descriptors for the font. For | ||
36 | - # example: | ||
37 | - # fonts: | ||
38 | - # - family: Schyler | ||
39 | - # fonts: | ||
40 | - # - asset: fonts/Schyler-Regular.ttf | ||
41 | - # - asset: fonts/Schyler-Italic.ttf | ||
42 | - # style: italic | ||
43 | - # - family: Trajan Pro | ||
44 | - # fonts: | ||
45 | - # - asset: fonts/TrajanPro.ttf | ||
46 | - # - asset: fonts/TrajanPro_Bold.ttf | ||
47 | - # weight: 700 | ||
48 | - # | ||
49 | - # For details regarding fonts in packages, see | ||
50 | - # https://flutter.io/custom-fonts/#from-packages |
-
Please register or login to post a comment