Jak*_*sMD 2 dart flutter flutter-layout flutter-web flutter-getx
我的 Flutter 桌面 Web 应用程序具有复杂的用户界面,很难做出响应。因此,我想将其放在一个FittedBox如果用户缩小浏览器窗口时会简单地缩小整个应用程序的应用程序中。
class CustomPage extends StatelessWidget {
final Widget child;
const CustomPage({
Key? key,
required this.child,
}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
body: GetPlatform.isDesktop
? FittedBox(
child: SizedBox(
width: Get.width,
height: Get.height,
child: Center(child: child),
),
)
: Text('Sorry! This was only meant for desktop.'),
);
}
}
Run Code Online (Sandbox Code Playgroud)
但是Get.width并且WidgetsBinding.instance.window.physicalSize.width只能得到初始窗口大小。因此,如果应用程序在全屏浏览器中启动,则效果很好,但如果应用程序在小浏览器中启动,则不起作用。MediaQuery.of(context).size.width只获取当前屏幕尺寸。
有没有办法获取桌面物理屏幕尺寸?
你需要导入
import 'dart:html';
然后window.screen?.width会给window.screen?.height
你物理屏幕尺寸
import 'dart:html';
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) => MaterialApp(debugShowCheckedModeBanner: false, home: Home());
}
class Home extends StatelessWidget {
const Home({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(),
body: LayoutBuilder(builder: (context, c) {
return Center(
child: Text('${window.screen?.width} ${window.screen?.height}'),
);
}),
);
}
}
Run Code Online (Sandbox Code Playgroud)