Jeroen
Jeroen

Reputation: 404

MotionLayout in android doesn't work with multiple OnClick transitions

I'm having an issue with the MotionLayout. I have created a scene and it works when I'm using one onClick transition. But I need to have two.

What I want to do is: When clicking on a button in view one this view will hide and another view will show. This works. But now when I click a button in the other view, I want to show the first view and the second needs to hide.

This sort of works, only problem is that it doesn't do it with a transition. It just shows.

My scene looks like:

<?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">

<Transition
    motion:constraintSetEnd="@+id/end"
    motion:constraintSetStart="@+id/start"
    motion:duration="2000"
    motion:motionInterpolator="easeOut">
    <OnClick
        motion:clickAction="transitionToEnd"
        motion:targetId="@+id/hide_menu" />
</Transition>

<Transition
    motion:constraintSetEnd="@+id/end"
    motion:constraintSetStart="@+id/start"
    motion:duration="2000"
    motion:motionInterpolator="easeInOut">
    <OnClick
        motion:clickAction="transitionToStart"
        motion:targetId="@+id/quick_menu_show_menu" />
</Transition>

<ConstraintSet android:id="@+id/start">
    <Constraint
        android:id="@+id/sidebar"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:translationX="0dp"
        motion:layout_constraintBottom_toBottomOf="parent"
        motion:layout_constraintStart_toStartOf="parent"
        motion:layout_constraintTop_toTopOf="parent" />

    <Constraint
        android:id="@+id/quick_menu"
        android:layout_width="19dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="4dp"
        android:translationX="-70dp"
        motion:layout_constraintBottom_toBottomOf="parent"
        motion:layout_constraintStart_toStartOf="parent"
        motion:layout_constraintTop_toTopOf="parent" />
</ConstraintSet>

<ConstraintSet android:id="@+id/end">
    <Constraint
        android:id="@+id/sidebar"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:translationX="-70dp"
        motion:layout_constraintBottom_toBottomOf="parent"
        motion:layout_constraintStart_toStartOf="parent"
        motion:layout_constraintTop_toTopOf="parent" />

    <Constraint
        android:id="@+id/quick_menu"
        android:layout_width="19dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="4dp"
        android:translationX="0dp"
        motion:layout_constraintBottom_toBottomOf="parent"
        motion:layout_constraintStart_toStartOf="parent"
        motion:layout_constraintTop_toTopOf="parent" />
</ConstraintSet>

</MotionScene>

hope anyone can help.

Kind regards,

JKorsten

Upvotes: 2

Views: 1359

Answers (2)

You have to add another transition set I guess

Your first transition set should be like this

<Transition
    motion:constraintSetEnd="@+id/end"
    motion:constraintSetStart="@+id/start"
    motion:duration="2000"
    motion:motionInterpolator="easeIn">
    <OnClick
        motion:clickAction="transitionToEnd"
        motion:targetId="@+id/quick_menu_show_menu" />
</Transition>

and below that add another transition set like this

 <Transition
        motion:constraintSetEnd="@+id/end"
        motion:constraintSetStart="@+id/start"
        motion:duration="2000"
        motion:motionInterpolator="easeIn">
        <OnClick
            motion:clickAction="transitionToStart"
            motion:targetId="@+id/(your another view ID)" />
    </Transition>

Hope that works

Upvotes: 0

Jeroen
Jeroen

Reputation: 404

For some reason this solves the issue, but I hope someone can explain why this is.

<Transition
    motion:constraintSetEnd="@+id/start"
    motion:constraintSetStart="@+id/end"
    motion:duration="2000"
    motion:motionInterpolator="easeIn">
    <OnClick
        motion:clickAction="transitionToStart"
        motion:targetId="@+id/quick_menu_show_menu" />
</Transition>

As I read it: it does a easeIn from ConstraintSetEnd to ConstraintSetStart (transitionToStart), but I needed to change ConstraintSetEnd to @+id/start and ConstraintSetStart to @+id/end.

Upvotes: 2

Related Questions