Flutter LimitedBox


简介

对最大宽高进行限制的控件(前提是LimitedBox不受约束)

  • 即:将child限制在指定的最大宽高中
  • 这就使得child自身没有约束大小的时候具有了外部约束,依然控制了其大小
  • 例如:通过给LimitedBox最大高度(maxHeight),widget通常会调整其自身的大小去适应父窗体,但是,当放置在竖直(cloumn)列表中时,它将采用给定的高度

基本用法

widget 限制child最大宽高,如下:

  • 如果LimitedBox外部宽度没有被约束,child的宽受到LimitedBox最大宽度(maxWidth)属性限制
  • 同理,LimitedBox外部高度没有约束,child的高受到LimitedBox最大高度(maxHeight)属性限制

实例演示

import 'package:flutter/widgets.dart';
import 'package:flutter/material.dart';

class LimitedBoxDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
      children: <Widget>[
        Container(
          width: 100,
          height: 100,
          color: Color(0xfff8bbd0),
          child: Text(
            "100 * 100",
            style: TextStyle(color: Colors.white),
          ),
        ),
        LimitedBox(
          maxWidth: 100,
          maxHeight: 100,
          child: Container(
            width: 250,
            height: 300,
            child: Text(
              "250 * 300",
              style: TextStyle(color: Colors.white),
            ),
            color: Color(0xfff48fb1),
          ),
        )
      ],
    );
  }
}

class LimitedBoxColumnDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
      children: <Widget>[
        SizedBox(
          child: Text("Column 列表下效果"),
        ),
        Container(
          width: 100,
          height: 100,
          color: Color(0xfff8bbd0),
          child: Text(
            "100 * 100",
            style: TextStyle(color: Colors.white),
          ),
        ),
        SizedBox(height: 10.0),
        LimitedBox(
          maxWidth: 100,
          maxHeight: 100,
          child: Container(
            width: 250,
            height: 300,
            child: Text(
              "250 * 300",
              style: TextStyle(color: Colors.white),
            ),
            color: Color(0xfff48fb1),
          ),
        )
      ],
    );
  }
}