如何自动调整Flutter中的图标大小

Jac*_*pap 10 flutter

目前,我正在使用以下代码:

   body: new Container(
            child: new Column(
                crossAxisAlignment: CrossAxisAlignment.stretch,
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: <Widget>[
              new MaterialButton(
                height: 120.0,
                child: new Column(
                  children: <Widget>[
                    new Icon(
                      Icons.av_timer,
                      size: 100.0,
                    ),
                    new Text('TIMER'),
                  ],
                ),
                onPressed: null,
              ),
              new MaterialButton(
                height: 120.0,
                child: new Column(
                  children: <Widget>[
                    new Icon(Icons.alarm_add, size: 100.0),
                    new Text('ALARM'),
                  ],
                ),
                onPressed: null,
              )
            ])));
Run Code Online (Sandbox Code Playgroud)

但是,我必须将Icon大小"硬编码"为100.0,将MaterialButton的高度"硬编码"为120.0.

我希望MaterialButton占用尽可能多的空间(每个屏幕占50%),我希望这些图标能够"很好地适应"该空间,理想情况下还有文本缩放.

我还没有找到在Flutter中做到这一点的方法.如果尝试这样做不是一个好主意(我希望在任何设备上使用屏幕的整个空间),请告诉我原因?

Cop*_*oad 22

截屏:

在此输入图像描述


使用FittedBox

SizedBox.fromSize(
  size: Size.fromRadius(200),
  child: FittedBox(
    child: Icon(Icons.add),
  ),
)
Run Code Online (Sandbox Code Playgroud)


Rém*_*let 13

您可以使用LayoutBuilder在构建期间动态获取父级大小.

一个工作的例子:

适合的图标

void main() {
  runApp(new MaterialApp(
    home: new TestIcon(),
  ));
}

class TestIcon extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new Container(
      color: Colors.white,
      child: new LayoutBuilder(builder: (context, constraint) {
        return new Icon(Icons.access_alarms, size: constraint.biggest.height);
      }),
    );
  }
}
Run Code Online (Sandbox Code Playgroud)