MotionLayout rotate image and resetting rotation android

Question

I'm rotating an imageview using MotionLayout.

First click, image rotate clockwise, that's what i want.

But second click, image rotate counterclockwise. I tried some way to reset state of image but it doesn't work. Can i have a advise???

<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="1500">
        <OnClick motion:clickAction="toggle"
            motion:targetId="@id/img_reload_cast_dialog"/>
    </Transition>

    <ConstraintSet android:id="@+id/start">
        <Constraint
            android:id="@+id/img_reload_cast_dialog"
            motion:layout_constraintEnd_toStartOf="@id/img_help_cast_dialog"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginEnd="@dimen/_20sdp"
            motion:layout_constraintTop_toTopOf="parent" >
            <Transform android:rotation="0" />
        </Constraint>
    </ConstraintSet>

    <ConstraintSet android:id="@+id/end">
        <Constraint
            android:id="@+id/img_reload_cast_dialog"
            motion:layout_constraintEnd_toStartOf="@id/img_help_cast_dialog"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginEnd="@dimen/_20sdp"
            motion:layout_constraintTop_toTopOf="parent" >
            <Transform android:rotation="720" />
        </Constraint>
    </ConstraintSet>

</MotionScene>

In the start state you have a rotation = 0 in the end state you have a rotation = 720 on first click it will go from 0 to 720 on second click it will go from 720 to 0 Not sure what is the problem ? — hoford, Jul 14 '22 at 17:53

score 1 · Accepted Answer · answered Jul 14 '22 at 18:10

I think I figured out what you wanted. You want a button that goes from rotate the view and essentially stays in start state

There are several ways to do this.

Probably the simplest from your your current XML is to add

motion:autoTransition="jumpToStart"

to you transition. Alternative is to add another transition from end to start that is auto transition and duration 0.

  <Transition
        motion:constraintSetEnd="@+id/start"
        motion:constraintSetStart="@id/end"
        motion:autoTransition="jumpToStart"
 
    
     //>

see MotionTags video on Transition for an overview

Other approaches are

ViewTransitions
Adding a KeyCycle of rotation with a wave shape sawtooth

MotionLayout rotate image and resetting rotation android

1 Answers1