132.jpg
FittedBox概述
FittedBox组件的作用是对child组件进行缩放和对齐方式的设置，其缩放的参数为fit，有多种选择的方式，而对齐方式alinment用法则和之前一致，即很多都是相通的。
FittedBox构造函数
const FittedBox({
Key key,
this.fit = BoxFit.contain,
this.alignment = Alignment.center,
Widget child,
})
- fit 即
child的缩放方式，比如以下缩放方式：
fill(通过扭曲源的纵横比填充目标框。):
image
contain(尽可能大，同时仍然将源完全包含在目标框中):
image
cover(尽可能小，同时仍然覆盖整个目标框):
image
fitWidth(确保显示了源的全部宽度，不管这是否意味着源垂直地溢出目标框):
image
fitHeight(确保显示源的完整高度，不管这是否意味着源水平地溢出目标框):
image
none(将源文件对齐到目标框内(默认情况下居中)，并丢弃位于框外的源文件的任何部分。
源映像没有调整大小。):
image
scaleDown(将源文件对齐到目标框内(默认情况下，居中)，如果需要，将源文件向下缩放，以确保源文件适合框内，这与contains相同，如果它会收缩图像，则它与none相同):
image
- alignment
child对齐方式
简单示例
// fittedBox
import 'package:flutter/material.dart';
class FittedBoxLearn extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: AppBar(
title: Text('FittedBox'),
),
body: Center(
child: Container(
width: 300,
height: 400,
decoration: BoxDecoration(
border: Border.all(),
),
// 根据内部child伸缩填充父容器
child: FittedBox(
// 填充方式 比如contain 尽可能大，同时仍然将源完全包含在目标框中。 还有cover、fill、fitWidth、fitHeight等方式
fit: BoxFit.contain,
// 对齐方式
alignment: Alignment(0, 0),
child: Container(
color: Colors.blueAccent,
width: 30,
height: 30,
)
),
),
));
}
}
示例效果
E4F43F9BA9B8953BC27488883B30B82F.png
