MotionLayout kotlin how reset scene and visibility?

Question

I have a FlashCards app and i have a flip card scene. I'm working with visibility of elements and I need also MotionScene there. I have problem, how reset Motion and set desire visibility of elelements? My scene works fine after first click. Then I cannot reset scene and code doesnt react to change visibility. How fix it?

Fragment:

viewModel.sidedCard.observe(viewLifecycleOwner) { sidedCard ->

        when {
            sidedCard == null -> {
                binding.textView.text = "End of Game!"
                binding.brnDontKnow.isVisible = false
                binding.btnKnow.isVisible = false
                binding.btnCheck.isVisible = false
                binding.btnEndOfGameBack.isVisible = true
                viewModel.endOfGame()
            }
            sidedCard.side == 0 -> {
                binding.textView.text = sidedCard.card.titles[0]
                binding.brnDontKnow.isVisible = false
                binding.btnKnow.isVisible = false
                binding.btnCheck.isVisible = true

            }
            else -> {
                binding.textView2.text = sidedCard.card.titles[1]
                binding.brnDontKnow.isVisible = true
                binding.btnKnow.isVisible = true
                binding.btnCheck.isVisible = false            
            }
        }
    }

    binding.brnDontKnow.setOnClickListener {
        viewModel.markCardAsDontKnow()
    }

    binding.btnKnow.setOnClickListener {
        viewModel.markCardAsKnow()
    }

    binding.btnCheck.setOnClickListener {
        viewModel.changeSide()
        binding.motionLayoutCard.transitionToStart()
        binding.motionLayoutCard.transitionToEnd()
        binding.motionLayoutCard.rebuildScene()

    }
}

And Here is my Scene :

<?xml version="1.0" encoding="utf-8"?>

<Transition
    app:constraintSetEnd="@+id/end"
    app:constraintSetStart="@+id/start"
    motion:duration="5000">
    <KeyFrameSet>

        <KeyAttribute
            app:framePosition="1"
            app:motionTarget="@+id/textView"
            android:alpha="1.0"/>
        <KeyAttribute
            app:framePosition="50"
            app:motionTarget="@+id/textView"
            android:alpha="0.5"/>

        <KeyAttribute
            app:framePosition="0"
            app:motionTarget="@+id/textView2"
            android:alpha="0"/>
        <KeyAttribute
            app:framePosition="50"
            app:motionTarget="@+id/textView2"
            android:alpha="0.5"/>
    </KeyFrameSet>
</Transition>

<ConstraintSet android:id="@+id/start">
    <Constraint android:id="@id/btnCheck">
        <PropertySet
            app:applyMotionScene="false"
            app:visibilityMode="ignore" />
    </Constraint>
    <Constraint android:id="@id/btnEndOfGameBack">
        <PropertySet
            app:applyMotionScene="false"
            app:visibilityMode="ignore" />
    </Constraint>
    <Constraint android:id="@id/btnKnow">
        <PropertySet
            app:applyMotionScene="false"
            app:visibilityMode="ignore" />
    </Constraint>
    <Constraint android:id="@id/brnDontKnow">
        <PropertySet
            app:applyMotionScene="false"
            app:visibilityMode="ignore" />
    </Constraint>

</ConstraintSet>


<ConstraintSet android:id="@+id/end">

    <Constraint android:id="@id/btnCheck">
        <PropertySet
            app:applyMotionScene="false"
            app:visibilityMode="ignore" />
    </Constraint>
    <Constraint android:id="@id/btnEndOfGameBack">
        <PropertySet
            app:applyMotionScene="false"
            app:visibilityMode="ignore" />
    </Constraint>
    <Constraint android:id="@id/btnKnow">
        <PropertySet
            app:applyMotionScene="false"
            app:visibilityMode="ignore" />
    </Constraint>
    <Constraint android:id="@id/brnDontKnow">
        <PropertySet
            app:applyMotionScene="false"
            app:visibilityMode="ignore" />
    </Constraint>
    <Constraint android:id="@+id/textView"
        android:alpha="0"
        android:rotationY="180"
        android:layout_width="100dp"
        android:layout_height="100dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"

        />
    <Constraint android:id="@+id/textView2"
        android:alpha="1"
        android:rotationY="0"
        android:layout_width="100dp"
        android:layout_height="100dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"

        />
    <Constraint android:id="@+id/textViewContainer"
        android:rotationY="180"
        android:layout_width="300dp"
        android:layout_height="300dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"/>
</ConstraintSet>

It is very unclear what is the problem. Ideally you transition to the state you want at the end (start). For visibility if you are controlling it set it to what you want. What are is not working? — hoford, Jul 30 '21 at 17:40

Amirhosein · Answer 1 · 2021-07-31T07:37:21.230

0

For views that you want to change their visibility outside of constraintSets, you gotta add motion:visibilityMode="ignore" to yout scene file.

Something like:

        <Constraint
        android:id="@id/btn_dont_know"
        ...
        motion:visibilityMode="ignore" />

edited Jul 31 '21 at 07:37

answered Jul 31 '21 at 07:05

Amirhosein

1,048
7
19

MotionLayout kotlin how reset scene and visibility?

1 Answers1