I have an Android Fragment consisting of nested LinearLayouts. The bottom of the screen consists of 4 LinearLayouts that act as buttons (class_btn_1, class_btn_2, class_btn_3, and class_btn_4). The program is Android/Java. Everything works in the code as expected. But, the system's touch animation for any of the "buttons" always appears on the 4th button, regardless of which of the 4 buttons are tapped. Anyone know why that may be?
Config info:
minSdkVersion 27 // API version for Moto G5 is 27
targetSdkVersion 31
Versions of dependencies:
implementation 'androidx.appcompat:appcompat:1.4.0'
implementation 'androidx.constraintlayout:constraintlayout:2.1.2'
implementation 'androidx.preference:preference:1.1.1'
Xml for the Fragment definition. The buttons are near the bottom of the definition.
<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>
I'm hoping someone can make sense of this. Thanks.
Well, this appears to be a clash between material design and older UI design support functions in Android. The main fix for my issue was to REMOVE the style setting from the button definitions:
style="@style/ClassButton"
The other change that allowed retaining the "ripple" touch animation was to change the button background:
android:background="@drawable/btn_default_ripple"
where btn_default_ripple.xml is a drawable that wraps a typical button background drawable within the ripple tag:
<?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>
I forgot to mention the dependency for material being used, it was:
implementation 'com.google.android.material:material:1.3.0'
These changes seem to have eliminated the odd touch animations.