简体   繁体   English

如何删除 appBar 中的抽屉图标和颤动中的搜索图标之间的填充

[英]how you can remove the padding between the icon for the drawer in the appBar and the Search Icon in flutter

i make appBar and add a drawer to it and also search icon the problem there is padding between the icon for the Drawer and the search icon And I can't get rid of it我制作了appBar并向其添加了一个抽屉并搜索图标抽屉图标和搜索图标之间存在填充问题我无法摆脱它

this the code:这是代码:

class _HomeState extends State<Home> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        titleSpacing: 0,
        title: Row(
          mainAxisAlignment: MainAxisAlignment.start,
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            IconButton(
              icon: Icon(Icons.search),
              onPressed: () {},
            ),
          ],
        ),
        
        backgroundColor: Color(0xffffffff),
        elevation: 1,
        toolbarHeight: 40.0,
        iconTheme: IconThemeData(color: Colors.grey),
      ),
      drawer: Drawer(
        child: ListView(
          children: <Widget>[],
        ),
      ),
      body: Container(
        height: MediaQuery.of(context).size.height,
        width: MediaQuery.of(context).size.width,
        color: Color(0xfffafafa),
        child: Text("hello"),
      ),
    );
  }
}

Wrapping your search button with this will reduce the padding.用这个包裹你的搜索按钮将减少填充。

Not sure how much of the padding you wanted to remove.不确定您要删除多少填充。

SizedBox(
  width: 10.0,
  child: IconButton(
    padding: EdgeInsets.zero,
    icon: Icon(Icons.search),
    onPressed: () {},
  ),
),

Add this lines to remove default padding of IconButton:添加此行以删除 IconButton 的默认填充:

IconButton(
     constraints: BoxConstraints(),
     padding: const EdgeInsets.all(0),),

Try like this像这样尝试

appBar: AppBar(
      title: Text(title),
      backgroundColor: kPrimaryLightColor,
      actions: <Widget>[
        Padding(
            padding: EdgeInsets.only(right: 20.0),
            child: GestureDetector(
              onTap: () {},
              child: Icon(
                Icons.message_rounded,
                size: 30.0,
              ),
            )),

Solution 1解决方案 1

Just add a property called "titleSpacing" in your AppBar Tag,只需在 AppBar 标签中添加一个名为“titleSpacing”的属性,

Sample样本

appBar: AppBar(
        titleSpacing: 0,     //Add this line to your code
        title: Text(widget.title),
        leading: Icon(Icons.android),
        ),

Solution 2解决方案 2

Or wrap your title with "Transform.translate" and Add property "offset".或者用“Transform.translate”包装你的标题并添加属性“offset”。

sample样本

title: Transform.translate(
       offset: Offset(-30.0, 0.0),
       child: Text('your app title')
       ),

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

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