How to set multiple OnSwipe Add Android MotionLayout Single Transition? - android

I'm using android motion layout. I want to add two OnSwipe nodes to a single transition, but I don't know how. The screen I want to implement is as follows.
The screen has ImageView and RecyclerView, and ImageView is on top of RecyclerView.
There are three states of small, medium, and full.
In small, only ImageView exists at the bottom of the screen, and RecyclerView is not visible.
In medum, ImageView is located in the center of the screen, and RecyclerView is visible in the lower space.
In full, the ImageView is located at the top of the screen, and the RecyclerView is visible in the lower space.
I want to do a transition using both an ImageView and a RecyclerView. In particular, I would like to implement the RecyclerView to transition when scrolling is not possible (the scroll position is at the top or the bottom) and when scrolling in the impossible scroll direction. How can we do that?
this is motion scene
<?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/medium"
motion:constraintSetStart="#+id/small">
<OnSwipe
motion:onTouchUp="autoComplete"
motion:dragDirection="dragUp"
motion:touchAnchorId="#+id/header" />
</Transition>
<Transition
motion:constraintSetEnd="#+id/full"
motion:constraintSetStart="#+id/medium">
<OnSwipe
motion:onTouchUp="autoComplete"
motion:dragDirection="dragUp"
motion:touchAnchorId="#+id/header" />
</Transition>
<ConstraintSet android:id="#+id/small">
<Constraint
android:id="#+id/header"
android:layout_width="0dp"
android:layout_height="wrap_content"
motion:layout_constraintEnd_toEndOf="parent"
motion:layout_constraintStart_toStartOf="parent"
motion:layout_constraintBottom_toBottomOf="parent" />
<Constraint
android:id="#+id/list"
android:layout_width="0dp"
android:layout_height="0dp"
motion:layout_constraintEnd_toEndOf="parent"
motion:layout_constraintStart_toStartOf="parent"
motion:layout_constraintBottom_toBottomOf="parent" />
</ConstraintSet>
<ConstraintSet android:id="#+id/medium">
<Constraint
android:id="#+id/header"
android:layout_width="0dp"
android:layout_height="wrap_content"
motion:layout_constraintEnd_toEndOf="parent"
motion:layout_constraintStart_toStartOf="parent"
motion:layout_constraintBottom_toTopOf="#+id/medium_top"/>
<Constraint
android:id="#+id/list"
android:layout_width="0dp"
android:layout_height="0dp"
motion:layout_constraintEnd_toEndOf="parent"
motion:layout_constraintStart_toStartOf="parent"
motion:layout_constraintTop_toBottomOf="#+id/header"
motion:layout_constraintBottom_toBottomOf="parent" />
</ConstraintSet>
<ConstraintSet android:id="#+id/full">
<Constraint
android:id="#+id/header"
android:layout_width="0dp"
android:layout_height="wrap_content"
motion:layout_constraintEnd_toEndOf="parent"
motion:layout_constraintStart_toStartOf="parent"
motion:layout_constraintTop_toTopOf="parent" />
<Constraint
android:id="#+id/list"
android:layout_width="0dp"
android:layout_height="0dp"
motion:layout_constraintEnd_toEndOf="parent"
motion:layout_constraintStart_toStartOf="parent"
motion:layout_constraintTop_toBottomOf="#+id/header"
motion:layout_constraintBottom_toBottomOf="parent" />
</ConstraintSet>
</MotionScene>
and this activity.xml
<?xml version="1.0" encoding="utf-8"?>
<layout 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">
<androidx.constraintlayout.motion.widget.MotionLayout
android:id="#+id/motion_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layoutDescription="#xml/scrollable_header_above_recycler_view_scene">
<Space
android:id="#+id/medium_top"
android:layout_width="match_parent"
android:layout_height="1dp"
android:orientation="horizontal"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.55" />
<ImageView
android:id="#+id/header"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toTopOf="#+id/list" />
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/list"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:clipToPadding="false"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
</androidx.constraintlayout.motion.widget.MotionLayout>
</layout>

