android:visibility changes to children of MotionLayout

AndroidAndroid Motionlayout

Android Problem Overview


I must be missing something with android:visibility changes within a motion layout. Here’s a simplified version of my layout.

<MotionLayout>
 <ImageView android:id="@+id/HeaderBackground" />
Bunch of image views, Text views that are constrainted to the HeaderBackground. 
<RecyclerView android:visibility="visible">
<EditText android:visibility="visible">
<CustomViewGroup1 android:visibility="gone">
</MotionLayout>

I have a motionScreen that sets a Transition onswipe based on the recycler view to reduce the height of the HeaderBackground and hide some of the images/text views (i.e a collasping toolbar). However, if there’s some fatal error, I want to show CustomViewGroup1 on top/infront of the RecyclerView but toggling the visibility of the RecyclerView to gone and CustomViewGroup1 to visible doesn’t make the CustomViewGroup1 show.

I could move the CustomViewGroup group out of the MotionLayout and add a framelayout as the root of the activity and hide the whole MotionLayout. But this is less than ideal as I’d have to copy of the toolbar bar and icons. So I guess the question is about visibility changes and potentially z ordering?

I'm using androidx.constraintlayout:constraintlayout:2.0.0-beta2

Android Solutions


Solution 1 - Android

Turns out this was my inexperience with how MotionLayout works. By default MotionLayout controls the visibility of all views within it. But you can opt out child views by using the app:visibilityMode="ignore" attribute and defining the view in the <ConstraintSet>

In my case <CustomViewGroup1> looks like this...

<Constraint
      android:id="@id/CustomViewGroup1"
      app:layout_constraintBottom_toBottomOf="parent"
      app:layout_constraintEnd_toEndOf="parent"
      app:layout_constraintStart_toStartOf="parent"
      app:layout_constraintTop_toBottomOf="@+id/HeaderBackground"
      app:layout_constraintVertical_weight="1"
      app:visibilityMode="ignore" />

And this is defined the same in both collasped and expended ConstraintSets as I don't want it to move/animation when the recycler view is scrolled.

Thanks to John Hoford for the advice in another channel.

Solution 2 - Android

My approach is to exclude the view from the motion layout, ignore the visibility from the scene so it can be programmatic and also inherit the constraints in the end constraint set.

The documentation mentioned the app:applyMotionScene="boolean" but it doesn't tell you where. It has to be in a PropertySet

Also visibilityMode only worked for me inside a PropertySet as well

<?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:app="http://schemas.android.com/apk/res-auto">

    <Transition
        ...
    </Transition>

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

        <Constraint android:id="@id/viewId">
            <PropertySet
                app:applyMotionScene="false"
                app:visibilityMode="ignore" />
        </Constraint>

    </ConstraintSet>

    <ConstraintSet
        android:id="@+id/end"
        motion:deriveConstraintsFrom="@id/start">
        ...
    </ConstraintSet>

</MotionScene>

Careful with the app namespace auto-import from motion scene, that one is wrong you have to use the same that is used on the layouts.

The benefit of this is:

  • No width, height or constraints in the scene
  • No need to repeat the properties since is derived from the start constraint set

Solution 3 - Android

Programmatically way

View clickableArea = motionLayout.findViewById(R.id.video_overlay_thumbnail);    
motionLayout.getConstraintSet(R.id.start).getConstraint(clickableArea.getId()).propertySet.mVisibilityMode = 1; // 1 - ignore or 0 - normal
clickableArea.setVisibility(GONE);

Solution 4 - Android

Set visibilityMode property to normal, working fine for me with 2.0.0-beta3.

 app:visibilityMode="normal"
 android:visibility="visible"

Solution 5 - Android

You can change visibility children of Motion layout promatically, by this way:

fun View.changeVisibility(visibility: Int) {
        val motionLayout = parent as MotionLayout
        motionLayout.constraintSetIds.forEach {
            val constraintSet = motionLayout.getConstraintSet(it) ?: return@forEach
            constraintSet.setVisibility(this.id, visibility)
            constraintSet.applyTo(motionLayout)
        }
    }

Solution 6 - Android

The other option depending on your use case is to make sure the view you want to control the visibility of isn't a direct descendant of the MotionLayout. Place it in a container view and you'll be able to set the visibility as normal

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionscottyabView Question on Stackoverflow
Solution 1 - AndroidscottyabView Answer on Stackoverflow
Solution 2 - AndroidcutikoView Answer on Stackoverflow
Solution 3 - AndroidAlbertView Answer on Stackoverflow
Solution 4 - Android1'hafsView Answer on Stackoverflow
Solution 5 - AndroidHusniddin MadaminovView Answer on Stackoverflow
Solution 6 - AndroidVictor VectorView Answer on Stackoverflow