Nativescript: Cant change actionMenuTextColor color, even if editing style.xml

Created on 5 May 2016  路  5Comments  路  Source: NativeScript/NativeScript

Documentation says that editing style.xml will change menu options color, but I have tried many different codes, but I havent found a solution change the color from actionMenuTextColor

path: app/App_Resources/Android/values/colors.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="ns_primary">#212121</color>
    <color name="ns_primaryDark">#000000</color>
    <color name="ns_mainbg">#E5E5E8</color>
    <color name="ns_accent">#424242</color>
    <color name="ns_blue">#3D5AFE</color>
    <color name="ns_white">#FFFFFF</color>
</resources>

path: app/App_Resources/Android/values/styles.xml

<?xml version="1.0" encoding="utf-8"?>
<resources xmlns:android="http://schemas.android.com/apk/res/android">
    <style name="AppThemeBase" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="toolbarStyle">@style/NativeScriptToolbarStyle</item>

        <item name="colorPrimary">@color/ns_primary</item>
        <item name="colorPrimaryDark">@color/ns_primaryDark</item>
        <item name="colorAccent">@color/ns_accent</item>

        <item name="actionMenuTextColor">@color/ns_white</item>

    </style>

    <style name="AppTheme" parent="AppThemeBase">
    </style>

    <style name="NativeScriptToolbarStyleBase" parent="Widget.AppCompat.Toolbar">
        <item name="android:background">@color/ns_primary</item>
        <item name="theme">@style/ThemeOverlay.AppCompat.ActionBar</item>
        <item name="popupTheme">@style/ThemeOverlay.AppCompat</item>
    </style>

    <style name="NativeScriptToolbarStyle" parent="NativeScriptToolbarStyleBase">
    </style>
</resources> 

captura de tela 2016-05-05 as 16 53 49

obs.: I have tried this solution on a clean installation.
NativeScript 2.0

question

Most helpful comment

To change color of ActionBar overflow button color, add the following in styles.xml:-
<item name="colorControlNormal">#fff</item>
OR
<item name="android:textColorSecondary">@color/ns_white</item>

When you apply any of the above, it also changes the color of the bottom border of TextField, seemingly making it look borderless on a white background.

My environment is:

nativescript - 3.4.3 - Up to date
tns-core-modules - 3.4.1 - Up to date
tns-android - 3.4.2 - Up to date
tns-ios - 3.4.1 - Not installed

Is it not possible to only set a color for the overflow button from ActionBar without affecting anything else?

All 5 comments

Hi @calebeaires ,

I have made a little research about changing dots color on ActionBar. Actually I found that you could change the icon color by adding this line:
<item name="android:textColorSecondary">@color/ns_white</item> in your styles.xml. I am attaching the sample code:

app/App_Resources/Android/values/styles.xml

<?xml version="1.0" encoding="utf-8"?>
<resources xmlns:android="http://schemas.android.com/apk/res/android">
      <style name="AppThemeBase" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="toolbarStyle">@style/NativeScriptToolbarStyle</item>

        <item name="colorPrimary">@color/ns_primary</item>
        <item name="colorPrimaryDark">@color/ns_primaryDark</item>
        <item name="colorAccent">@color/ns_white</item>
        <item name="android:textColorSecondary">@color/ns_white</item>
        <item name="android:textColorPrimary">@color/ns_white</item>
        <item name="actionMenuTextColor">@color/ns_white</item>

    </style>

    <style name="AppTheme" parent="AppThemeBase">
    </style>

    <style name="NativeScriptToolbarStyleBase" parent="Widget.AppCompat.Toolbar">
        <item name="android:background">@color/ns_primaryDark</item>
        <item name="theme">@style/ThemeOverlay.AppCompat.ActionBar</item>
        <item name="popupTheme">@style/ThemeOverlay.AppCompat</item>
    </style>

    <style name="NativeScriptToolbarStyle" parent="NativeScriptToolbarStyleBase">
    </style>
</resources> 

I hope this helps.

It worked. Very thanks for your help.

To change color of ActionBar overflow button color, add the following in styles.xml:-
<item name="colorControlNormal">#fff</item>
OR
<item name="android:textColorSecondary">@color/ns_white</item>

When you apply any of the above, it also changes the color of the bottom border of TextField, seemingly making it look borderless on a white background.

My environment is:

nativescript - 3.4.3 - Up to date
tns-core-modules - 3.4.1 - Up to date
tns-android - 3.4.2 - Up to date
tns-ios - 3.4.1 - Not installed

Is it not possible to only set a color for the overflow button from ActionBar without affecting anything else?

I have the same question as @venkateshsj
is there a way to change the color of the overflow button only?

Hi all, I have tried this to change android.systemIcon="ic_menu_back" color to white but it did not work.
My ActionBar background is blue and icon is blueish, like transparent. It follows the background color.
How to change that?

Was this page helpful?
0 / 5 - 0 ratings