flutter_package / flutter_screenutil

Go to a project
Toggle navigation Toggle navigation pinning
LiZhuoyuan
bc930722 1 parent 6ea15291

3.1.0 

fix #153 #154
Inline Side-by-side
Showing 10 changed files with 105 additions and 109 deletions
{
"is-bot": true,
"redisplay-welcome-message": false
}
... ...
... ... @@ -5,6 +5,11 @@
* @LastEditTime: 2020年6月20日 11:20:02
* @Description: Update log
-->
# 3.1.0
- Use the way back to v2 version
- Modify registration method
# 3.0.2+1
- Guide users to use V2 version
... ...
# Please use [v2](https://pub.flutter-io.cn/packages/flutter_screenutil/versions/2.3.1),[v3](https://pub.flutter-io.cn/packages/flutter_screenutil/versions/3.0.2) now has some bugs.
# flutter_screenutil
[![pub package](https://img.shields.io/pub/v/flutter_screenutil.svg)](https://pub.dev/packages/flutter_screenutil)
... ... @@ -30,7 +28,7 @@ dependencies:
flutter:
sdk: flutter
# add flutter_screenutil
flutter_screenutil: ^2.3.1
flutter_screenutil: ^3.1.0
```
### Add the following imports to your Dart code:
```
... ... @@ -59,13 +57,13 @@ void main() {
//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);
```
... ...
# 请使用[v2](https://pub.flutter-io.cn/packages/flutter_screenutil/versions/2.3.1),[v3](https://pub.flutter-io.cn/packages/flutter_screenutil/versions/3.0.2)现在有一些bug
# flutter_ScreenUtil
[![pub package](https://img.shields.io/pub/v/flutter_screenutil.svg)](https://pub.dartlang.org/packages/flutter_screenutil)
... ... @@ -35,7 +33,7 @@ dependencies:
flutter:
sdk: flutter
# 添加依赖
flutter_screenutil: ^2.3.1
flutter_screenutil: ^3.1.0
```
### 在每个使用的地方导入包：
```
... ... @@ -64,13 +62,13 @@ void main() {
}
//默认 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);
```
... ... @@ -182,12 +180,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
... ... @@ -198,11 +194,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);
... ... @@ -234,8 +239,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(
... ... @@ -246,9 +250,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))),
),
],
),
... ... @@ -276,11 +278,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,
),
),
],
)
... ... @@ -291,7 +299,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(() {});
... ...
# Please use [v2](https://pub.flutter-io.cn/packages/flutter_screenutil/versions/2.3.1),[v3](https://pub.flutter-io.cn/packages/flutter_screenutil/versions/3.0.2) now has some bugs.
# flutter_screenutil
[![pub package](https://img.shields.io/pub/v/flutter_screenutil.svg)](https://pub.dartlang.org/packages/flutter_screenutil)
... ... @@ -30,7 +28,7 @@ dependencies:
flutter:
sdk: flutter
# add flutter_screenutil
flutter_screenutil: ^2.3.1
flutter_screenutil: ^3.1.0
```
### Adicione o seguinte import em seu código Dart:
... ... @@ -60,13 +58,13 @@ void main() {
}
//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);
```
... ...
... ... @@ -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,6 +40,9 @@ class ExampleWidget extends StatefulWidget {
class _ExampleWidgetState extends State<ExampleWidget> {
@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);
printScreenInformation();
return Scaffold(
appBar: AppBar(
... ... @@ -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(() {});
},
),
... ... @@ -151,4 +156,3 @@ class _ExampleWidgetState extends State<ExampleWidget> {
print('0.5 times the screen height:${0.5.hp}');
}
}
... ...
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,
);
... ...
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);
}
... ... @@ -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,
'\nYou 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;
}
/// 每个逻辑像素的字体像素数，字体的缩放比例
... ...
name: flutter_screenutil
description: A flutter plugin for adapting screen and font size.Guaranteed to look good on different models
version: 3.0.2+1
version: 3.1.0
homepage: https://github.com/OpenFlutter/flutter_screenutil/tree/beta
environment:
... ...