繁体   English   中英

使用填充时,应用栏中的操作图标溢出

[英]Action icon overflown in App Bar when using padding

我有一个仅包含一个动作的AppBar,它是一个图标。 我在图标周围放了一些填充,现在有一些溢出,因此图标被剪切了。

在此处输入图片说明

这是我的代码:

 appBar: PreferredSize(
        preferredSize: Size.fromHeight(100.0),
        child: AppBar(
          backgroundColor: Theme.of(context).backgroundColor,
          elevation: 10,
          actions: <Widget>[
            Container(),
            Padding(
              padding: EdgeInsets.only(right: 25, top: 40),
              child: SizedBox(
                child: Icon(
                  Icons.settings,
                  color: HexColor('#FF4848'),
                  size: 30,
                ),
              ),
            )
          ],
        ),

那是因为您使用PreferredSize。 现在,您必须使用flexibleSpace放置小部件,

PreferredSize(
    preferredSize: Size.fromHeight(100.0),
    child: AppBar(
        backgroundColor: Theme.of(context).backgroundColor,
        elevation: 10,
        flexibleSpace: Row(
          mainAxisAlignment: MainAxisAlignment.end,
          children: <Widget>[
            Padding(
              padding: EdgeInsets.only(right: 25, top: 80),
              child: SizedBox(
                child: Icon(
                  Icons.settings,
                  color: Colors.red,
                  size: 30,
                ),
              ),
            ),
          ],
        )));

我使用appBar底部

  return new Scaffold(
  appBar: PreferredSize(
    preferredSize: Size.fromHeight(100.0) ,
    child: AppBar(
      backgroundColor: Theme.of(context).backgroundColor,
      elevation: 10,
      bottom: PreferredSize(
        preferredSize: const Size.fromHeight(100.0),
        child: Theme(
          data: Theme.of(context).copyWith(accentColor: Colors.white),
          child: Container(
            height: 100.0,
            alignment: Alignment.centerRight ,
            child: Padding(
              padding: EdgeInsets.only(right: 25, top: 40),
              child: SizedBox(
                child: Icon(
                  Icons.settings,
                  color: Colors.red,
                  size: 30,
                ),
              ),
            ),
            ),
          ),
        ),
      ),
  ),
  body: new Text('hello world'),
);

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM