“解决方案”

Question

我想使用导航视图项选择器添加带有圆角矩形的波纹效果。但是它一直在添加灰色矩形波纹效果。

导航视图

for (let x of user) {

drawer_item_bg.xml

<android.support.design.widget.NavigationView
    android:id="@+id/navigation_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom"
    android:layout_marginStart="8dp"
    android:layout_marginTop="8dp"
    android:layout_marginEnd="8dp"
    app:itemIconTint="@color/drawer_item"
    app:itemTextColor="@color/drawer_item"
    app:itemBackground="@drawable/drawer_item_bg"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:menu="@menu/bottom_app_bar_menu"/>

custom_ripple_navitem.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">

<item android:state_checked="true" android:drawable="@drawable/drawer_selected_item_bg"/>
<item android:state_checked="false" android:drawable="@android:color/transparent"/>
<item android:state_pressed="true" android:drawable="@drawable/custom_ripple_navitem"/>
<item android:state_selected="true" android:drawable="@drawable/custom_ripple_navitem"/>
<item android:state_focused="true" android:drawable="@drawable/custom_ripple_navitem"/>

结果是

Answer 1

使用材料组件，您可以使用类似以下内容的

：

<com.google.android.material.navigation.NavigationView
      app:itemShapeAppearanceOverlay="@style/ShapeAppearanceOverlay.NavItem.Rounded"
      app:itemShapeFillColor="@color/selector_navitem"
      android:theme="@style/ThemeOverlay.NavItem.Ripple"
      ../>

使用 app:itemShapeAppearanceOverlay 属性，您可以为每个项目定义自定义形状：

  <style name="ShapeAppearanceOverlay.NavItem.Rounded" parent="">
      <item name="cornerFamily">rounded</item>
      <item name="cornerSize">8dp</item>
  </style>

使用 app:itemShapeFillColor 属性，您可以定义用于填充形状的颜色：

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

最后使用 android:theme 覆盖涟漪使用的颜色。

  <style name="ThemeOverlay.NavItem.Ripple" parent="">
    <item name="android:colorControlHighlight">@android:color/transparent</item>
  </style>

注意：它需要材料组件库的版本1.1.0。

Answer 2

“解决方案”

当我发现this问题时，我开始尝试波纹效应，一段时间后，我完成了这段代码。

注意：这不是真正的连锁反应，只是伪造的。让我知道您是否会对其进行改进。

@ layout / your_layout.xml

<android.support.design.widget.NavigationView
    ...
    android:theme="@style/Widget_NavigationItem_NoRipple"
    app:itemBackground="@drawable/drawer_item_background"/>

@ values / styles.xml

<style name="Widget_NavigationItem_NoRipple">
    <item name="android:colorControlHighlight">@android:color/transparent</item>
</style>

@ drawable / drawer_item_background.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/drawer_item_shape" android:state_checked="true"/>
    <item android:drawable="@drawable/drawer_item_ripple" android:state_pressed="true"/>
    <item android:drawable="@android:color/transparent" android:state_pressed="false"/>
</selector>

@ drawable / drawer_item_shape

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <corners android:radius="8dp"/>
            <solid android:color="@color/selectedItemBackgroundColor"/>
        </shape>
    </item>
</layer-list>

@ drawable / drawer_item_ripple

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="@android:color/transparent">
    <item>
        <shape android:shape="rectangle">
            <corners android:radius="8dp"/>
            <solid android:color="?attr/colorControlHighlight"/>
        </shape>
    </item>
</ripple>

在NavigationView菜单项上使用选择器添加自定义形状波纹

2 个答案:

“解决方案”