9

Two questions. I thought it might be wiser to combine them because they are related very closely.

Why are there not more/all icons?

Looking at the constants of the CupertinoIcons class I was able to make out that there are 35 icons in CupertinoIcons.

The documentation page says about this map:

a map of the icons in this icons font.

I would expect that all those icons would also be featured in CupertinoIcons, there are just 374 missing as there are 409 icons featured on the map.

For me CupertinoIcons is slightly useless with just the 35 icons, which I can access without having cupertino_icons in my pubspec.yaml.

I figured that installing cupertino_icons might change something.

What does the plugin actually do?

Now, that I installed the cupertino_icons plugin, nothing changed. I still have access to the exactly same 35 icons as before (and they are being displayed with and without the plugin).

Does this happen because my device already has the font installed and thus does not need the cupertino_icons plugin in order to work?

creativecreatorormaybenot
  • 114,516
  • 58
  • 291
  • 402
  • It seems iOS support had a bit less prio than material design, but is currently being worked on. I'd just create a feature request in the Flutter repo. – Günter Zöchbauer Jun 29 '18 at 18:03
  • `material_icons` and `cupertino_icons` plugins are for other OS that don't natively possess these fonts. If you need more icons, feel free to submit a pull request – Rémi Rousselet Jun 29 '18 at 18:23
  • @RémiRousselet In my question I described how I am able to use the **35** Cupertino icons without having the plugin installed *on Android*. Why is that? – creativecreatorormaybenot Jun 29 '18 at 19:14

2 Answers2

7

The plugin makes sure that the necessary assets (fonts) are included.

If you look at the source, you can easily replicate the constants defined in there as long as they exist in the font. And since Flutter is open source, you could certainly create a PR for that if you identify other useful icons in there that you think should be exposed to users.

As to why ... it probably just hasn't been prioritized by anyone at this point. It's somewhat tedious work to find, name, and expose those icons - and I'd imagine a lot of people that do it just end up figuring "ok I'm done now" rather than contributing it back to the project.

You can see a fuller listing of the icons contained in the font here. You could use any of those icons, even if it's not already defined in the cupertino icons class. For example, if you wanted the baseball icon for some reason:

const IconData baseball = const IconData(
  0xf4ba, 
  fontFamily: CupertinoIcons.iconFont, 
  fontPackage: CupertinoIcons.iconFontPackage);

It'd be entirely possible to add this as a pull request to https://github.com/flutter/flutter/blob/master/packages/flutter/lib/src/cupertino/icons.dart - but I imagine it's not in there because it's not seen as commonly used or necessary, or perhaps because someone didn't get to it yet.

Either way, you still need the cupertino_icons package, because that will ensure that the .ttf file is included in your app (which the app will need to render the icon at runtime). But if you don't plan to use them, don't include it, as it will cause your app to be larger than it needs to be (the extra font will take space).

Dan Field
  • 20,885
  • 5
  • 55
  • 71
  • I do not quite understand how I can use them. You described it like all of the icons on the map are in fact available to me. Also you wrote that *"The plugin makes sure that the necessary assets (fonts) are included."* Do I need to specify `cupertino_icons` in my pubspec or not? Or better: When do I need to specify `cupertino_icons` as a plugin? – creativecreatorormaybenot Jun 29 '18 at 19:11
  • You should specify it if you're using them. That will ensure that the font underlying them gets included. I'll update my answer to clarify... – Dan Field Jun 29 '18 at 19:15
  • Thank you for the update. You know, I just did not realize that the little boxes contained the hex number for each icon :) – creativecreatorormaybenot Jun 29 '18 at 19:23
3

cupertino_icons is here to make sure the cupertino font is included, even in OS that don't include it natively. Such as Fushia or Android.

Using cupertino icons on android without this package installed will result in a graphical error :

enter image description here

You should include cupertino_icons in your dependencies if you use the enum CupertinoIcons

There's also an equivalent for material design. But it's not a package. Instead it's a property you need to set inside your pubspec.yaml :

flutter:
  uses-material-design: true

The following line ensures that the Material Icons font is included with your application, so that you can use the icons in the material Icons class.

Rémi Rousselet
  • 256,336
  • 79
  • 519
  • 432