I made a YouTube like transition in android studio using motion layout but all the button inside that layout is not working maybe due to may on swipe method applied in activity_main_scene.xml
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.motion.widget.MotionLayout 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:layout_width="match_parent"
android:layout_height="match_parent"
app:layoutDescription="@xml/activity_main_scene"
android:id="@+id/parent_layout"
tools:context=".MainActivity">
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/my_recycler_view"
android:layout_width="0dp"
android:layout_height="0dp"
android:scrollbars="vertical"
app:layout_constraintBottom_toTopOf="@+id/constraintLayout"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.337"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:listitem="@layout/audio_list_layout">
</androidx.recyclerview.widget.RecyclerView>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/constraintLayout"
android:layout_width="0dp"
android:layout_height="70dp"
android:background="@color/colorPrimary"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
<ProgressBar
android:id="@+id/progressBar"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="0dp"
android:layout_height="4dp"
android:layout_centerInParent="true"
android:orientation="horizontal"
android:progress="90"
app:layout_constraintEnd_toEndOf="@id/constraintLayout"
app:layout_constraintStart_toStartOf="@id/constraintLayout"
app:layout_constraintTop_toTopOf="@id/constraintLayout" />
<SeekBar
android:id="@+id/seekBar"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:visibility="invisible"
app:layout_constraintEnd_toEndOf="@id/constraintLayout"
app:layout_constraintStart_toStartOf="@id/constraintLayout"
app:layout_constraintTop_toTopOf="@id/constraintLayout" />
<TextView
android:id="@+id/titleView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:ellipsize="marquee"
android:focusable="true"
android:focusableInTouchMode="true"
android:marqueeRepeatLimit="marquee_forever"
android:maxWidth="220dp"
android:scrollHorizontally="true"
android:singleLine="true"
app:layout_constraintBottom_toBottomOf="@id/constraintLayout"
app:layout_constraintStart_toStartOf="@id/constraintLayout"
app:layout_constraintTop_toTopOf="@id/constraintLayout" />
<TextView
android:id="@+id/startTime"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="16dp"
android:visibility="invisible"
android:layout_marginStart="16dp"
android:text="@string/_00_00"
app:layout_constraintBottom_toBottomOf="@id/seekBar"
app:layout_constraintStart_toStartOf="@id/constraintLayout" />
<TextView
android:id="@+id/EndTime"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="16dp"
android:visibility="invisible"
android:layout_marginEnd="16dp"
android:text="@string/_00_00"
app:layout_constraintBottom_toBottomOf="@id/seekBar"
app:layout_constraintEnd_toEndOf="@id/constraintLayout" />
<ImageButton
android:id="@+id/close"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="?attr/selectableItemBackground"
android:contentDescription="@string/close"
android:padding="10dp"
android:visibility="invisible"
app:layout_constraintBottom_toBottomOf="@id/constraintLayout"
app:layout_constraintEnd_toEndOf="@id/constraintLayout"
app:layout_constraintTop_toTopOf="@id/constraintLayout"
app:srcCompat="@drawable/ic_white_baseline_keyboard_arrow_down_32" />
<ImageButton
android:id="@+id/playPause"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="?attr/selectableItemBackground"
android:contentDescription="@string/playPause"
android:padding="10dp"
app:layout_constraintBottom_toBottomOf="@id/constraintLayout"
app:layout_constraintEnd_toStartOf="@+id/next"
app:layout_constraintTop_toTopOf="@id/constraintLayout"
app:srcCompat="@drawable/ic_white_baseline_play_arrow_32" />
<ImageButton
android:id="@+id/next"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="?attr/selectableItemBackground"
android:contentDescription="@string/next"
android:padding="10dp"
app:layout_constraintBottom_toBottomOf="@id/constraintLayout"
app:layout_constraintEnd_toEndOf="@+id/constraintLayout"
app:layout_constraintTop_toTopOf="@id/constraintLayout"
app:srcCompat="@drawable/ic_white_baseline_skip_next_32" />
<ImageButton
android:id="@+id/start"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="?attr/selectableItemBackground"
android:contentDescription="@string/previous"
android:padding="10dp"
app:layout_constraintBottom_toBottomOf="@id/constraintLayout"
app:layout_constraintEnd_toStartOf="@id/playPause"
app:layout_constraintTop_toTopOf="@id/constraintLayout"
app:srcCompat="@drawable/ic_white_baseline_skip_previous_32" />
</androidx.constraintlayout.motion.widget.MotionLayout>
activity_main_scene.xml
<?xml version="1.0" encoding="utf-8"?>
<MotionScene
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:motion="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools">
<Transition
motion:constraintSetStart="@id/start"
motion:constraintSetEnd="@id/end"
motion:duration="400"
motion:motionInterpolator="linear">
<OnSwipe
motion:maxAcceleration="800"
motion:dragDirection="dragUp"
motion:touchRegionId="@id/constraintLayout"
motion:touchAnchorId="@+id/constraintLayout"
motion:touchAnchorSide="top" />
<KeyFrameSet>
</KeyFrameSet>
<OnClick motion:targetId="@+id/close" />
</Transition>
<ConstraintSet android:id="@+id/start">
<Constraint
android:id="@+id/my_recycler_view"
android:layout_width="0dp"
android:layout_height="0dp"
android:scrollbars="vertical"
motion:layout_constraintBottom_toTopOf="@+id/constraintLayout"
motion:layout_constraintEnd_toEndOf="parent"
motion:layout_constraintHorizontal_bias="0.337"
motion:layout_constraintStart_toStartOf="parent"
motion:layout_constraintTop_toTopOf="parent"
tools:listitem="@layout/audio_list_layout"
/>
<Constraint
android:id="@+id/constraintLayout"
android:layout_width="0dp"
android:layout_height="70dp"
android:background="@color/colorPrimary"
motion:layout_constraintBottom_toBottomOf="parent"
motion:layout_constraintEnd_toEndOf="parent"
motion:layout_constraintStart_toStartOf="parent"
/>
<Constraint
android:id="@+id/progressBar"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="0dp"
android:layout_height="4dp"
android:layout_centerInParent="true"
android:orientation="horizontal"
android:progress="90"
motion:layout_constraintEnd_toEndOf="@id/constraintLayout"
motion:layout_constraintStart_toStartOf="@id/constraintLayout"
motion:layout_constraintTop_toTopOf="@id/constraintLayout"
/>
<Constraint
android:id="@+id/seekBar"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:visibility="invisible"
motion:layout_constraintEnd_toEndOf="@id/constraintLayout"
motion:layout_constraintStart_toStartOf="@id/constraintLayout"
motion:layout_constraintTop_toTopOf="@id/constraintLayout"
/>
<Constraint
android:id="@+id/startTime"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="16dp"
android:visibility="invisible"
android:layout_marginStart="16dp"
android:text="@string/_00_00"
motion:layout_constraintBottom_toBottomOf="@id/seekBar"
motion:layout_constraintStart_toStartOf="@id/constraintLayout" />
<Constraint
android:id="@+id/EndTime"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="16dp"
android:visibility="invisible"
android:layout_marginEnd="16dp"
android:text="@string/_00_00"
motion:layout_constraintBottom_toBottomOf="@id/seekBar"
motion:layout_constraintEnd_toEndOf="@id/constraintLayout" />
<Constraint
android:id="@+id/titleView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:ellipsize="marquee"
android:focusable="true"
android:focusableInTouchMode="true"
android:marqueeRepeatLimit="marquee_forever"
android:maxWidth="220dp"
android:scrollHorizontally="true"
android:singleLine="true"
android:textColor="#000000"
motion:layout_constraintBottom_toBottomOf="@id/constraintLayout"
motion:layout_constraintStart_toStartOf="@id/constraintLayout"
motion:layout_constraintTop_toTopOf="@id/constraintLayout"
/>
<Constraint
android:id="@+id/close"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="?attr/selectableItemBackground"
android:contentDescription="@string/close"
android:visibility="invisible"
android:padding="10dp"
motion:layout_constraintBottom_toBottomOf="@id/constraintLayout"
motion:layout_constraintEnd_toEndOf="@id/constraintLayout"
motion:layout_constraintTop_toTopOf="@id/constraintLayout"
motion:srcCompat="@drawable/ic_white_baseline_keyboard_arrow_down_32"
/>
<Constraint
android:id="@+id/playPause"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="?attr/selectableItemBackground"
android:contentDescription="@string/playPause"
android:padding="10dp"
motion:layout_constraintBottom_toBottomOf="@id/constraintLayout"
motion:layout_constraintEnd_toStartOf="@+id/next"
motion:layout_constraintTop_toTopOf="@id/constraintLayout"
motion:srcCompat="@drawable/ic_white_baseline_play_arrow_32"
/>
<Constraint
android:id="@+id/next"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="?attr/selectableItemBackground"
android:contentDescription="@string/next"
android:padding="10dp"
motion:layout_constraintBottom_toBottomOf="@id/constraintLayout"
motion:layout_constraintEnd_toEndOf="@+id/constraintLayout"
motion:layout_constraintTop_toTopOf="@id/constraintLayout"
motion:srcCompat="@drawable/ic_white_baseline_skip_next_32"
/>
<Constraint
android:id="@+id/start"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="?attr/selectableItemBackground"
android:contentDescription="@string/previous"
android:padding="10dp"
motion:layout_constraintBottom_toBottomOf="@id/constraintLayout"
motion:layout_constraintEnd_toStartOf="@id/playPause"
motion:layout_constraintTop_toTopOf="@id/constraintLayout"
motion:srcCompat="@drawable/ic_white_baseline_skip_previous_32"
/>
</ConstraintSet>
<ConstraintSet android:id="@+id/end">
<Constraint
android:id="@+id/my_recycler_view"
android:layout_width="0dp"
android:layout_height="0dp"
android:scrollbars="vertical"
motion:layout_constraintBottom_toTopOf="@+id/constraintLayout"
motion:layout_constraintEnd_toEndOf="parent"
motion:layout_constraintStart_toStartOf="parent"
motion:layout_constraintTop_toTopOf="parent"
tools:listitem="@layout/audio_list_layout"
/>
<Constraint
android:id="@+id/constraintLayout"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="@color/colorPrimary"
motion:layout_constraintBottom_toBottomOf="parent"
motion:layout_constraintEnd_toEndOf="parent"
motion:layout_constraintStart_toStartOf="parent"
motion:layout_constraintTop_toTopOf="parent"
/>
<Constraint
android:id="@+id/progressBar"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="0dp"
android:layout_height="4dp"
android:layout_centerInParent="true"
android:orientation="horizontal"
android:progress="90"
android:visibility="invisible"
motion:layout_constraintEnd_toEndOf="@id/constraintLayout"
motion:layout_constraintTop_toTopOf="@id/constraintLayout"
/>
<Constraint
android:id="@+id/seekBar"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="32dp"
motion:layout_constraintBottom_toTopOf="@+id/playPause"
motion:layout_constraintEnd_toEndOf="@id/constraintLayout"
motion:layout_constraintStart_toStartOf="@id/constraintLayout"
/>
<Constraint
android:id="@+id/startTime"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="32dp"
android:layout_marginStart="16dp"
android:text="@string/_00_00"
motion:layout_constraintBottom_toBottomOf="@id/seekBar"
motion:layout_constraintStart_toStartOf="@id/constraintLayout" />
<Constraint
android:id="@+id/EndTime"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="32dp"
android:layout_marginEnd="16dp"
android:text="@string/_00_00"
motion:layout_constraintBottom_toBottomOf="@id/seekBar"
motion:layout_constraintEnd_toEndOf="@id/constraintLayout" />
<Constraint
android:id="@+id/titleView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="72dp"
android:ellipsize="marquee"
android:focusable="true"
android:focusableInTouchMode="true"
android:marqueeRepeatLimit="marquee_forever"
android:maxWidth="220dp"
android:scrollHorizontally="true"
android:singleLine="true"
android:textColor="#000000"
motion:layout_constraintBottom_toTopOf="@+id/seekBar"
motion:layout_constraintEnd_toEndOf="@id/constraintLayout"
motion:layout_constraintStart_toStartOf="@id/constraintLayout"
/>
<Constraint
android:id="@+id/close"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="?attr/selectableItemBackground"
android:contentDescription="@string/close"
android:padding="10dp"
motion:layout_constraintStart_toStartOf="@id/constraintLayout"
motion:layout_constraintTop_toTopOf="@id/constraintLayout"
motion:srcCompat="@drawable/ic_white_baseline_keyboard_arrow_down_32"
/>
<Constraint
android:id="@+id/playPause"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="64dp"
android:background="?attr/selectableItemBackground"
android:contentDescription="@string/playPause"
android:padding="10dp"
motion:layout_constraintBottom_toBottomOf="@id/constraintLayout"
motion:layout_constraintEnd_toStartOf="@+id/next"
motion:layout_constraintStart_toEndOf="@+id/start"
motion:srcCompat="@drawable/ic_white_baseline_play_arrow_32"
/>
<Constraint
android:id="@+id/next"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="64dp"
android:background="?attr/selectableItemBackground"
android:contentDescription="@string/next"
android:padding="10dp"
motion:layout_constraintBottom_toBottomOf="@id/constraintLayout"
motion:layout_constraintEnd_toEndOf="@id/constraintLayout"
motion:layout_constraintStart_toEndOf="@+id/playPause"
motion:srcCompat="@drawable/ic_white_baseline_skip_next_32"
/>
<Constraint
android:id="@+id/start"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="64dp"
android:background="?attr/selectableItemBackground"
android:contentDescription="@string/previous"
android:padding="10dp"
motion:layout_constraintBottom_toBottomOf="@id/constraintLayout"
motion:layout_constraintEnd_toStartOf="@+id/playPause"
motion:layout_constraintHorizontal_bias="0.49"
motion:layout_constraintStart_toStartOf="@id/constraintLayout"
motion:srcCompat="@drawable/ic_white_baseline_skip_previous_32"
/>
</ConstraintSet>
</MotionScene>
And the rendered scene of start and end is shown below
[1
The black bar below is the one having change on and all the button are now working because of it only the motion layout works
Even buttons, seekbar don't show any animation on click just acts as being disabled because of motion layout
activity_main_scene.xml
(line 16)
I changed
motion:touchRegionId="@id/constraintLayout"
to
motion:touchRegionId="@id/parent_layout"
and it's now working properly