search

nativescript-community / ui-material-components

Monorepo that contains all of the NativeScript Material Design plugins.
https://nativescript-community.github.io/ui-material-components/
Apache License 2.0
218 stars 80 forks source link

Bottom Navigation Bar - Webfonts as icon #322

Open csimpi opened 3 years ago

csimpi commented 3 years ago

How can I add font-awesome icons to the tabs? I saw this as a workaround, but this feels nuts, more like avoiding the issue than fixing it:

https://github.com/nativescript-community/ui-material-components/issues/225#issuecomment-848049332

Is there any better approach? This package should handle this out of the box on template level.

farfromrefug commented 3 years ago

@csimpi it works the same way as in any N component and is explain on N website and in the issue you linked. The Vue demo app works well so it should work with angular too. If there is an issue might be angular related. I will live this open for now for you but i wont fix any angular issue.

csimpi commented 3 years ago

@farfromrefug Wrong, it doesn't work the same way as documented. Why I would've asked about this ??? By joke or what? Don't be rude, and please click to the link and see not I'm the only one who couldn't use it. The workaround is not a solution it's a BAD practice that should be corrected. This UI package and the documentation are terribly unprofessional

farfromrefug commented 3 years ago

@csimpi ok i am not the rude one here. If you dont like that COMMUNITY handled package, then dont use it... If you think there is an issue why not try to replicate it in a core sample project? Then i could fix it.

Finally thank you for your nice comment, seeing your great contributions to OSS i really appreciate it.

fpaaske commented 2 years ago

I was also experimenting with bottom-navigation-bar, and was a bit confused by how to use font icons. The example that threw me off was this example:

<BottomNavigationTab
  title="First"
  icon="res://ic_home"
  src="font://&#xF2Dc;" class="mdi"
></BottomNavigationTab>

Since icon is referring to a resource and src a font icon, I believed that this is how it should be used.

Of course the documentation says otherwise, or at least hints that src is no longer a thing.

So now I do it like this, and it works very well:

<BottomNavigationTab class="custom-font-icons" icon="font://&#xe928;">
</BottomNavigationTab>

Hopefully this can save some time for the next person working on this 👍

farfromrefug commented 2 years ago

@fpaaske thanks a lot for pointing this out. I will fix the example!