Skip to content Skip to sidebar Skip to footer

Changing Navigationview Background To Round Shape Not Working When Pressed

I am setting navigation item background using app:itemBackground in layout:

Solution 1:

With the NavigationView in the MaterialComponents libarry you can use:

  • app:itemShapeAppearanceOverlay attribute to define a custom shape for the each item
  • app:itemShapeFillColor attribute to define the color used to fill the shape

Something like:

  <com.google.android.material.navigation.NavigationView
      app:itemShapeFillColor="@color/selector_menu"
      app:itemShapeAppearanceOverlay="@style/ShapeAppearanceOverlay.Nav"
      android:theme="@style/ThemeOverlay.NavigationView"
      ../>

where the selector is something like:

<?xml version="1.0" encoding="utf-8"?><selectorxmlns:android="http://schemas.android.com/apk/res/android"><itemandroid:alpha="0.50"android:color="@color/primaryColor"android:state_pressed="true"/><itemandroid:alpha="0.12"android:color="@color/primaryColor"android:state_activated="true"/><itemandroid:alpha="0.12"android:color="@color/primaryColor"android:state_checked="true"/><itemandroid:color="@android:color/transparent"/></selector>

and the shape is defined by:

<stylename="ShapeAppearanceOverlay.Nav"parent=""><itemname="cornerFamily">rounded</item><itemname="cornerSizeTopRight">50%</item><itemname="cornerSizeBottomRight">50%</item><itemname="cornerSizeBottomLeft">0dp</item><itemname="cornerSizeTopLeft">0dp</item></style>

Also use the android:theme to override the color used by the ripple.

<stylename="ThemeOverlay.NavigationView"parent=""><itemname="android:colorControlHighlight">@android:color/transparent</item></style>

enter image description here

Solution 2:

I'm not sure what you want but I think this will solve your problem.

nav_item_background_round.xml

<?xml version="1.0" encoding="UTF-8"?><ripplexmlns:android="http://schemas.android.com/apk/res/android"xmlns:tools="http://schemas.android.com/tools"android:color="#f816a463"tools:targetApi="lollipop"><itemandroid:id="@android:id/mask"><shapeandroid:shape="rectangle"><solidandroid:color="#f816a463" /></shape></item></ripple>

Solution 3:

I also had the same issue. I resolved it by

First - Adding a custom style to my navigationView app:theme="@style/NavigationDrawerStyle"

<com.google.android.material.navigation.NavigationView
    android:id="@+id/nav_view"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    android:fadingEdge="none"
    android:fitsSystemWindows="true"
    android:overScrollMode="never"
    app:itemIconPadding="12dp"
    app:itemBackground="@drawable/drawer_background_selector"
    app:headerLayout="@layout/nav_header_main"
    app:itemIconTint="@drawable/drawer_item_icon_color"
    app:itemTextColor="@drawable/drawer_item_text_color"
    app:theme="@style/NavigationDrawerStyle"
    app:menu="@menu/activity_main_drawer" >

Second - Then in my styles.xml created a custom drawer style NavigationDrawerStyle then setting colorControlHighlight to transparent which removed the rectangular shape for me.

<stylename="NavigationDrawerStyle"parent="ThemeOverlay.AppCompat.navTheme"><itemname="android:textSize">14sp</item><itemname="android:fontFamily">@font/robotomedium</item><itemname="android:colorControlHighlight">@android:color/transparent</item><!--Here Removes Rectangle--></style>

Post a Comment for "Changing Navigationview Background To Round Shape Not Working When Pressed"