Nativescript: Remove ActionItem icon border in Android

Created on 11 Jun 2016  路  3Comments  路  Source: NativeScript/NativeScript

How do I remove the border from the icons used with ActionItem with Android, so they look more like Material Design?
captura de tela 2016-06-11 as 12 50 15

I want to make the icons white and flat..

question

All 3 comments

Hello @fmmsilva

I am guessing you are using the built-in system icons like

android.systemIcon = "ic_menu_search" 

This solution can not be styled however you can use a different aproach.
One solution is to use your own material-style icons lin your _app/App_Resource/Android_ where you
should provide images for the different resolutions and then use the like this.

<ActionItem icon="res://my_search_icon"  />

or create your own images folder and use its resource with its relative path

<!-- for example this is image situated in app/images/search.png -->  
<ActionItem icon="~/images/search.png"  />

Another solution is to use Icon Fonts (like IcoMoon and Font Awesome) for creating your icons.

Example app demostrating Icon Fonts usage in NativeScript you can find here
The documentation article about icon fonts : https://docs.nativescript.org/angular/ui/icon-fonts

Thank you!

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

Was this page helpful?
0 / 5 - 0 ratings