Showing
1 changed file
with
19 additions
and
16 deletions
@@ -39,32 +39,37 @@ import 'package:flutter_screenutil/flutter_screenutil.dart'; | @@ -39,32 +39,37 @@ import 'package:flutter_screenutil/flutter_screenutil.dart'; | ||
39 | 39 | ||
40 | ### Property | 40 | ### Property |
41 | 41 | ||
42 | -| Property | Type | Default Value | Description | | ||
43 | -| --------------- | ------------ | ------------- | ---------------------------------------------------------------------- | | ||
44 | -| deviceSize | Size | null | The size of the physical device | | ||
45 | -| designSize | Size | Size(360,690) | The size of the device screen in the design draft, in dp | | ||
46 | -| builder | Function | null | Generally returning a Function of MaterialApp type | | ||
47 | -| child | Widget | null | A part of builder that never being rebuilt | | ||
48 | -| orientation | Orientation | portrait | screen orientation | | ||
49 | -| splitScreenMode | bool | false | support for split screen | | ||
50 | -| minTextAdapt | bool | false | Whether to adapt the text according to the minimum of width and height | | ||
51 | -| context | BuildContext | null | Get physical device data if not provided, by MediaQuery.of(context) | | 42 | +| Property | Type | Default Value | Description | |
43 | +| --------------- | ------------ | ------------- | --------------------------------------------------------------------------- | | ||
44 | +| deviceSize | Size | null | The size of the physical device | | ||
45 | +| designSize | Size | Size(360,690) | The size of the device screen in the design draft, in dp | | ||
46 | +| builder | Function | null | Return widget that uses the library in a property (ex: MaterialApp's theme) | | ||
47 | +| child | Widget | null | A part of builder that its dependencies/properties don't use the library | | ||
48 | +| rebuildFactor | Function | *default* | Returns whether to rebuild or not when screen metrics changes. | | ||
49 | +| orientation | Orientation | portrait | screen orientation | | ||
50 | +| splitScreenMode | bool | false | support for split screen | | ||
51 | +| minTextAdapt | bool | false | Whether to adapt the text according to the minimum of width and height | | ||
52 | +| context | BuildContext | null | Get physical device data if not provided, by MediaQuery.of(context) | | ||
53 | + | ||
54 | +**Note : You must either provide builder, child or both.** | ||
52 | 55 | ||
53 | ### Initialize and set the fit size and font size to scale according to the system's "font size" accessibility option | 56 | ### Initialize and set the fit size and font size to scale according to the system's "font size" accessibility option |
54 | 57 | ||
55 | Please set the size of the design draft before use, the width and height of the design draft. | 58 | Please set the size of the design draft before use, the width and height of the design draft. |
56 | 59 | ||
57 | -#### The first way | 60 | +#### The first way (Recommended) |
58 | 61 | ||
59 | ```dart | 62 | ```dart |
60 | void main() => runApp(MyApp()); | 63 | void main() => runApp(MyApp()); |
61 | 64 | ||
62 | class MyApp extends StatelessWidget { | 65 | class MyApp extends StatelessWidget { |
66 | + const MyApp({Key? key}) : super(key: key); | ||
67 | + | ||
63 | @override | 68 | @override |
64 | Widget build(BuildContext context) { | 69 | Widget build(BuildContext context) { |
65 | //Set the fit size (Find your UI design, look at the dimensions of the device screen and fill it in,unit in dp) | 70 | //Set the fit size (Find your UI design, look at the dimensions of the device screen and fill it in,unit in dp) |
66 | return ScreenUtilInit( | 71 | return ScreenUtilInit( |
67 | - designSize: Size(360, 690), | 72 | + designSize: const Size(360, 690), |
68 | minTextAdapt: true, | 73 | minTextAdapt: true, |
69 | splitScreenMode: true, | 74 | splitScreenMode: true, |
70 | builder: (child) { | 75 | builder: (child) { |
@@ -74,22 +79,20 @@ class MyApp extends StatelessWidget { | @@ -74,22 +79,20 @@ class MyApp extends StatelessWidget { | ||
74 | // You can use the library anywhere in the app even in theme | 79 | // You can use the library anywhere in the app even in theme |
75 | theme: ThemeData( | 80 | theme: ThemeData( |
76 | primarySwatch: Colors.blue, | 81 | primarySwatch: Colors.blue, |
77 | - textTheme: TextTheme(bodyText2: TextStyle(fontSize: 30.sp)), | 82 | + textTheme: Typography.englishLike2018.apply(fontSizeFactor: 1.sp), |
78 | ), | 83 | ), |
79 | home: child, | 84 | home: child, |
80 | ); | 85 | ); |
81 | }, | 86 | }, |
82 | - child: HomePage(title: 'First Method'), | 87 | + child: const HomePage(title: 'First Method'), |
83 | ); | 88 | ); |
84 | } | 89 | } |
85 | } | 90 | } |
86 | - | ||
87 | ``` | 91 | ``` |
88 | 92 | ||
89 | #### The second way:You need a trick to support font adaptation in the textTheme of app theme | 93 | #### The second way:You need a trick to support font adaptation in the textTheme of app theme |
90 | 94 | ||
91 | **Hybrid development uses the second way** | 95 | **Hybrid development uses the second way** |
92 | -**(If it is not necessary, it is recommended to use the second)** | ||
93 | 96 | ||
94 | not support this: | 97 | not support this: |
95 | 98 |
-
Please register or login to post a comment