This is a limitation of MotionLayout/OnSwipe support for NestedScrollView.
You can only automatically operate on one transition with a RecyclerView (NestedScrollView)
You have two choices:
Make the intermediate step using KeyFrames
Disable the automatic handling and manually control the transitions by listening to the scroll position.
In your case I would do the KeyFrame i.e. One Transition from small to full.
With one KeyPosition defining the position of the view.

Related

Android Motion Layout does not adapt to dynamic change in TextView content before animation. So how to make it adapt to new contents?

If we programmatically change the content of a Textview, after that the Motion animation only consider the original height of the TextView.
This example is suppose to expand to show a textView contents. It works if the content is previously assigned in the xml layout. But if the content is assigned programmatically and it takes several lines it only expand one line.
Code to trigger the Motion Scene Transition:
binding.button.setOnClickListener {
binding.tvLorem.text = LongText
binding.motionLayout.transitionToEnd()
}
<?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"
android:id="#+id/motionLayout"
tools:context=".MotionaLayoutActivity"
tools:showPaths="true"
app:layoutDescription="#xml/activity_motiona_layout_scene">
<View
android:id="#+id/button"
android:layout_width="64dp"
android:layout_height="64dp"
android:background="#color/design_default_color_primary"
android:text="Button" />
<TextView
android:id="#+id/tvLorem"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Lorem Ipsum"
/>
<View
android:id="#+id/bottomBar"
android:layout_width="match_parent"
android:layout_height="64dp"
android:background="#color/design_default_color_secondary"
app:layout_constraintBottom_toBottomOf="parent" />
</androidx.constraintlayout.motion.widget.MotionLayout>
The file with the MotionScene:
<?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">
<ConstraintSet android:id="#+id/start">
<Constraint
android:id="#+id/button"
android:layout_width="64dp"
android:layout_height="64dp"
motion:layout_constraintBottom_toTopOf="#id/tvLorem"
motion:layout_constraintEnd_toEndOf="parent" />
<Constraint
android:id="#+id/tvLorem"
android:visibility="visible"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_marginTop="#dimen/default_margin"
motion:layout_constraintStart_toStartOf="parent"
motion:layout_constraintEnd_toEndOf="parent"
motion:layout_constraintBottom_toTopOf="#id/bottomBar">
<CustomAttribute
motion:attributeName="backgroundColor"
motion:customColorValue="#00000000"/>
</Constraint>
</ConstraintSet>
<ConstraintSet android:id="#+id/end">
<Constraint
android:id="#+id/button"
android:layout_width="64dp"
android:layout_height="64dp"
motion:layout_constraintBottom_toTopOf="#id/tvLorem"
motion:layout_constraintEnd_toEndOf="parent" />
<Constraint
android:id="#+id/tvLorem"
android:visibility="visible"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/cardview_dark_background"
android:layout_marginTop="#dimen/default_margin"
motion:layout_constraintStart_toStartOf="parent"
motion:layout_constraintEnd_toEndOf="parent"
motion:layout_constraintBottom_toTopOf="#+id/bottomBar">
<CustomAttribute
motion:attributeName="backgroundColor"
motion:customColorValue="#color/cardview_dark_background"/>
</Constraint>
</ConstraintSet>
<Transition
motion:constraintSetStart="#+id/start"
motion:constraintSetEnd="#+id/end"
motion:duration="1000">
<OnClick
motion:touchAnchorId="#+id/button"
motion:touchAnchorSide="right"
motion:dragDirection="dragRight" />
</Transition>
</MotionScene>
So, how to make it work changing the text content programmatically?
For the moment I tried:
binding.tvLorem.invalidate()
binding.tvLorem.postInvalidate()
binding.motionLayout.invalidate()
binding.motionLayout.clearAnimation()
binding.motionLayout.rebuildScene()
and nothing works!
What do works is changing the TextView visibility to GONE and VISIBLE before running the transition.
fun TextView.informMotionSceneAboutNewHeight(){
visibility = View.GONE
visibility = View.VISIBLE
}
binding.tvLorem.text = LongText
binding.tvLorem.informMotionSceneAboutNewHeight()
binding.motionLayout.transitionToEnd()

MotionLayout Group Visibility Issue

