farheen farheen - 1 month ago 6
Android Question

popup menu items on listView are not visible

I am using an image button on ListView which shows a popup menu when clicked.
But the problem is that items are not visible.
This is how menu looks.I can see white text on menu in this image but on mobile screen it is invisible.
enter image description here

This is styles.xml

<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">

<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
<item name="android:colorBackground">@color/colorPrimary</item>
<item name="android:textColorPrimary">@android:color/black</item>
<item name="android:textColorSecondary">#fcfcfc</item>
<item name="android:actionMenuTextColor">@color/black</item>
</style>

<style name="itemTextStyle.AppTheme" parent="@android:style/TextAppearance.Widget.IconMenu.Item">
<item name="android:textColor">@android:color/black</item>
<item name="android:colorBackground">@color/colorPrimary</item>

</style>

<!-- LoginCreateText -->
<style name="LoginCreateText">
<item name="android:textSize">@dimen/login_buttons_text_size</item>
<item name="android:textColor">@android:color/white</item>
<item name="android:layout_margin">2dp</item>
</style>

<!-- LoginCreateTextButton -->
<style name="LoginCreateTextButton">
<item name="android:textSize">@dimen/login_buttons_text_size</item>
<item name="android:textStyle">bold</item>
<item name="android:textColor">@android:color/white</item>
<item name="android:layout_margin">2dp</item>
<item name="android:clickable">true</item>
</style>

<style name="HintText">
<item name="android:textSize">0dp</item>
</style>

<style name="FAB">
<item name="android:layout_margin">0dp</item>
<item name="fabSize">normal</item>
<item name="rippleColor">@android:color/white</item>
<item name="backgroundTint">@color/colorAccent</item>
</style>

<style name="ListItemText">
<item name="android:textColor">@color/light_black</item>
<item name="android:textSize">@dimen/list_item_text_size</item>
<item name="android:layout_margin">2dp</item>
</style>
</resources>


This is themes.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="Widget.Button.Login" parent="android:Widget.Button">
<item name="android:paddingLeft">18dp</item>
<item name="android:paddingRight">16dp</item>
<item name="android:textSize">@dimen/login_buttons_text_size</item>
<item name="android:layout_gravity">center</item>
<item name="android:background">@color/colorPrimary</item>
</style>

<style name="Toolbar" parent="@style/Widget.AppCompat.Light.ActionBar">
<item name="android:itemTextAppearance">@style/itemTextStyle.AppTheme</item>
<item name="android:background">@color/colorPrimary</item>
<item name="android:textColorPrimary">@android:color/white</item>
</style>
<style name="CustomTheme.Dialog" parent="Theme.AppCompat.Light.Dialog"/>
</resources>


This is the menu which I am trying to display.

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android"
app:popupTheme="@style/itemTextStyle.AppTheme">

<item
android:id="@+id/action_edit"
android:title="@string/action_edit" />

<item
android:id="@+id/action_delete"
android:title="@string/action_delete"/>

<item
android:id="@+id/action_assign"
android:title="@string/action_assign"
android:checkable="true"/>

<item
android:id="@+id/action_mark"
android:title="@string/action_mark"
android:enabled="false"/>
</menu>


This is layout file for Quiz Fragment.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/rl_fragment_quiz_lists"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/grey"
app:popupTheme="@style/itemTextStyle.AppTheme"
tools:context=".ui.fragments.QuizFragment">

<include layout="@layout/single_active_list" />

<ListView
android:id="@+id/list_view_active_lists"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="none" />

<android.support.design.widget.FloatingActionButton xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/fab"
style="@style/FAB"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:onClick="showAddQuizDialog"
android:src="@drawable/ic_add_quiz"
app:borderWidth="0dp"
app:elevation="6dp"
app:pressedTranslationZ="12dp">
<!--app:rippleColor="@android:color/white" /> -->
</android.support.design.widget.FloatingActionButton>

</RelativeLayout>


This is the layout file of the activity in which this fragment is displayed.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/grey"
android:orientation="vertical">

<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/app_bar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:theme="@style/Toolbar" />

<android.support.design.widget.TabLayout
android:id="@+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/Toolbar" />

<android.support.v4.view.ViewPager
android:id="@+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>


I have tried many solutions that were asked before ( all were about toolbar menu) but none worked for me.
I defined a new style in styles.xml

<style name="itemTextStyle.AppTheme" parent="@android:style/TextAppearance.Widget.IconMenu.Item">
<item name="android:textColor">@android:color/black</item>
<item name="android:colorBackground">@color/colorPrimary</item>


and included it in AppTheme which didn't work.then I included it in toolbar style, menu layout, QuizFragment layout but items were still invisible.How to change the background color or item color of menu to fix this, any one will work.

Answer

Try this

style.xml

<style name="CustomActionBarTheme" parent="@style/Theme.AppCompat">
    <item name="android:actionOverflowButtonStyle">@style/OverflowButton</item>
    <item name="actionOverflowButtonStyle">@style/OverflowButton</item>
    <item name="windowNoTitle">true</item>
    <item name="windowActionBar">false</item>
    <item name="android:dropDownListViewStyle">@style/PopupMenuListView</item>
    <item name="dropDownListViewStyle">@style/PopupMenuListView</item>
    <item name="actionOverflowMenuStyle">@style/OverflowMenu</item>
    <item name="actionBarDivider">@null</item>
    <!-- OverFlow Menu Text Color -->
    <item name="android:textColor">@color/black</item>
</style>

<!-- OverFlow menu Styles -->
<style name="PopupMenuListView" parent="@style/Widget.AppCompat.Light.ListView.DropDown">
    <item name="android:divider">@color/black</item>
    <item name="android:dividerHeight">1dp</item>
    <item name="android:background">@color/white</item>
</style>

<style name="OverflowMenu" parent="Widget.AppCompat.PopupMenu.Overflow">
    <!-- Required for pre-Lollipop. -->
    <item name="overlapAnchor">false</item>
    <!-- Required for Lollipop. -->
    <item name="android:overlapAnchor">false</item>
    <item name="android:dropDownVerticalOffset">4.0dip</item>
</style>

and define theme for Activity in AndroidManifest.xml

<activity
 android:name=".YourActivityName"
 android:theme="@style/CustomActionBarTheme"/>
Comments