简体   繁体   English

Flutter Cupertino 图标不显示

[英]Flutter Cupertino Icon not displaying

I am new to Flutter and I am trying to create a navigation bar with two icons on the two sides of the bar.我是 Flutter 的新手,我正在尝试在导航栏的两侧创建一个带有两个图标的导航栏。 I am using Windows Android Studio and the android emulator there.我在那里使用 Windows Android Studio 和 android 仿真器。

However, currently, only the trailing icon is displaying but not the leading icon.但是,目前只显示尾随图标,而不显示前导图标。 I am not sure why is this happening (is it because I am using an android emulator?).我不确定为什么会发生这种情况(是因为我使用的是 android 仿真器吗?)。 Would appreciate some help here.希望能得到一些帮助。 Thanks!谢谢!

Edited: When the bar is collapsed, the leading icon does not show as well, even though it shares the same code as the trailing icon.编辑:当栏折叠时,前导图标也不会显示,即使它与尾随图标共享相同的代码。 I have tried googling around but it seems like it is not a common problem?我试过用谷歌搜索,但似乎这不是一个常见的问题?

在此处输入图像描述

This is my code snippet:这是我的代码片段:

home.dart主页.dart

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return CupertinoPageScaffold(
      child: NestedScrollView(
        headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
          return <Widget>[
            Heading(
              headingTitle: 'Ambisense',
              leadingIcon: Icon(CupertinoIcons.bars),
              trailingIcon: Icon(CupertinoIcons.gear_alt_fill),
            )
          ];
        },
        body: Center(
          child: Text('Home Page'),
        )
      ),
    );
  }

heading.dart标题.dart

class Heading extends StatelessWidget with ObstructingPreferredSizeWidget {
  final String headingTitle;
  final Icon leadingIcon;
  final Icon trailingIcon;

  Heading({
    @required this.headingTitle,
    @required this.leadingIcon,
    @required this.trailingIcon
  });

  @override
  Widget build(BuildContext context) {
    return CupertinoSliverNavigationBar(
      largeTitle: Text(headingTitle),
      leading: this.leadingIcon,
      trailing: this.trailingIcon,
    );
  }

  @override
  // TODO: implement preferredSize
  Size get preferredSize => throw UnimplementedError();

  @override
  bool shouldFullyObstruct(BuildContext context) {
    // TODO: implement shouldFullyObstruct
    throw UnimplementedError();
  }
}

I suspect the problem is with using the android emulator since Cupertino is designed to work on ioS.我怀疑问题出在使用 android 仿真器上,因为 Cupertino 设计用于 ioS。 I have tried using some other CupertinoIcons, some appear and some do not.我尝试过使用其他一些 CupertinoIcons,有些出现,有些没有。 However, a workaround to the problem is to use the Icon collection from the Material class instead of CupertinoIcons.但是,解决该问题的方法是使用来自 Material class 的图标集合,而不是 CupertinoIcons。

I was looking for a Menu Icon so IconData(0xf2fb, fontFamily: 'MaterialIcons') was used instead.我正在寻找一个菜单图标,因此使用了IconData(0xf2fb, fontFamily: 'MaterialIcons')

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

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