代码 > flutter中自适应缩放窗口

2023-11-21

做网页有个常见的偷懒方法,网页中设置一个最小宽度,这样手机浏览器小于这个宽度时会自动缩放。

flutter里用FittedBox实现这个功能

minWitdh是最小宽度。

height可选,不填写根据父元素约束的maxHeight计算

 

import 'package:flutter/material.dart';

class Fullscreen extends StatelessWidget {
const Fullscreen(
{super.key, required this.child, required this.minWidth, this.height});
final Widget child;
//fixed raw widget height
//Use constraints.maxHeight if null.
final double? height;
final double minWidth;
@override
Widget build(BuildContext context) {
return LayoutBuilder(builder: (cotext, constraints) {
Widget body = child;
final widgetHeight =
height jQuery33100915512005582535_1700544202060 constraints.maxHeight / constraints.maxWidth * minWidth;
if (constraints.maxWidth < minWidth) {
body = FittedBox(
fit: BoxFit.fitWidth,
child: SizedBox(
width: minWidth,
height: widgetHeight,
child: child,
));
}
return body;
});
}
}
点击登录