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

发布时间：2020-12-14 14:52:25 所属栏目：百科来源：网络整理

导读：目前,我正在使用以下代码： body: new Container( child: new Column( crossAxisAlignment: CrossAxisAlignment.stretch,mainAxisAlignment: MainAxisAlignment.spaceEvenly,children: Widget[ new MaterialButton( height: 120.0,child: new Column( childr

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

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'),)
            ])));

但是,我不得不将Icon大小“硬编码”为100.0,将MaterialButton的高度“硬编码”为120.0.

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

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

解决方法

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

一个工作的例子：

fit icon

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);
      }),);
  }
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!