Toggle navigation
Toggle navigation
This project
Loading...
Sign in
flutter_package
/
flutter_screenutil
Go to a project
Toggle navigation
Projects
Groups
Snippets
Help
Toggle navigation pinning
Project
Activity
Repository
Pipelines
Graphs
Issues
0
Merge Requests
0
Wiki
Network
Create a new issue
Builds
Commits
Authored by
李卓原
2020-10-15 17:01:06 +0800
Browse Files
Options
Browse Files
Download
Plain Diff
Commit
faa60f90445ff6c7a7cff3277b87f49784fa65a7
faa60f90
2 parents
115e489a
5240c03a
Merge remote-tracking branch 'origin/master'
Hide whitespace changes
Inline
Side-by-side
Showing
11 changed files
with
127 additions
and
133 deletions
.flutter_tool_state
CHANGELOG.md
README.md
README_CN.md
README_PT.md
example/android/app/src/main/AndroidManifest.xml
example/lib/main.dart
example/lib/main_zh.dart
example/lib/text_style.dart
lib/screenutil.dart
pubspec.yaml
.flutter_tool_state
0 → 100644
View file @
faa60f9
{
"is-bot"
:
true
,
"redisplay-welcome-message"
:
false
}
...
...
CHANGELOG.md
View file @
faa60f9
...
...
@@ -5,6 +5,17 @@
*
@LastEditTime: 2020年6月20日 11:20:02
*
@Description: Update log
-->
# 3.1.1
-
change readme
# 3.1.0
-
Use the way back to v2 version
-
Modify registration method
# 3.0.2+1
-
Guide users to use V2 version
# 3.0.2
-
Change the unit of'statusBarHeight' and 'bottomBarHeight' to dp
...
...
README.md
View file @
faa60f9
...
...
@@ -13,11 +13,6 @@
[
Update log
](
https://github.com/OpenFlutter/flutter_screenutil/blob/master/CHANGELOG.md
)
## Note
[
v3
](
https://github.com/OpenFlutter/flutter_screenutil/tree/beta
)
requires
`flutter >= 1.19.0`
.
[
v2
](
https://github.com/OpenFlutter/flutter_screenutil
)
support all versions.
## Usage:
### Add dependency:
...
...
@@ -28,7 +23,7 @@ dependencies:
flutter:
sdk: flutter
# add flutter_screenutil
flutter_screenutil: ^3.
0.2
flutter_screenutil: ^3.
1.0
```
### Add the following imports to your Dart code:
```
...
...
@@ -50,20 +45,20 @@ Please set the size of the design draft before use, the width and height of the
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(designSize: Size(750, 1334), allowFontScaling: false);
ScreenUtil.init(
context,
designSize: Size(750, 1334), allowFontScaling: false);
runApp(MyApp());
}
//fill in the screen size of the device in the design
//default value : width : 1080px , height:1920px , allowFontScaling:false
ScreenUtil.init();
ScreenUtil.init(
context
);
//If the design is based on the size of the iPhone6 (iPhone6 750*1334)
ScreenUtil.init(designSize: Size(750, 1334));
ScreenUtil.init(
context,
designSize: Size(750, 1334));
//If you want to set the font size is scaled according to the system's "font size" assist option
ScreenUtil.init(designSize: Size(750, 1334), allowFontScaling: true);
ScreenUtil.init(
context,
designSize: Size(750, 1334), allowFontScaling: true);
```
...
...
README_CN.md
View file @
faa60f9
...
...
@@ -17,11 +17,6 @@
[
更新日志
](
https://github.com/OpenFlutter/flutter_screenutil/blob/master/CHANGELOG.md
)
## Note
[
v3
](
https://github.com/OpenFlutter/flutter_screenutil/tree/beta
)
可用于
`flutter >= 1.19.0`
[
v2
](
https://github.com/OpenFlutter/flutter_screenutil
)
可用于所有版本。
## 使用方法:
### 安装依赖:
...
...
@@ -33,7 +28,7 @@ dependencies:
flutter:
sdk: flutter
# 添加依赖
flutter_screenutil: ^3.
0.2
flutter_screenutil: ^3.
1.0
```
### 在每个使用的地方导入包:
```
...
...
@@ -57,18 +52,18 @@ import 'package:flutter_screenutil/flutter_screenutil.dart';
void main() {
WidgetsFlutterBinding.ensureInitialized();
//设置适配尺寸 (填入设计稿中设备的屏幕尺寸) 此处假如设计稿是按iPhone6的尺寸设计的(iPhone6 750*1334)
ScreenUtil.init(designSize: Size(750, 1334), allowFontScaling: false);
ScreenUtil.init(
context,
designSize: Size(750, 1334), allowFontScaling: false);
runApp(MyApp());
}
//默认 width : 1080px , height:1920px , allowFontScaling:false
ScreenUtil.init();
ScreenUtil.init(
context
);
//假如设计稿是按iPhone6的尺寸设计的(iPhone6 750*1334)
ScreenUtil.init(designSize: Size(750, 1334));
ScreenUtil.init(
context,
designSize: Size(750, 1334));
//设置字体大小根据系统的“字体大小”辅助选项来进行缩放,默认为false
ScreenUtil.init(designSize: Size(750, 1334), allowFontScaling: true);
ScreenUtil.init(
context,
designSize: Size(750, 1334), allowFontScaling: true);
```
...
...
@@ -180,12 +175,10 @@ Column(
```
```
dart
void
main
(
)
{
WidgetsFlutterBinding
.
ensureInitialized
();
//设置适配尺寸 (填入设计稿中设备的屏幕尺寸) 此处假如设计稿是按iPhone6的尺寸设计的(iPhone6 750*1334)
ScreenUtil
.
init
(
designSize:
Size
(
750
,
1334
),
allowFontScaling:
false
);
runApp
(
MyApp
());
}
import
'package:flutter/material.dart'
;
import
'package:flutter_screenutil/flutter_screenutil.dart'
;
void
main
(
)
=>
runApp
(
MyApp
());
class
MyApp
extends
StatelessWidget
{
@override
...
...
@@ -196,11 +189,20 @@ class MyApp extends StatelessWidget {
theme:
ThemeData
(
primarySwatch:
Colors
.
blue
,
),
home:
ExampleWidget
(
title:
'FlutterScreenUtil示例'
),
home:
MyHomePage
(
),
);
}
}
class
MyHomePage
extends
StatelessWidget
{
@override
Widget
build
(
BuildContext
context
)
{
//设置适配尺寸 (填入设计稿中设备的屏幕尺寸) 此处假如设计稿是按iPhone6的尺寸设计的(iPhone6 750*1334)
ScreenUtil
.
init
(
context
,
designSize:
Size
(
750
,
1334
),
allowFontScaling:
false
);
return
ExampleWidget
(
title:
'FlutterScreenUtil 示例'
);
}
}
class
ExampleWidget
extends
StatefulWidget
{
const
ExampleWidget
({
Key
key
,
this
.
title
})
:
super
(
key:
key
);
...
...
@@ -232,8 +234,7 @@ class _ExampleWidgetState extends State<ExampleWidget> {
child:
Text
(
'我的宽度:
${0.5.wp}
dp
\n
'
'我的高度:
${ScreenUtil().setHeight(200)}
dp'
,
style:
TextStyle
(
color:
Colors
.
white
,
fontSize:
ScreenUtil
().
setSp
(
24
)),
style:
TextStyle
(
color:
Colors
.
white
,
fontSize:
ScreenUtil
().
setSp
(
24
)),
),
),
Container
(
...
...
@@ -244,9 +245,7 @@ class _ExampleWidgetState extends State<ExampleWidget> {
child:
Text
(
'我的宽度:
${375.w}
dp
\n
'
'我的高度:
${200.h}
dp'
,
style:
TextStyle
(
color:
Colors
.
white
,
fontSize:
ScreenUtil
().
setSp
(
24
))),
style:
TextStyle
(
color:
Colors
.
white
,
fontSize:
ScreenUtil
().
setSp
(
24
))),
),
],
),
...
...
@@ -274,11 +273,17 @@ class _ExampleWidgetState extends State<ExampleWidget> {
children:
<
Widget
>[
Text
(
'我的文字大小在设计稿上是24px,不会随着系统的文字缩放比例变化'
,
style:
ts
.
t2
,
style:
TextStyle
(
color:
Colors
.
black
,
fontSize:
24
.
sp
,
),
),
Text
(
'我的文字大小在设计稿上是24px,会随着系统的文字缩放比例变化'
,
style:
ts
.
t1
,
style:
TextStyle
(
color:
Colors
.
black
,
fontSize:
24
.
ssp
,
),
),
],
)
...
...
@@ -289,7 +294,8 @@ class _ExampleWidgetState extends State<ExampleWidget> {
child:
Icon
(
Icons
.
title
),
onPressed:
()
{
ScreenUtil
.
init
(
designSize:
Size
(
1500
,
1334
),
context
,
designSize:
Size
(
750
,
1334
),
allowFontScaling:
false
,
);
setState
(()
{});
...
...
README_PT.md
View file @
faa60f9
...
...
@@ -13,11 +13,6 @@
[
Histórico de atualizações
](
https://github.com/OpenFlutter/flutter_screenutil/blob/master/CHANGELOG.md
)
## Note
[
v3
](
https://github.com/OpenFlutter/flutter_screenutil/tree/beta
)
requer
`flutter >= 1.19.0`
.
[
v2
](
https://github.com/OpenFlutter/flutter_screenutil
)
support all versions.
## Como usar:
### Adicionando a dependência:
...
...
@@ -28,7 +23,7 @@ dependencies:
flutter:
sdk: flutter
# add flutter_screenutil
flutter_screenutil: ^3.
0.2
flutter_screenutil: ^3.
1.0
```
### Adicione o seguinte import em seu código Dart:
...
...
@@ -53,18 +48,18 @@ Certifique-se de definir as dimensões na paginal inicial do MaterialApp (ou sej
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
(
designSize:
Size
(
750
,
1334
),
allowFontScaling:
false
);
ScreenUtil
.
init
(
context
,
designSize:
Size
(
750
,
1334
),
allowFontScaling:
false
);
runApp
(
MyApp
());
}
//Valor padrão: width : 1080px , height:1920px , allowFontScaling:false
ScreenUtil
.
init
();
ScreenUtil
.
init
(
context
);
//Se o design é baseado no iPhone6 (iPhone6 750*1334)
ScreenUtil
.
init
(
designSize:
Size
(
750
,
1334
));
ScreenUtil
.
init
(
context
,
designSize:
Size
(
750
,
1334
));
//Se você quer definir que o tamanho da fonte seja ajustado de acordo com a opção "tamanho da fonte" na acessibilidade do sistema
ScreenUtil
.
init
(
designSize:
Size
(
750
,
1334
),
allowFontScaling:
true
);
ScreenUtil
.
init
(
context
,
designSize:
Size
(
750
,
1334
),
allowFontScaling:
true
);
```
...
...
example/android/app/src/main/AndroidManifest.xml
View file @
faa60f9
...
...
@@ -7,7 +7,7 @@
FlutterApplication and put your custom class here. -->
<application
android:name=
"io.flutter.app.FlutterApplication"
android:label=
"
example
"
android:label=
"
flutter_screenutil
"
android:icon=
"@mipmap/ic_launcher"
>
<activity
android:name=
".MainActivity"
...
...
example/lib/main.dart
View file @
faa60f9
...
...
@@ -3,14 +3,7 @@ import 'dart:ui';
import
'package:flutter/material.dart'
;
import
'package:flutter_screenutil/flutter_screenutil.dart'
;
import
'text_style.dart'
;
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
(
designSize:
Size
(
750
,
1334
),
allowFontScaling:
false
);
runApp
(
MyApp
());
}
void
main
(
)
=>
runApp
(
MyApp
());
class
MyApp
extends
StatelessWidget
{
@override
...
...
@@ -21,11 +14,20 @@ class MyApp extends StatelessWidget {
theme:
ThemeData
(
primarySwatch:
Colors
.
blue
,
),
home:
ExampleWidget
(
title:
'FlutterScreenUtil Demo'
),
home:
MyHomePage
(
),
);
}
}
class
MyHomePage
extends
StatelessWidget
{
@override
Widget
build
(
BuildContext
context
)
{
//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
(
context
,
designSize:
Size
(
750
,
1334
),
allowFontScaling:
false
);
return
ExampleWidget
(
title:
'FlutterScreenUtil Demo'
);
}
}
class
ExampleWidget
extends
StatefulWidget
{
const
ExampleWidget
({
Key
key
,
this
.
title
})
:
super
(
key:
key
);
...
...
@@ -38,7 +40,10 @@ class ExampleWidget extends StatefulWidget {
class
_ExampleWidgetState
extends
State
<
ExampleWidget
>
{
@override
Widget
build
(
BuildContext
context
)
{
// printScreenInformation();
//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
(
context
,
designSize:
Size
(
750
,
1334
),
allowFontScaling:
false
);
printScreenInformation
();
return
Scaffold
(
appBar:
AppBar
(
title:
Text
(
widget
.
title
),
...
...
@@ -112,7 +117,10 @@ class _ExampleWidgetState extends State<ExampleWidget> {
),
Text
(
'My font size is 24px on the design draft and will change with the system.'
,
style:
ts
.
t1
,
style:
TextStyle
(
color:
Colors
.
black
,
fontSize:
24
.
ssp
,
),
),
],
)
...
...
@@ -122,10 +130,7 @@ class _ExampleWidgetState extends State<ExampleWidget> {
floatingActionButton:
FloatingActionButton
(
child:
Icon
(
Icons
.
title
),
onPressed:
()
{
ScreenUtil
.
init
(
designSize:
Size
(
750
,
1334
),
allowFontScaling:
false
,
);
ScreenUtil
.
init
(
context
,
designSize:
Size
(
750
,
1334
),
allowFontScaling:
false
);
setState
(()
{});
},
),
...
...
@@ -135,16 +140,13 @@ class _ExampleWidgetState extends State<ExampleWidget> {
void
printScreenInformation
()
{
print
(
'Device width dp:
${ScreenUtil().screenWidth}
'
);
//Device width
print
(
'Device height dp:
${ScreenUtil().screenHeight}
'
);
//Device height
print
(
'Device pixel density:
${ScreenUtil().pixelRatio}
'
);
//Device pixel density
print
(
'Device pixel density:
${ScreenUtil().pixelRatio}
'
);
//Device pixel density
print
(
'Bottom safe zone distance dp:
${ScreenUtil().bottomBarHeight}
'
);
//Bottom safe zone distance,suitable for buttons with full screen
print
(
'Status bar height px:
${ScreenUtil().statusBarHeight}
dp'
);
//Status bar height , Notch will be higher Unit px
print
(
'Ratio of actual width dp to design draft px:
${ScreenUtil().scaleWidth}
'
);
print
(
'Ratio of actual height dp to design draft px:
${ScreenUtil().scaleHeight}
'
);
print
(
'Ratio of actual width dp to design draft px:
${ScreenUtil().scaleWidth}
'
);
print
(
'Ratio of actual height dp to design draft px:
${ScreenUtil().scaleHeight}
'
);
print
(
'The ratio of font and width to the size of the design:
${ScreenUtil().scaleWidth * ScreenUtil().pixelRatio}
'
);
print
(
...
...
example/lib/main_zh.dart
View file @
faa60f9
import
'package:flutter/material.dart'
;
import
'package:flutter_screenutil/flutter_screenutil.dart'
;
import
'text_style.dart'
;
void
main
(
)
{
WidgetsFlutterBinding
.
ensureInitialized
();
//设置适配尺寸 (填入设计稿中设备的屏幕尺寸) 此处假如设计稿是按iPhone6的尺寸设计的(iPhone6 750*1334)
ScreenUtil
.
init
(
designSize:
Size
(
750
,
1334
),
allowFontScaling:
false
);
runApp
(
MyApp
());
}
void
main
(
)
=>
runApp
(
MyApp
());
class
MyApp
extends
StatelessWidget
{
@override
...
...
@@ -19,11 +12,20 @@ class MyApp extends StatelessWidget {
theme:
ThemeData
(
primarySwatch:
Colors
.
blue
,
),
home:
ExampleWidget
(
title:
'FlutterScreenUtil示例'
),
home:
MyHomePage
(
),
);
}
}
class
MyHomePage
extends
StatelessWidget
{
@override
Widget
build
(
BuildContext
context
)
{
//设置适配尺寸 (填入设计稿中设备的屏幕尺寸) 此处假如设计稿是按iPhone6的尺寸设计的(iPhone6 750*1334)
ScreenUtil
.
init
(
context
,
designSize:
Size
(
750
,
1334
),
allowFontScaling:
false
);
return
ExampleWidget
(
title:
'FlutterScreenUtil 示例'
);
}
}
class
ExampleWidget
extends
StatefulWidget
{
const
ExampleWidget
({
Key
key
,
this
.
title
})
:
super
(
key:
key
);
...
...
@@ -55,8 +57,7 @@ class _ExampleWidgetState extends State<ExampleWidget> {
child:
Text
(
'我的宽度:
${0.5.wp}
dp
\n
'
'我的高度:
${ScreenUtil().setHeight(200)}
dp'
,
style:
TextStyle
(
color:
Colors
.
white
,
fontSize:
ScreenUtil
().
setSp
(
24
)),
style:
TextStyle
(
color:
Colors
.
white
,
fontSize:
ScreenUtil
().
setSp
(
24
)),
),
),
Container
(
...
...
@@ -67,9 +68,7 @@ class _ExampleWidgetState extends State<ExampleWidget> {
child:
Text
(
'我的宽度:
${375.w}
dp
\n
'
'我的高度:
${200.h}
dp'
,
style:
TextStyle
(
color:
Colors
.
white
,
fontSize:
ScreenUtil
().
setSp
(
24
))),
style:
TextStyle
(
color:
Colors
.
white
,
fontSize:
ScreenUtil
().
setSp
(
24
))),
),
],
),
...
...
@@ -97,11 +96,17 @@ class _ExampleWidgetState extends State<ExampleWidget> {
children:
<
Widget
>[
Text
(
'我的文字大小在设计稿上是24px,不会随着系统的文字缩放比例变化'
,
style:
ts
.
t2
,
style:
TextStyle
(
color:
Colors
.
black
,
fontSize:
24
.
sp
,
),
),
Text
(
'我的文字大小在设计稿上是24px,会随着系统的文字缩放比例变化'
,
style:
ts
.
t1
,
style:
TextStyle
(
color:
Colors
.
black
,
fontSize:
24
.
ssp
,
),
),
],
)
...
...
@@ -112,6 +117,7 @@ class _ExampleWidgetState extends State<ExampleWidget> {
child:
Icon
(
Icons
.
title
),
onPressed:
()
{
ScreenUtil
.
init
(
context
,
designSize:
Size
(
750
,
1334
),
allowFontScaling:
false
,
);
...
...
example/lib/text_style.dart
deleted
100644 → 0
View file @
115e489
import
'package:flutter/material.dart'
;
import
'package:flutter_screenutil/flutter_screenutil.dart'
;
class
TextStyles
{
TextStyle
t1
=
TextStyle
(
fontSize:
24
.
ssp
,
color:
Colors
.
black
);
TextStyle
t2
=
TextStyle
(
fontSize:
24
.
sp
,
color:
Colors
.
black
);
}
var
ts
=
TextStyles
();
class
TextStyle2
{
static
TextStyle2
ts2
;
factory
TextStyle2
()
{
if
(
ts2
==
null
)
{
ts2
=
TextStyle2
();
}
return
ts2
;
}
TextStyle
t1
=
TextStyle
(
fontSize:
24
.
ssp
,
color:
Colors
.
black
);
TextStyle
t2
=
TextStyle
(
fontSize:
24
.
sp
,
color:
Colors
.
black
);
}
lib/screenutil.dart
View file @
faa60f9
...
...
@@ -4,7 +4,6 @@
*/
import
'package:flutter/material.dart'
;
import
'package:flutter/scheduler.dart'
;
class
ScreenUtil
{
static
ScreenUtil
_instance
;
...
...
@@ -18,26 +17,14 @@ class ScreenUtil {
/// allowFontScaling Specifies whether fonts should scale to respect Text Size accessibility settings. The default is false.
bool
allowFontScaling
=
false
;
double
_pixelRatio
;
double
_screenWidth
;
double
_screenHeight
;
double
_statusBarHeight
;
double
_bottomBarHeight
;
double
_textScaleFactor
;
static
double
_pixelRatio
;
static
double
_screenWidth
;
static
double
_screenHeight
;
static
double
_statusBarHeight
;
static
double
_bottomBarHeight
;
static
double
_textScaleFactor
;
ScreenUtil
.
_
()
{
final
window
=
SchedulerBinding
.
instance
?.
window
;
assert
(
window
!=
null
,
'
\n
You need to explicitly call the `WidgetsFlutterBinding.ensureInitialized()`, before initializing ScreenUtil.'
,
);
_pixelRatio
=
window
.
devicePixelRatio
;
_screenWidth
=
window
.
physicalSize
.
width
/
_pixelRatio
;
_screenHeight
=
window
.
physicalSize
.
height
/
_pixelRatio
;
_statusBarHeight
=
window
.
padding
.
top
/
_pixelRatio
;
_bottomBarHeight
=
window
.
padding
.
bottom
/
_pixelRatio
;
_textScaleFactor
=
window
.
textScaleFactor
;
}
ScreenUtil
.
_
();
factory
ScreenUtil
()
{
assert
(
...
...
@@ -47,7 +34,8 @@ class ScreenUtil {
return
_instance
;
}
static
void
init
({
static
void
init
(
BuildContext
context
,
{
Size
designSize
=
defaultSize
,
bool
allowFontScaling
=
false
,
})
{
...
...
@@ -55,6 +43,13 @@ class ScreenUtil {
_instance
..
uiSize
=
designSize
..
allowFontScaling
=
allowFontScaling
;
MediaQueryData
mediaQuery
=
MediaQuery
.
of
(
context
);
_pixelRatio
=
mediaQuery
.
devicePixelRatio
;
_screenWidth
=
mediaQuery
.
size
.
width
;
_screenHeight
=
mediaQuery
.
size
.
height
;
_statusBarHeight
=
mediaQuery
.
padding
.
top
;
_bottomBarHeight
=
mediaQuery
.
padding
.
bottom
;
_textScaleFactor
=
mediaQuery
.
textScaleFactor
;
}
/// 每个逻辑像素的字体像素数,字体的缩放比例
...
...
@@ -119,9 +114,12 @@ class ScreenUtil {
///Font size adaptation method
///@param [fontSize] The size of the font on the UI design, in px.
///@param [allowFontScaling]
num
setSp
(
num
fontSize
,
{
bool
allowFontScalingSelf
})
=>
allowFontScalingSelf
==
null
?
(
allowFontScaling
?
(
fontSize
*
scaleText
)
:
((
fontSize
*
scaleText
)
/
_textScaleFactor
))
:
(
allowFontScalingSelf
?
(
fontSize
*
scaleText
)
:
((
fontSize
*
scaleText
)
/
_textScaleFactor
));
num
setSp
(
num
fontSize
,
{
bool
allowFontScalingSelf
})
=>
allowFontScalingSelf
==
null
?
(
allowFontScaling
?
(
fontSize
*
scaleText
)
:
((
fontSize
*
scaleText
)
/
_textScaleFactor
))
:
(
allowFontScalingSelf
?
(
fontSize
*
scaleText
)
:
((
fontSize
*
scaleText
)
/
_textScaleFactor
));
}
...
...
pubspec.yaml
View file @
faa60f9
name
:
flutter_screenutil
description
:
A flutter plugin for adapting screen and font size.Guaranteed to look good on different models
version
:
3.
0.2
version
:
3.
1.1
homepage
:
https://github.com/OpenFlutter/flutter_screenutil/tree/beta
environment
:
...
...
Please
register
or
login
to post a comment