I have a Constraint Layout which contains a RecyclerView, a TextInputEditText, a Constraint Group (which handles visibility of the RecyclerView and TextInputEditText, an ImageView and a LottieAnimationView.
It works as this:
On startup, only the LottieAnimation is visible until my LiveData fetches data from repo and updates successfully.
After data is fetched, the LottieView is hidden and the Group visibility is shown which in turns shows the RecyclerView and TextInputEditText.
The ImageView is shown only if there's an error and then all other views are hidden except the ImageView.
Now i want that when i scroll my RecyclerView, the TextInputEditText also scrolls. (I can't use NestedScrollView due to pagination lag when scroll).
I made use of MotionLayout. Except it is not working properly. My visibility is broken. My Lottie Animation is staying on the screen. My layouts are as such:
fragment.xml:
<?xml version="1.0" encoding="utf-8"?>
<layout 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">
<data>
<variable
name="ViewModel"
type="...AllServicesViewModel" />
<import type="android.view.View" />
</data>
<androidx.constraintlayout.motion.widget.MotionLayout
android:id="#+id/Root_All_Services"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layoutDescription="#xml/scene_all_services_header">
<ImageView
android:id="#+id/Illus_Error"
android:layout_width="350dp"
android:layout_height="350dp"
android:layout_margin="16dp"
android:contentDescription="#string/icd_error_services_unavailable"
android:scaleType="centerCrop"
android:src="#drawable/il_error"
android:visibility="#{ViewModel.message != null ? View.VISIBLE : View.GONE}"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:src="#drawable/il_error" />
<androidx.constraintlayout.widget.Group
android:id="#+id/Group_Main_Content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="#{ViewModel.loading || ViewModel.message != null ? View.GONE : View.VISIBLE}"
app:constraint_referenced_ids="TextField_Search,RecyclerView_Services" />
<com.google.android.material.textfield.TextInputEditText
android:id="#+id/TextField_Search"
style="#style/Mes.TextField.Search"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:drawablePadding="-24dp"
android:hint="#string/action_search"
android:text="#={ViewModel.searchQuery}"
android:imeOptions="actionSearch"
android:padding="24dp"
android:singleLine="true"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/RecyclerView_Services"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="24dp"
android:clipToPadding="false"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/TextField_Search" />
<com.airbnb.lottie.LottieAnimationView
android:id="#+id/Anim_Loading"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="#{!ViewModel.loading || ViewModel.message != null? View.GONE : View.VISIBLE}"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:lottie_autoPlay="true"
app:lottie_loop="true"
app:lottie_rawRes="#raw/raw_anim_loading_services" />
</androidx.constraintlayout.motion.widget.MotionLayout>
</layout>
scene_all_services_header.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">
<Transition
motion:constraintSetEnd="#+id/end"
motion:constraintSetStart="#+id/start">
<OnSwipe
motion:dragDirection="dragUp"
motion:onTouchUp="stop"
motion:touchAnchorId="#+id/TextField_Search" />
</Transition>
<ConstraintSet android:id="#+id/start">
<Constraint
android:id="#+id/TextField_Search"
android:layout_width="0dp"
android:layout_height="wrap_content"
motion:layout_constraintEnd_toEndOf="parent"
motion:layout_constraintStart_toStartOf="parent"
motion:layout_constraintTop_toTopOf="parent" />
<ConstraintOverride
android:id="#+id/RecyclerView_Services"
motion:visibilityMode="ignore" />
<Constraint
android:id="#+id/Anim_Loading"
motion:visibilityMode="ignore" />
<Constraint
android:id="#+id/Illus_Error"
motion:visibilityMode="ignore" />
</ConstraintSet>
<ConstraintSet android:id="#+id/end">
<Constraint
android:id="#+id/TextField_Search"
android:layout_width="0dp"
android:layout_height="wrap_content"
motion:layout_constraintBottom_toTopOf="parent"
motion:layout_constraintEnd_toEndOf="parent"
motion:layout_constraintStart_toStartOf="parent" />
<ConstraintOverride
android:id="#+id/RecyclerView_Services"
motion:visibilityMode="ignore" />
<Constraint
android:id="#+id/Anim_Loading"
motion:visibilityMode="ignore" />
<Constraint
android:id="#+id/Illus_Error"
motion:visibilityMode="ignore" />
</ConstraintSet>
</MotionScene>
Below are samples of how it worked before and after adding MotionLayout
Before
After
Can someone please help me out ?
<Constraint
android:id="#+id/RecyclerView_Services"
motion:visibilityMode="ignore" />
The above eliminates all constraint on this view!
<Constraint android:id="#+id/RecyclerView_Services">
<PropertySet motion:visibilityMode="ignore"/>
</Constraint>
The above removes all attributes leaving just the ignore.
2.1 supports...
<ConstraintOverride
android:id="#+id/RecyclerView_Services"
motion:visibilityMode="ignore" />
Which will do what you were expecting.
ConstraintOverride:
adds or modifies attributes
is not is not well supported by the IDE.
does not support layout_constraint{Top,Bottom,Left,Right,Start,End}_*=".."

MotionLayout not resized when animating

I have this view:
<androidx.constraintlayout.motion.widget.MotionLayout
android:id="#+id/expandableModes"
android:layout_width="200dp"
android:layout_height="200dp"
android:paddingBottom="5dp"
app:layoutDescription="#xml/journey_motion"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="#id/guidelineLeft"
app:layout_constraintTop_toBottomOf="#id/travelModeText">
....
</androidx.constraintlayout.motion.widget.MotionLayout>
And this motion layout:
<?xml version="1.0" encoding="utf-8"?>
<MotionScene xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<Transition
app:constraintSetEnd="#id/endExpand"
app:constraintSetStart="#id/startExpand"
app:duration="1000" />
<ConstraintSet android:id="#+id/startExpand">
<Constraint
android:id="#id/expandableModes"
android:layout_width="200dp"
android:layout_height="200dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="#id/guidelineLeft"
app:layout_constraintTop_toBottomOf="#id/travelModeText" />
</ConstraintSet>
<ConstraintSet android:id="#+id/endExpand">
<Constraint
android:id="#id/expandableModes"
android:layout_width="10dp"
android:layout_height="10dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="#id/guidelineLeft"
app:layout_constraintTop_toBottomOf="#id/travelModeText" />
</ConstraintSet>
</MotionScene>
I execute it by code:
binding.expandableModes.transitionToEnd {
print("")
}
My animation is played but my view is not resized, what did I missed ?
You are trying to animate the motion layout itself. You can only animate direct children as described here: https://developer.android.com/training/constraint-layout/motionlayout
You need to create a children of the view and animate this.

Problems with empty initial constraint set & 'deriveConstraintsFrom' on motion layout

I currently going my first steps into motion layout.
The example I want to create is the following:
A motion layout with two FABs in it (a mini and a normal one). The image above shows the end state after clicking the normal sized FAB.
What I've tried:
Motion Layout (is part of an other layout file):
<androidx.constraintlayout.motion.widget.MotionLayout
android:id="#+id/include"
app:motionDebug="SHOW_PATH"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="#android:color/darker_gray"
android:layout_margin="8dp"
app:layoutDescription="#xml/menu_scene"
app:layout_constraintTop_toBottomOf="#id/text"
app:layout_constraintStart_toStartOf="#id/text"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toBottomOf="parent">
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/images_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="#id/menu_button"
app:layout_constraintTop_toTopOf="#id/menu_button"
app:layout_constraintBottom_toBottomOf="#id/menu_button"
android:src="#drawable/ic_image"
app:fabSize="mini" />
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/menu_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
android:src="#drawable/ic_edit" />
</androidx.constraintlayout.motion.widget.MotionLayout>
MotionScene:
<MotionScene xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android">
<Transition
app:constraintSetStart="#+id/start"
app:constraintSetEnd="#+id/end">
<OnClick
app:targetId="#+id/menu_button"
app:clickAction="toggle" />
</Transition>
<!-- pulls constraints from layout -->
<ConstraintSet android:id="#+id/start" />
<ConstraintSet android:id="#+id/end">
<Constraint android:id="#id/images_button">
<Layout
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toBottomOf="parent" />
</Constraint>
</ConstraintSet>
</MotionScene>
But unfortunately with this configuration I got this:
The tiny pink dot on the bottom left is the mini FAB.
Because I heard about deriveConstraintsFrom I gave it a chance:
<MotionScene ...>
<Transition ...>
...
</Transition>
<ConstraintSet android:id="#+id/start" />
<ConstraintSet
android:id="#+id/end"
app:deriveConstraintsFrom="#id/start">
<Constraint android:id="#id/images_button">
...
</Constraint>
</ConstraintSet>
</MotionScene>
But I got the same result! :(
The only way I got the wanted result was with the following constraint set configuration:
<MotionScene ...>
...
<ConstraintSet android:id="#+id/start" />
<ConstraintSet android:id="#+id/end">
<Constraint android:id="#id/images_button">
<!-- duplicated the layout properties from the initial layout :( -->
<Layout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="#id/menu_button"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toBottomOf="parent" />
</Constraint>
</ConstraintSet>
</MotionScene>
Wrap up:
I thought the empty constraint set <ConstraintSet android:id="#+id/start" /> pulls the its contrains from the layout itself and app:deriveConstraintsFrom="#id/start" on the other constraint set specifies all constraints from the initial constraint set and overwrites its own.
Can somebody tell me why this isn't working? Or did I miss something?
Thanks, Chris
PS.: I using androidx.constraintlayout:constraintlayout:2.0.0-beta4

MotionLayout with vertical ScrollView

I'm trying to make animation with motion layout, and want to set scrollView as targetAnchor for motion scene onSwipe Transition, but it doesn't work.
Maybe I don't know some thing about onSwipe transition.
Here is my layout file
<androidx.constraintlayout.motion.widget.MotionLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/main_background_color"
app:layoutDescription="#xml/base_scroll_scene">
<ImageView
android:id="#+id/background_image"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginBottom="#dimen/scrollable_background_image_margin_bottom"
android:scaleType="centerCrop"
android:src="#drawable/lift_bg"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<FrameLayout
android:layout_width="match_parent"
android:layout_height="#dimen/top_gradient_mask_height"
android:background="#drawable/top_gradient_mask"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="#+id/ski_more_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/ski_more_logo_margin_top"
android:src="#drawable/ic_skimore_logo"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="#+id/locked_icon"
android:layout_width="32dp"
android:layout_height="32dp"
android:layout_marginTop="#dimen/locked_icon_margin_top"
android:src="#drawable/ic_lock"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/ski_more_logo" />
<FrameLayout
android:id="#+id/bottom_gradient_mask"
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="#drawable/bottom_gradient_mask"
app:layout_constraintBottom_toBottomOf="#+id/background_image" />
<ScrollView
android:id="#+id/content_scroll_view"
android:layout_width="match_parent"
android:layout_height="0dp"
android:overScrollMode="never"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent">
<FrameLayout
android:id="#+id/content_container_view"
android:layout_width="match_parent"
android:clickable="false"
android:layout_height="match_parent" />
</ScrollView>
</androidx.constraintlayout.motion.widget.MotionLayout>
In scroll view programmatically i'm adding some content with big height, which will be scrollable.
And here is my motion scene
<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="1000">
<OnSwipe
motion:dragDirection="dragUp"
motion:touchAnchorId="#+id/content_scroll_view"
motion:touchAnchorSide="top" />
</Transition>
<ConstraintSet android:id="#+id/start"/>
<ConstraintSet android:id="#+id/end">
<Constraint
android:id="#+id/background_image"
android:layout_width="0dp"
android:layout_height="#dimen/top_gradient_mask_height"
android:layout_marginBottom="#dimen/scrollable_background_image_margin_bottom"
android:scaleType="centerCrop"
android:src="#drawable/lift_bg"
motion:layout_constraintEnd_toEndOf="parent"
motion:layout_constraintStart_toStartOf="parent"
motion:layout_constraintTop_toTopOf="parent" />
</ConstraintSet>
</MotionScene>
Please help me, Thanks.
Have you tried to replace ScrollView with NestedScrollView?
And, also, I would define ConstraintSet "start" as well.
I had the same issue on using a scrolling view with motion layout to implement my custom animations. But simply changing ScrollView to NestedScrollView fixed everything and animations work as expected

Categories

Resources