qtreewidget子节点和父节点对齐_【Flutter】FittedBox缩放拉伸组件和OverflowBox溢出父容器显示...

FittedBox

当子组件的宽高比和父组件的宽高比不一样时，我们等比拉伸或者填充父组件，这时我们可以使用FittedBox，用法如下：

Container(  height: 150,  width: 150,  color: Colors.yellow,  child: FittedBox(    child: Container(      height: 30,      width: 40,      color: Colors.red,    ),  ),),

效果：

fit参数表示子控件的填充方式，说明如下：

• fill：填充父组件，宽高比发生变化。

• contain：等比拉伸，但子控件不能超出父控件。

• cover：尽可能的小，等比拉伸充满父控件。

• fitWidth：等比拉伸，宽充满父控件。

• fitHeight：等比拉伸，高充满父控件。

• none：默认子控件居中，不做拉伸处理，超出父控件的部分裁剪

• scaleDown：在子控件为Image且缩小的情况和contain一样，否则和none一样。

OverflowBox

溢出父容器显示,允许child超出父容器的范围显示：

OverflowBox({    Key key,    this.alignment = Alignment.center,//对齐方式。    this.minWidth,//允许child的最小宽度。如果child宽度小于这个值，则按照最小宽度进行显示。    this.maxWidth,//允许child的最大宽度。如果child宽度大于这个值，则按照最大宽度进行展示。    this.minHeight,//允许child的最小高度。如果child高度小于这个值，则按照最小高度进行显示。    this.maxHeight,//允许child的最大高度。如果child高度大于这个值，则按照最大高度进行展示。    Widget child,})

OverflowBox，允许child超出parent的范围显示，当然不用这个控件，也有很多种方式实现类似的效果。

• 当OverflowBox的最大尺寸大于child的时候，child可以完整显示

• 当其小于child的时候，则以最大尺寸为基准，当然，这个尺寸都是可以突破父节点的。

• 当最小以及最大宽高度，如果为null的时候，就取父节点的constraint代替。

示例：

Container(  color: Colors.yellowAccent,  width: 200.0,  height: 200.0,  padding: EdgeInsets.all(5.0),  child: OverflowBox(    alignment: Alignment.topLeft,    maxWidth: 300.0,    maxHeight: 500.0,    child: Container(      color: Color(0x33FF0000),      width: 400.0,      height: 400.0,    ),  ),)

效果：

完

  码上加油站

  一起来加油

长按扫码关注

点“在看”你懂得