Merge pull request #181 from Overman775/init_widget_master

Init widget

@@ -18,7 +18,7 @@
 ### Add dependency：
 ### Add dependency：
 Please check the latest version before installation.
 Please check the latest version before installation.
 If there is any problem with the new version, please use the previous version
 If there is any problem with the new version, please use the previous version
-```
+```yaml
 dependencies:
 dependencies:
   flutter:
   flutter:
     sdk: flutter
     sdk: flutter
@@ -26,7 +26,7 @@ dependencies:
   flutter_screenutil: ^4.0.0-beta1
   flutter_screenutil: ^4.0.0-beta1
 ```
 ```
 ### Add the following imports to your Dart code:
 ### Add the following imports to your Dart code:
-```
+```dart
 import 'package:flutter_screenutil/flutter_screenutil.dart';
 import 'package:flutter_screenutil/flutter_screenutil.dart';
 ```
 ```
 
 
@@ -40,21 +40,19 @@ import 'package:flutter_screenutil/flutter_screenutil.dart';
 ### Initialize and set the fit size and font size to scale according to the system's "font size" accessibility 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.
 Please set the size of the design draft before use, the width and height of the design draft.
 
 
-```
+```dart
 void main() => runApp(MyApp());
 void main() => runApp(MyApp());
 
 
 class MyApp extends StatelessWidget {
 class MyApp extends StatelessWidget {
   @override
   @override
   Widget build(BuildContext context) {
   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)
     //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(
+    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:
 example:
 
 
 instead of :
 instead of :
-```
+```dart
 Container(
 Container(
 width: ScreenUtil().setWidth(50),
 width: ScreenUtil().setWidth(50),
 height:ScreenUtil().setHeight(200),
 height:ScreenUtil().setHeight(200),
 )
 )
 ```
 ```
 you can use it like this:
 you can use it like this:
-```
+```dart
 Container(
 Container(
 width: 50.w,
 width: 50.w,
 height:200.h
 height:200.h

@@ -23,7 +23,7 @@
 
 
 安装之前请查看最新版本
 安装之前请查看最新版本
 新版本如有问题请使用上一版
 新版本如有问题请使用上一版
-```
+```yaml
 dependencies:
 dependencies:
   flutter:
   flutter:
     sdk: flutter
     sdk: flutter
@@ -31,7 +31,7 @@ dependencies:
   flutter_screenutil: ^4.0.0-beta1
   flutter_screenutil: ^4.0.0-beta1
 ```
 ```
 ### 在每个使用的地方导入包：
 ### 在每个使用的地方导入包：
-```
+```dart
 import 'package:flutter_screenutil/flutter_screenutil.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|设置字体大小是否根据系统的“字体大小”辅助选项来进行缩放|
 |allowFontScaling|bool|false|设置字体大小是否根据系统的“字体大小”辅助选项来进行缩放|
 
 
 ### 初始化并设置适配尺寸及字体大小是否根据系统的“字体大小”辅助选项来进行缩放
 ### 初始化并设置适配尺寸及字体大小是否根据系统的“字体大小”辅助选项来进行缩放
 在使用之前请设置好设计稿的宽度和高度，传入设计稿的宽度和高度(单位随意,但在使用过程中必须保持一致)
 在使用之前请设置好设计稿的宽度和高度，传入设计稿的宽度和高度(单位随意,但在使用过程中必须保持一致)
 一定要进行初始化(只需设置一次),以保证在每次使用之前设置好了适配尺寸:
 一定要进行初始化(只需设置一次),以保证在每次使用之前设置好了适配尺寸:
 
 
-```
+```dart
 //填入设计稿中设备的屏幕尺寸
 //填入设计稿中设备的屏幕尺寸
 
 
 void main() => runApp(MyApp());
 void main() => runApp(MyApp());
@@ -54,18 +54,17 @@ void main() => runApp(MyApp());
 class MyApp extends StatelessWidget {
 class MyApp extends StatelessWidget {
   @override
   @override
   Widget build(BuildContext context) {
   Widget build(BuildContext context) {
-    return LayoutBuilder(
-      builder: (context, constraints) {
     //设置适配尺寸 (填入设计稿中设备的屏幕尺寸) 此处假如设计稿是按iPhone6的尺寸设计的(iPhone6 750*1334)
     //设置适配尺寸 (填入设计稿中设备的屏幕尺寸) 此处假如设计稿是按iPhone6的尺寸设计的(iPhone6 750*1334)
-        ScreenUtil.init(constraints, designSize: Size(750, 1334), allowFontScaling: false);
-
-        return MaterialApp(
+    return ScreenUtilInit(
+      designSize: Size(750, 1334),
+      allowFontScaling: false,
+      child: MaterialApp(
         ...
         ...
-        );
-      },
+      ),
     );
     );
   }
   }
 }
 }
+
 //默认 width : 1080px , height:1920px , allowFontScaling:false
 //默认 width : 1080px , height:1920px , allowFontScaling:false
 ScreenUtil.init(constraints);
 ScreenUtil.init(constraints);
 
 
@@ -119,7 +118,7 @@ setHeight瘜蜓閬擃漲銝, 雿UI銝撅
 
 
 例如:
 例如:
 
 
-```
+```dart
 //UI上是长方形:
 //UI上是长方形:
 Container(
 Container(
            width: ScreenUtil().setWidth(375),
            width: ScreenUtil().setWidth(375),
@@ -136,14 +135,14 @@ Container(
 如果你的dart sdk>=2.6,可以使用扩展函数:
 如果你的dart sdk>=2.6,可以使用扩展函数:
 example:
 example:
 不用这个:
 不用这个:
-```
+```dart
 Container(
 Container(
 width: ScreenUtil().setWidth(50),
 width: ScreenUtil().setWidth(50),
 height:ScreenUtil().setHeight(200),
 height:ScreenUtil().setHeight(200),
 )
 )
 ```
 ```
 而是用这个:
 而是用这个:
-```
+```dart
 Container(
 Container(
 width: 50.w,
 width: 50.w,
 height:200.h
 height:200.h
@@ -153,7 +152,7 @@ height:200.h
 #### 适配字体:
 #### 适配字体:
 传入设计稿的字体大小：
 传入设计稿的字体大小：
 
 
-``` 
+```dart 
 //传入字体大小(单位和初始化时的单位保持一致)，默认不根据系统的“字体大小”辅助选项来进行缩放(可在初始化ScreenUtil时设置allowFontScaling)
 //传入字体大小(单位和初始化时的单位保持一致)，默认不根据系统的“字体大小”辅助选项来进行缩放(可在初始化ScreenUtil时设置allowFontScaling)
 ScreenUtil().setSp(28)
 ScreenUtil().setSp(28)
 或
 或
@@ -184,12 +183,12 @@ Column(
             )
             )
 ```
 ```
 
 
-```
+
 [widget test](https://github.com/OpenFlutter/flutter_screenutil/issues/115)
 [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)
  
  
 效果:
 效果:
 
 

@@ -19,16 +19,16 @@
 ### Adicionando a dependência：
 ### Adicionando a dependência：
 Por favor, verifique a última versão antes da instalação.
 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
 Se houver algum problema com a nova versão, use a versão anterior
-```
+```yaml
 dependencies:
 dependencies:
   flutter:
   flutter:
     sdk: flutter
     sdk: flutter
   # add flutter_screenutil
   # add flutter_screenutil
-  flutter_screenutil: ^4.0.0-beta1
+  flutter_screenutil: ^4.0.0-beta
 ```
 ```
 
 
 ### Adicione o seguinte import em seu código Dart:
 ### Adicione o seguinte import em seu código Dart:
-```
+```dart
 import 'package:flutter_screenutil/flutter_screenutil.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:
 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
 ```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
 //Valor padrão: width : 1080px , height:1920px , allowFontScaling:false

@@ -6,21 +6,18 @@ void main() => runApp(MyApp());
 class MyApp extends StatelessWidget {
 class MyApp extends StatelessWidget {
   @override
   @override
   Widget build(BuildContext context) {
   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)
     //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(
+    return ScreenUtilInit(
+      designSize: Size(750, 1334),
+      allowFontScaling: false,
+      child: MaterialApp(
         debugShowCheckedModeBanner: false,
         debugShowCheckedModeBanner: false,
         title: 'Flutter_ScreenUtil',
         title: 'Flutter_ScreenUtil',
         theme: ThemeData(
         theme: ThemeData(
           primarySwatch: Colors.blue,
           primarySwatch: Colors.blue,
-            textTheme: TextTheme(button: TextStyle(fontSize: 80.nsp)),
         ),
         ),
         home: HomePage(title: 'FlutterScreenUtil Demo'),
         home: HomePage(title: 'FlutterScreenUtil Demo'),
-        );
-      },
+      ),
     );
     );
   }
   }
 }
 }
@@ -130,10 +127,8 @@ class _HomePageState extends State<HomePage> {
     print('Device width dp:${1.sw}dp');
     print('Device width dp:${1.sw}dp');
     print('Device height dp:${1.sh}dp');
     print('Device height dp:${1.sh}dp');
     print('Device pixel density:${ScreenUtil().pixelRatio}');
     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 width dp to UI Design:${ScreenUtil().scaleWidth}');
     print('Ratio of actual height dp to UI Design:${ScreenUtil().scaleHeight}');
     print('Ratio of actual height dp to UI Design:${ScreenUtil().scaleHeight}');
     print('System font scaling:${ScreenUtil().textScaleFactor}');
     print('System font scaling:${ScreenUtil().textScaleFactor}');

@@ -6,21 +6,18 @@ void main() => runApp(MyApp());
 class MyApp extends StatelessWidget {
 class MyApp extends StatelessWidget {
   @override
   @override
   Widget build(BuildContext context) {
   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)
     //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(
+    return ScreenUtilInit(
+      designSize: Size(750, 1334),
+      allowFontScaling: false,
+      child: MaterialApp(
         debugShowCheckedModeBanner: false,
         debugShowCheckedModeBanner: false,
         title: 'Flutter_ScreenUtil',
         title: 'Flutter_ScreenUtil',
         theme: ThemeData(
         theme: ThemeData(
           primarySwatch: Colors.blue,
           primarySwatch: Colors.blue,
-            textTheme: TextTheme(button: TextStyle(fontSize: 80.nsp)),
         ),
         ),
         home: HomePage(title: 'FlutterScreenUtil Demo'),
         home: HomePage(title: 'FlutterScreenUtil Demo'),
-        );
-      },
+      ),
     );
     );
   }
   }
 }
 }

@@ -7,3 +7,4 @@ library flutter_screenutil;
 
 
 export 'size_extension.dart';
 export 'size_extension.dart';
 export 'screenutil.dart';
 export 'screenutil.dart';
+export 'screenutil_init.dart';

+import 'package:flutter/widgets.dart';
+
+import 'screenutil.dart';
+
+class ScreenUtilInit extends StatelessWidget {
+  /// A helper widget that initializes [ScreenUtil]
+  const ScreenUtilInit({
+    @required this.child,
+    this.designSize = ScreenUtil.defaultSize,
+    this.allowFontScaling = false,
+    Key key,
+  }) : super(key: key);
+
+  final Widget child;
+
+  /// The [Size] of the device in the design draft, in px
+  final Size designSize;
+
+  /// Sets whether the font size is scaled according to the system's "font size" assist option
+  final bool allowFontScaling;
+
+  @override
+  Widget build(BuildContext context) {
+    return LayoutBuilder(
+      builder: (_, BoxConstraints constraints) {
+        ScreenUtil.init(
+          constraints,
+          designSize: designSize,
+          allowFontScaling: allowFontScaling,
+        );
+
+        return child;
+      },
+    );
+  }
+}