flutter-布局-FittedBox

FittedBox 控制 缩放 ,对齐

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Scaffold(
        appBar: AppBar(
          title: Text('布局控件 - Container'),
        ),
        body: Container(
//          color: Colors.yellow,
          width: 300,
          height: 300,
          margin: EdgeInsets.fromLTRB(30, 30, 0, 0),
          decoration: BoxDecoration(
              color: Colors.yellow,
              border: Border.all(
                width: 2.0,
                color: Colors.red,
              )
          ),
          child: FittedBox(
            fit: BoxFit.none,
            alignment: Alignment.centerLeft,
            child: Container(
              width: 40,
              height: 40,
              color: Colors.green,
            ),
//            child: Image.network('https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1562152312793&di=b390f18cdeffee92e03b470e326d94e6&imgtype=0&src=http%3A%2F%2Fimg1.gtimg.com%2Fcomic%2Fpics%2Fhv1%2F16%2F135%2F2122%2F138017491.jpg'),
          ),
        ),
      ),
    );
  }
}

FittedBox会在自己的尺寸范围内缩放并且调整child位置，使得child适合其尺寸。做过移动端的，可能会联想到ImageView控件，它是将图片在其范围内，按照规则，进行缩放位置调整。FittedBox跟ImageView是有些类似的，可以猜测出，它肯定有一个类似于ScaleType的属性。