init widget, example, readme

Alexey Zdorovykh
Commit 632a9ae7c39c4a087dda3e77e5006f978ff99871 632a9ae7 1 parent bb98d5d5
Showing 7 changed files with 106 additions and 77 deletions
README.md
README_CN.md
README_PT.md
example/lib/main.dart
example/lib/main_zh.dart
lib/flutter_screenutil.dart
lib/screenutil_init.dart
--- a/README.md
View file @632a9ae
+++ b/README.md
View file @632a9ae
@@ -18,7 +18,7 @@
 ### Add dependency：
 Please check the latest version before installation.
 If there is any problem with the new version, please use the previous version
-```
+```yaml
 dependencies:
   flutter:
     sdk: flutter
@@ -26,35 +26,33 @@ dependencies:
   flutter_screenutil: ^4.0.0-beta1
 ```
 ### Add the following imports to your Dart code:
-```
+```dart
 import 'package:flutter_screenutil/flutter_screenutil.dart';
 ```
 ### Property
 |Property|Type|Default Value|Description|
-|:---|:---|:---|:---|
+|:---|:---|:---|:---| 
 |designSize|Size|Size(1080, 1920)|The size of the device in the design draft, in px|
 |allowFontScaling|bool|false|Sets whether the font size is scaled according to the system's "font size" assist option|
 ### Initialize and set the fit size and font size to scale according to the system's "font size" accessibility option
 Please set the size of the design draft before use, the width and height of the design draft.
-```
+```dart
 void main() => runApp(MyApp());
 class MyApp extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
-    return LayoutBuilder(
-      builder: (context, constraints) {
-        //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)
-        ScreenUtil.init(constraints, designSize: Size(750, 1334), allowFontScaling: false);
-
-        return MaterialApp(
-          ...
-        );
-      },
+    //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)
+    return ScreenUtilInit(
+      designSize: Size(750, 1334),
+      allowFontScaling: false,
+      child: MaterialApp(
+        ...
+      ),
     );
   }
 }
@@ -112,14 +110,14 @@ If your dart sdk>=2.6, you can use extension functions:
 example:
 instead of :
-```
+```dart
 Container(
 width: ScreenUtil().setWidth(50),
 height:ScreenUtil().setHeight(200),
 )
 ```
 you can use it like this:
-```
+```dart
 Container(
 width: 50.w,
 height:200.h
--- a/README_CN.md
View file @632a9ae
+++ b/README_CN.md
View file @632a9ae
@@ -23,7 +23,7 @@
 安装之前请查看最新版本
 新版本如有问题请使用上一版
-```
+```yaml
 dependencies:
   flutter:
     sdk: flutter
@@ -31,7 +31,7 @@ dependencies:
   flutter_screenutil: ^4.0.0-beta1
 ```
 ### 在每个使用的地方导入包：
-```
+```dart
 import 'package:flutter_screenutil/flutter_screenutil.dart';
 ```
@@ -39,14 +39,14 @@ import 'package:flutter_screenutil/flutter_screenutil.dart';
 |属性|类型|默认值|描述|
 |:---|:---|:---|:---|
-|designSize|Size|Size(1080, 1920)|设计稿中设备的尺寸(单位px)|
+|designSize|Size|Size(1080, 1920)|设计稿中设备的尺寸(单位随意,但在使用过程中必须保持一致)|
 |allowFontScaling|bool|false|设置字体大小是否根据系统的“字体大小”辅助选项来进行缩放|
 ### 初始化并设置适配尺寸及字体大小是否根据系统的“字体大小”辅助选项来进行缩放
 在使用之前请设置好设计稿的宽度和高度，传入设计稿的宽度和高度(单位随意,但在使用过程中必须保持一致)
 一定要进行初始化(只需设置一次),以保证在每次使用之前设置好了适配尺寸:
-```
+```dart
 //填入设计稿中设备的屏幕尺寸
 void main() => runApp(MyApp());
@@ -54,18 +54,17 @@ void main() => runApp(MyApp());
 class MyApp extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
-    return LayoutBuilder(
-      builder: (context, constraints) {
-        //设置适配尺寸 (填入设计稿中设备的屏幕尺寸) 此处假如设计稿是按iPhone6的尺寸设计的(iPhone6 750*1334)
-        ScreenUtil.init(constraints, designSize: Size(750, 1334), allowFontScaling: false);
-
-        return MaterialApp(
-            ...
-        );
-      },
+    //设置适配尺寸 (填入设计稿中设备的屏幕尺寸) 此处假如设计稿是按iPhone6的尺寸设计的(iPhone6 750*1334)
+    return ScreenUtilInit(
+      designSize: Size(750, 1334),
+      allowFontScaling: false,
+      child: MaterialApp(
+        ...
+      ),
     );
   }
 }
+
 //默认 width : 1080px , height:1920px , allowFontScaling:false
 ScreenUtil.init(constraints);
@@ -119,7 +118,7 @@ setHeight譁ｹ豕穂ｸｻ隕∵弍蝨ｨ鬮伜ｺｦ荳願ｿ幄｡碁る, 蝨ｨ菴諠ｳ謗ｧ蛻ｶUI荳贋ｸ螻冗噪
 例如:
-```
+```dart
 //UI上是长方形:
 Container(
            width: ScreenUtil().setWidth(375),
@@ -136,14 +135,14 @@ Container(
 如果你的dart sdk>=2.6,可以使用扩展函数:
 example:
 不用这个:
-```
+```dart
 Container(
 width: ScreenUtil().setWidth(50),
 height:ScreenUtil().setHeight(200),
 )
 ```
 而是用这个:
