为什么 LinearLayout 触摸动画会出现在错误的元素上？答案

【问题标题】：Why is LinearLayout touch animation occurring on wrong element?为什么 LinearLayout 触摸动画会出现在错误的元素上？
【发布时间】：2022-01-23 04:50:11
【问题描述】：

我有一个由嵌套的线性布局组成的 Android 片段。屏幕底部包含 4 个用作按钮的 LinearLayout（class_btn_1、class_btn_2、class_btn_3 和 class_btn_4）。该程序是Android / Java。一切都按预期在代码中工作。但是，系统对任何“按钮”的触摸动画总是出现在第 4 个按钮上，无论 4 个按钮中的哪一个被点击。有人知道为什么会这样吗？

配置信息：

        minSdkVersion 27 // API version for Moto G5 is 27
        targetSdkVersion 31

依赖版本：

    implementation 'androidx.appcompat:appcompat:1.4.0'
    implementation 'androidx.constraintlayout:constraintlayout:2.1.2'
    implementation 'androidx.preference:preference:1.1.1'

片段定义的 XML。按钮位于定义底部附近。

<layout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto">

  <androidx.constraintlayout.widget.ConstraintLayout
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:background="?attr/colorButtonNormal"
      android:focusable="false"
      tools:context="com.google.learning.brain.mobile.transfer.android.MainActivity">

    <SurfaceView
        android:id="@+id/preparedImagePreview"
        android:layout_width="280dp"
        android:layout_height="280dp"
        android:layout_marginTop="4dp"
        android:visibility="visible"
        app:layout_constraintEnd_toEndOf="@+id/classes_bar"
        app:layout_constraintStart_toStartOf="@+id/classes_bar"
        app:layout_constraintTop_toTopOf="parent" />


    <TextView
        android:id="@+id/sharpness"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/ValueNotSet"
        android:textSize="12sp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@+id/preparedImagePreview"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/className"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="4dp"
        android:text="@string/unclassified"
        android:textColor="@color/design_default_color_on_secondary"
        app:layout_constraintEnd_toStartOf="@+id/classImageStats"
        app:layout_constraintHorizontal_bias="0.25"
        app:layout_constraintStart_toStartOf="@id/preparedImagePreview"
        app:layout_constraintTop_toBottomOf="@+id/preparedImagePreview" />

    <TextView
        android:id="@+id/classImageStats"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="4dp"
        android:text="@string/ValueNotSet"
        android:textColor="@color/design_default_color_on_secondary"
        android:visibility="visible"
        app:layout_constraintEnd_toEndOf="@id/preparedImagePreview"
        app:layout_constraintStart_toEndOf="@+id/className"
        app:layout_constraintTop_toBottomOf="@+id/preparedImagePreview" />

    <TextView
        android:id="@+id/logDateEntry"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/StringValueNotSet"
        android:textColor="@android:color/white"
        android:textSize="18sp"
        app:layout_constraintEnd_toEndOf="@+id/preparedImagePreview"
        app:layout_constraintStart_toStartOf="@+id/preparedImagePreview"
        app:layout_constraintTop_toTopOf="@+id/preparedImagePreview" />

    <TextView
        android:id="@+id/logClassName"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/StringValueNotSet"
        android:textColor="?attr/colorAccent"
        android:textSize="18sp"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="@+id/preparedImagePreview"
        app:layout_constraintEnd_toEndOf="@+id/preparedImagePreview"
        app:layout_constraintStart_toStartOf="@+id/preparedImagePreview" />

    <Spinner
        android:id="@+id/modeSpinner"
        style="@style/Widget.AppCompat.Spinner"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="16dp"
        android:layout_marginEnd="14dp"
        android:entries="@array/train_mode"
        app:layout_constraintEnd_toStartOf="@+id/deleteImgButton"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintStart_toStartOf="@+id/preparedImagePreview"
        app:layout_constraintTop_toBottomOf="@+id/classImageStats" />

    <Button
        android:id="@+id/deleteImgButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="4dp"
        android:text="@string/delete_image_button"
        app:layout_constraintEnd_toEndOf="@+id/preparedImagePreview"
        app:layout_constraintTop_toBottomOf="@+id/classImageStats" />

    <LinearLayout
        android:id="@+id/classes_bar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:baselineAligned="false"
        android:focusable="false"
        android:focusableInTouchMode="false"
        app:layout_constraintBottom_toTopOf="@+id/classes_bar2"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent">

      <LinearLayout
          android:id="@+id/class_btn_1"
          style="@style/ClassButton"
          android:layout_width="0dp"
          android:layout_height="wrap_content"
          android:layout_margin="2dp"
          android:layout_weight=".25"
          android:focusable="false"
          android:focusableInTouchMode="false"
          android:orientation="vertical"
          android:paddingTop="4dp"
          android:paddingBottom="4dp"
          android:touchscreenBlocksFocus="true">

        <TextView
            android:id="@+id/textLabel11"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:focusable="false" />

        <TextView
            android:id="@+id/textLabel12"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:focusable="false"
            android:tag="subtitle"
            android:textSize="12sp" />

        <TextView
            android:id="@+id/textLabel13"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:focusable="false"
            android:tag="subtitle"
            android:textSize="12sp" />
      </LinearLayout>

      <LinearLayout
          android:id="@+id/class_btn_2"
          style="@style/ClassButton"
          android:layout_width="0dp"
          android:layout_height="wrap_content"
          android:layout_margin="2dp"
          android:layout_weight=".25"
          android:focusable="false"
          android:focusableInTouchMode="false"
          android:orientation="vertical"
          android:paddingTop="4dp"
          android:paddingBottom="4dp"
          android:touchscreenBlocksFocus="true">

        <TextView
            android:id="@+id/textLabel21"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:focusable="false" />

        <TextView
            android:id="@+id/textLabel22"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:focusable="false"
            android:tag="subtitle"
            android:textSize="12sp" />

        <TextView
            android:id="@+id/textLabel23"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:focusable="false"
            android:tag="subtitle"
            android:textSize="12sp" />
      </LinearLayout>
    </LinearLayout>

    <LinearLayout
        android:id="@+id/classes_bar2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:baselineAligned="false"
        android:focusable="false"
        android:focusableInTouchMode="false"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent">

      <LinearLayout
          android:id="@+id/class_btn_3"
          style="@style/ClassButton"
          android:layout_width="0dp"
          android:layout_height="wrap_content"
          android:layout_margin="2dp"
          android:layout_weight=".25"
          android:focusable="false"
          android:focusableInTouchMode="false"
          android:orientation="vertical"
          android:paddingTop="4dp"
          android:paddingBottom="4dp"
          android:touchscreenBlocksFocus="true">

        <TextView
            android:id="@+id/textLabel31"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:focusable="false" />

        <TextView
            android:id="@+id/textLabel32"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:focusable="false"
            android:tag="subtitle"
            android:textSize="12sp" />

        <TextView
            android:id="@+id/textLabel33"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:focusable="false"
            android:tag="subtitle"
            android:textSize="12sp" />
      </LinearLayout>

      <LinearLayout
          android:id="@+id/class_btn_4"
          style="@style/ClassButton"
          android:layout_width="0dp"
          android:layout_height="wrap_content"
          android:layout_margin="2dp"
          android:layout_weight=".25"
          android:focusable="false"
          android:focusableInTouchMode="false"
          android:orientation="vertical"
          android:paddingTop="4dp"
          android:paddingBottom="4dp"
          android:touchscreenBlocksFocus="true">

        <TextView
            android:id="@+id/textLabel41"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:focusable="false" />

        <TextView
            android:id="@+id/textLabel42"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:focusable="false"
            android:tag="subtitle"
            android:textSize="12sp" />

        <TextView
            android:id="@+id/textLabel43"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:focusable="false"
            android:tag="subtitle"
            android:textSize="12sp" />
      </LinearLayout>
    </LinearLayout>

    <TextView
        android:id="@+id/trainInstruction"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toTopOf="@+id/classes_bar"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent" />

  </androidx.constraintlayout.widget.ConstraintLayout>

</layout>

我希望有人能理解这一点。谢谢。

【问题讨论】：

标签： java android touch android-linearlayout

【解决方案1】：

嗯，这似乎是材料设计和 Android 中较旧的 UI 设计支持功能之间的冲突。我的问题的主要解决方法是从按钮定义中删除样式设置：

style="@style/ClassButton"

另一个允许保留“波纹”触摸动画的更改是更改按钮背景：

android:background="@drawable/btn_default_ripple"

其中 btn_default_ripple.xml 是一个可绘制对象，它将典型的按钮背景可绘制对象包装在波纹标记中：

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
        android:color="?android:colorControlHighlight">
    <item android:drawable="@drawable/btn_default_bg" />
</ripple>

我忘了提到使用的材料的依赖关系，它是：

implementation 'com.google.android.material:material:1.3.0'

这些变化似乎消除了奇怪的触摸动画。

【讨论】：