FractionallySizedBox 百分比布局

main.dart

import 'package:flutter/material.dart';

void main() {
  runApp(MaterialApp(
    title: "FractionallySizedBox百分比布局",
    home: LayoutDemo(),
  ));
}

class LayoutDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("FractionallySizedBox百分比布局"),
      ),
      body: Container(
        color: Colors.blueGrey,
        height: 200.0,
        width: 200.0,
        child: FractionallySizedBox(
          alignment: Alignment.topLeft,
//          宽度因子
          widthFactor: 0.5,
//          高度因子
          heightFactor: 1.5,
          child: Container(
            color: Colors.green,
          ),
        ),
      ),
    );
  }
}