我正在制作一个自定义AppBar,它的高度比典型的AppBar高。我也想调整领先的小部件/图标的大小,并利用automaticallyImplyLeading的默认行为(因此菜单图标和后退图标会自动实现)。

这是我认为可以实现的解决方案:

class AppAppBar extends PreferredSize{
  AppAppBar(String title) : super(
    preferredSize: Size.fromHeight(56.0),
    child: AppBar(
      centerTitle: true,
      title: Text(title, style: textStyle)
    )) {
    (child as AppBar).leading =
        SizedBox(width: 30.0, height: 30.0, child: (child as AppBar).leading);
  }

  static const textStyle = TextStyle(fontSize: 32.0);
}

但是当然这是行不通的,因为(child as AppBar).leading是最终的。

因此,在下面的AppBar中(出于说明目的,文本大小显着变大了),我想比较一下自动添加的汉堡包图标。

flutter - 在Flutter AppBar中调整领先小部件的大小-LMLPHP

你怎么看?有解决方案吗?还是我应该放弃自动图标并自己添加它们?

编辑:添加了图像以显示我的意思

最佳答案

您不能,因为它是预定义的小部件。

您可以使用“行”小部件来解决此问题:

Scaffold(
key:_scaffoldKey,
drawer: Drawer(),
appBar: AppBar(
      automaticallyImplyLeading: false
      title: Row(
        mainAxisAlignment: MainAxisAlignment.start,
        crossAxisAlignment: CrossAxisAlignment.center,
        children: <Widget>[
          SizedBox(
              height: 20, // Your Height
              width: 20, // Your width
              child: IconButton( // Your drawer Icon
                      onPressed: () => _scaffoldKey.currentState.openDrawer()),
                      icon: Icon(Icons.arrow_back, color: Colors.white),
          ),)
          // Your widgets here
        ],
      ),
    ),
)

您需要使用 _scaffoldKey.currentState.openDrawer()来打开抽屉的 key 。

automaticImplyLeading:false 将阻止默认抽屉图标。

关于flutter - 在Flutter AppBar中调整领先小部件的大小,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/52082857/

10-11 21:50