使用LayoutBuilder的代码sample
import 'package:flutter/material.dart';
void main(List<String> args) {
runApp(
const MaterialApp(
home: MainPage(),
debugShowCheckedModeBanner: false,
),
);
}
class MainPage extends StatefulWidget {
const MainPage({super.key});
@override
State<MainPage> createState() => _MainPageState();
}
class _MainPageState extends State<MainPage> {
@override
Widget build(BuildContext context) {
return Scaffold(
body: LayoutBuilder(
builder: (context, constraints) {
if (constraints.maxWidth < 600) {
return _buildNarrowScreen();
} else {
return _buildWideScreen();
}
},
),
);
}
Widget _buildNarrowScreen() {
return Center(
child: Container(
color: Colors.yellow,
width: 100,
height: 100,
),
);
}
Widget _buildWideScreen() {
return Center(
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Container(
color: Colors.red,
width: 100,
height: 100,
),
Container(
color: Colors.blue,
width: 100,
height: 100,
),
],
),
);
}
}