-```
+```dart
 Container(
 width: 50.w,
 height:200.h
@@ -153,7 +152,7 @@ height:200.h
 #### 适配字体:
 传入设计稿的字体大小：
-``` 
+```dart 
 //传入字体大小(单位和初始化时的单位保持一致)，默认不根据系统的“字体大小”辅助选项来进行缩放(可在初始化ScreenUtil时设置allowFontScaling)
 ScreenUtil().setSp(28)
 或
@@ -184,12 +183,12 @@ Column(
             )
 ```
-```
+
 [widget test](https://github.com/OpenFlutter/flutter_screenutil/issues/115)
 ### 使用示例:
-[example demo](https://github.com/OpenFlutter/flutter_screenutil/blob/master/example/lib/main_zh.dart)
+[example demo](https://github.com/OpenFlutter/flutter_ScreenUtil/blob/master/example/lib/main_zh.dart)
 效果:
--- a/README_PT.md
View file @632a9ae
+++ b/README_PT.md
View file @632a9ae
@@ -19,16 +19,16 @@
 ### Adicionando a dependência：
 Por favor, verifique a última versão antes da instalação.
 Se houver algum problema com a nova versão, use a versão anterior
-```
+```yaml
 dependencies:
   flutter:
     sdk: flutter
   # add flutter_screenutil
-  flutter_screenutil: ^4.0.0-beta1
+  flutter_screenutil: ^4.0.0-beta
 ```
 ### Adicione o seguinte import em seu código Dart:
-```
+```dart
 import 'package:flutter_screenutil/flutter_screenutil.dart';
 ```
@@ -45,12 +45,20 @@ Por favor, defina a largura e altura do protótipo de design antes de usar (em p
 Certifique-se de definir as dimensões na paginal inicial do MaterialApp (ou seja, no arquivo de entrada, defina apenas uma vez) para garantir que o tamanho de ajuste seja o mesmo antes de cada uso:
 ```dart
-//Preencha o tamanho da tela do dispositivo no protótipo de design
-void main() {
-  WidgetsFlutterBinding.ensureInitialized();
-  //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)
-  ScreenUtil.init(constraints, designSize: Size(750, 1334), allowFontScaling: false);
-  runApp(MyApp());
+void main() => runApp(MyApp());
+
+class MyApp extends StatelessWidget {
+  @override
+  Widget build(BuildContext context) {
+    //Preencha o tamanho da tela do dispositivo no protótipo de design
+    return ScreenUtilInit(
+      designSize: Size(750, 1334),
+      allowFontScaling: false,
+      child: MaterialApp(
+        ...
+      ),
+    );
+  }
 }
 //Valor padrão: width : 1080px , height:1920px , allowFontScaling:false
--- a/example/lib/main.dart
View file @632a9ae
+++ b/example/lib/main.dart
View file @632a9ae
@@ -6,21 +6,18 @@ void main() => runApp(MyApp());
 class MyApp extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
-    return LayoutBuilder(
-      builder: (context, constraints) {
-        //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)
-        ScreenUtil.init(constraints, designSize: Size(750, 1334), allowFontScaling: false);
-
-        return MaterialApp(
-          debugShowCheckedModeBanner: false,
-          title: 'Flutter_ScreenUtil',
-          theme: ThemeData(
-            primarySwatch: Colors.blue,
-            textTheme: TextTheme(button: TextStyle(fontSize: 80.nsp)),
-          ),
-          home: HomePage(title: 'FlutterScreenUtil Demo'),
-        );
-      },
+    //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)
+    return ScreenUtilInit(
+      designSize: Size(750, 1334),
+      allowFontScaling: false,
+      child: MaterialApp(
+        debugShowCheckedModeBanner: false,
+        title: 'Flutter_ScreenUtil',
+        theme: ThemeData(
+          primarySwatch: Colors.blue,
+        ),
+        home: HomePage(title: 'FlutterScreenUtil Demo'),
+      ),
     );
   }
 }
@@ -130,10 +127,8 @@ class _HomePageState extends State<HomePage> {
     print('Device width dp:${1.sw}dp');
     print('Device height dp:${1.sh}dp');
     print('Device pixel density:${ScreenUtil().pixelRatio}');
-    print(
-        'Bottom safe zone distance dp:${ScreenUtil().bottomBarHeight}dp');
-    print(
-        'Status bar height dp:${ScreenUtil().statusBarHeight}dp');
+    print('Bottom safe zone distance dp:${ScreenUtil().bottomBarHeight}dp');
+    print('Status bar height dp:${ScreenUtil().statusBarHeight}dp');
     print('Ratio of actual width dp to UI Design:${ScreenUtil().scaleWidth}');
     print('Ratio of actual height dp to UI Design:${ScreenUtil().scaleHeight}');
     print('System font scaling:${ScreenUtil().textScaleFactor}');
--- a/example/lib/main_zh.dart
View file @632a9ae
+++ b/example/lib/main_zh.dart
View file @632a9ae
@@ -6,21 +6,18 @@ void main() => runApp(MyApp());
 class MyApp extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
-    return LayoutBuilder(
-      builder: (context, constraints) {
-        //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)
-        ScreenUtil.init(constraints, designSize: Size(750, 1334), allowFontScaling: false);
-
-        return MaterialApp(
-          debugShowCheckedModeBanner: false,
-          title: 'Flutter_ScreenUtil',
-          theme: ThemeData(
-            primarySwatch: Colors.blue,
-            textTheme: TextTheme(button: TextStyle(fontSize: 80.nsp)),
-          ),
-          home: HomePage(title: 'FlutterScreenUtil Demo'),
-        );
-      },
+    //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)
+    return ScreenUtilInit(
+      designSize: Size(750, 1334),
+      allowFontScaling: false,
+      child: MaterialApp(
+        debugShowCheckedModeBanner: false,
+        title: 'Flutter_ScreenUtil',
+        theme: ThemeData(
+          primarySwatch: Colors.blue,
+        ),
+        home: HomePage(title: 'FlutterScreenUtil Demo'),
+      ),
     );
   }
 }
--- a/lib/flutter_screenutil.dart
View file @632a9ae
+++ b/lib/flutter_screenutil.dart
View file @632a9ae
@@ -7,3 +7,4 @@ library flutter_screenutil;
 export 'size_extension.dart';
 export 'screenutil.dart';
+export 'screenutil_init.dart';
--- a/lib/screenutil_init.dart 0 → 100644
View file @632a9ae
+++ b/lib/screenutil_init.dart 0 → 100644
View file @632a9ae
+import 'package:flutter/widgets.dart';
+
+import 'screenutil.dart';
+
+class ScreenUtilInit extends StatelessWidget {
+  const ScreenUtilInit({
+    @required this.child,
+    this.designSize = ScreenUtil.defaultSize,
+    this.allowFontScaling = false,
+    Key key,
+  }) : super(key: key);
+
+  final Widget child;
+  final Size designSize;
+  final bool allowFontScaling;
+
+  @override
+  Widget build(BuildContext context) {
+    return LayoutBuilder(
+      builder: (_, BoxConstraints constraints) {
+        ScreenUtil.init(
+          constraints,
+          designSize: designSize,
+          allowFontScaling: allowFontScaling,
+        );
+
+        return child;
+      },
+    );
+  }
+}