Flutter学习之布局、交互、动画，了解Android架构组件后构建APP超简单

在Flutter中，可以使用LayoutBuilder来实现一个简单的动态布局。以下是一个示例代码：

import 'package:flutter/material.dart';
 
void main() => runApp(MyApp());
 
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('动态布局示例'),
        ),
        body: LayoutBuilder(
          builder: (context, constraints) {
            // 根据可用空间动态调整布局
            return constraints.maxWidth > 800
                ? Row(
                    children: <Widget>[
                      Expanded(
                        child: Container(
                          color: Colors.red,
                        ),
                      ),
                      Expanded(
                        child: Container(
                          color: Colors.blue,
                        ),
                      ),
                    ],
                  )
                : Column(
                    children: <Widget>[
                      Expanded(
                        child: Container(
                          color: Colors.red,
                        ),
                      ),
                      Expanded(
                        child: Container(
                          color: Colors.blue,
                        ),
                      ),
                    ],
                  );
          },
        ),
      ),
    );
  }
}

这段代码中，LayoutBuilder根据父组件提供的约束条件（如最大宽度）来动态决定其子Widget的布局结构。如果最大宽度大于800，则使用Row来排列两个Expanded子Widget，否则使用Column。这样，应用在不同大小的屏幕上都能展示出合适的布局。