美文网首页
Flutter(十三)ConstrainedBox

Flutter(十三)ConstrainedBox

作者: 天色将变 | 来源:发表于2019-07-17 13:14 被阅读0次
属性
ConstrainedBox({
    Key key,
    @required this.constraints,
    Widget child,
  }) 
const BoxConstraints({
    this.minWidth = 0.0,
    this.maxWidth = double.infinity,
    this.minHeight = 0.0,
    this.maxHeight = double.infinity,
  });
  • 通过constraints,为child增加约束,child必须符合constraints,不符合部分按constraints里定义的来处理。
  • 可以指定最小宽高和最大宽高,如果指定的最小宽和最大宽是同一个值,相当于指定了子widget的宽度为固定值。


    image.png
class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: ConstrainedBox(
//          constraints: BoxConstraints.expand(),//child尽可能大
//          constraints: BoxConstraints.tightFor(width: 120, height: 120), //指定宽高
//          constraints: BoxConstraints.tightForFinite(),// 指定宽高,但有默认值,无限大
          constraints: BoxConstraints(
              minWidth: 100, maxWidth: 300, minHeight: 100, maxHeight: 300),
          child: Container(
            color: Colors.blue,
            height: 10,
            width: 1000,
          )),
    );
  }
}

如上代码:

  • constraints做里最小宽度高度和最大宽度高度的约束。
  • child内定义了自己的宽高,但都在constraints之外,因此显示时按constraints的约束显示的。
多个ConstraintedBox嵌套时,最内部的child要符合外层所有的条件。比如嵌套时minWidth=10,minWidth = 40,minWidth=60,那么minWidth=60为准。
欢迎添加我的微信号:zrf540592766
欢迎关注我的公众号:Flutter和Dart开发实践
让我们共同学习进步,It is never too late to learn!
image.png

相关文章

网友评论

      本文标题:Flutter(十三)ConstrainedBox

      本文链接:https://www.haomeiwen.com/subject/fwrqlctx.html