Moving an ImageView in the screen - android

I am trying to move an ImageView according to the buttons pressed. For the moment I am trying to move the ImageView Up and Down, the Down thing works perfectly but the problem is when I try to make it go up. When the ImageView isn't at its initial position the ImageView goes up perfectly (until it reaches its initial position) but when it is at its initial position it just goes up one time and then when I press the up button again it goes down to its initial position.
(Just to let you know, the orientation of the screen is on landscape)
So, to move my ImageView up I just lower the value of translationY
imageView.translationY = imageView.translationY.absoluteValue - 25
I tried using ObjectAnimator.ofFloat() but the imageView goes back to its initial position after the animation.
In the layout I am just using a constraint layout and I constrain the ImageView at the centre of the screen.
Thanks for your help!

Hi I think constraint layout will be good for this case. I have created a sample project to check this out. This uses MotionLayout with MotionScene
The Idea is to create MotionLayout as your parent layout and then define the Childers to animate in your case its ImageView here is sample layout file. Use this file in some activity or some fragment to see in action
<?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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/holo_red_dark"
android:orientation="vertical"
app:layoutDescription="#xml/up_down_descriptor">
<ImageView
android:id="#+id/ivStar"
android:layout_width="40dp"
android:layout_height="40dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_star_outline" />
<Button
android:id="#+id/btnUp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="200dp"
android:text="up"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/ivStar"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="#+id/btnDown"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="200dp"
android:text="Down"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#+id/ivStar"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.motion.widget.MotionLayout>
and you define a layout description file up_down_descriptor in res/xml
<?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/down"
app:constraintSetStart="#+id/center"
app:duration="2000">
<OnClick
app:clickAction="toggle"
app:targetId="#id/btnDown" />
</Transition>
<Transition
app:constraintSetEnd="#+id/up"
app:constraintSetStart="#+id/center"
app:duration="2000">
<OnClick
app:clickAction="toggle"
app:targetId="#id/btnUp" />
</Transition>
<ConstraintSet android:id="#+id/center">
<Constraint
android:id="#+id/ivStar"
android:layout_width="40dp"
android:layout_height="40dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</ConstraintSet>
<ConstraintSet android:id="#+id/down">
<Constraint
android:id="#+id/ivStar"
android:layout_width="40dp"
android:layout_height="40dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
</ConstraintSet>
<ConstraintSet android:id="#+id/up">
<Constraint
android:id="#+id/ivStar"
android:layout_width="40dp"
android:layout_height="40dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</ConstraintSet>
</MotionScene>
MotionLayout will take care of the rest of the things.

Related

RecyclerView not showing items until onTouch

I have a restaurants map-based app which when I click on a place marker, a fragment displaying the specific place is created with RecyclerView showing reviews about the place and a like button all inside a motion layout, when the fragment is created and the button is not liked (means the specific place showing is not in the user favorites) the recyclerview shows everything fine, and if I press the like button then an animation on the button is occurred replacing the button drawable from unfilled icon to red color filled icon and everything still working as expected.
When I enter the same fragment with the same specific place again, the like button is animated to be filled again since the place is already in the user favorites, the recyclerview does not show the reviews until I touch the view itself and onTouch is occurred..
I tried debugging and looking at the recyclerView visibility and it was visible, even the adapter size was not empty so it was supposed to be shown and work fine but it does not..
If I then dislike the place (the like button turns to be unfilled) -> exit the fragment -> open the fragment again with the same specific place -> everything again works fine.
so I am concerned the problem is somewhere around the animation of the like button and it is related to the motion layout..
Any ideas how to proceed with this issue ?
my fragment_detailed_place.xml:
<?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:id="#+id/motion_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/gmm_white"
app:layoutDescription="#xml/fragment_detailed_place_scene"
tools:context=".map.DetailedPlaceFragment">
<androidx.constraintlayout.utils.widget.ImageFilterButton
android:id="#+id/place_like_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:background="#color/fui_transparent"
android:backgroundTint="#color/gmm_white"
android:src="#drawable/ic_favorite_empty_big"
app:altSrc="#drawable/ic_favorite_filled_big"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/place_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:text="Place Name will be here"
android:textColor="#color/colorPrimary"
android:textSize="20sp"
android:transitionName="place_transition"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/place_like_button" />
<TextView
android:id="#+id/place_address"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:text="address will be here"
android:textColor="#color/quantum_grey"
android:textSize="14sp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/place_name" />
<TextView
android:id="#+id/place_favorites"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:text="favorites will be here"
android:textColor="#color/colorPrimary"
android:textSize="14sp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/place_address"
app:layout_goneMarginTop="8dp" />
<TextView
android:id="#+id/place_rating"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:layout_marginTop="30dp"
android:text="Rating: 5.0"
app:layout_constraintBaseline_toBaselineOf="#id/place_distance"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toBottomOf="#id/place_address" />
<TextView
android:id="#+id/place_distance"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:layout_marginEnd="10dp"
android:text="Distance: 5.0 km"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/place_address" />
<TextView
android:id="#+id/recent_reviews"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:text="Recent Reviews"
android:textColor="#color/colorPrimary"
android:textSize="14sp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/place_distance" />
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/reviews_list"
android:layout_width="0dp"
android:layout_height="0dp"
android:orientation="vertical"
tools:listitem="#layout/review_list_item"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#id/recent_reviews" />
</androidx.constraintlayout.motion.widget.MotionLayout>
my motionlayout like button color filling animation scene:
`
<Transition
android:id="#+id/likeButtonTransition"
motion:constraintSetEnd="#+id/end"
motion:constraintSetStart="#id/start"
motion:duration="250">
<OnClick motion:targetId="#+id/place_like_button" />
</Transition>
<ConstraintSet android:id="#+id/start">
<Constraint android:id="#+id/place_like_button">
<CustomAttribute
motion:attributeName="crossfade"
motion:customFloatValue="0" />
</Constraint>
</ConstraintSet>
<ConstraintSet android:id="#+id/end">
<Constraint android:id="#+id/place_like_button">
<CustomAttribute
motion:attributeName="crossfade"
motion:customFloatValue="1" />
</Constraint>
</ConstraintSet>
`
my code in DetailedPlaceFragment which animates the button if the place is in favorites :
ioSCOPE.launch {
if (mapViewModel.getIfPlaceIsFavorite(place) != null) {
withContext(Dispatchers.Main) {
binding.motionLayout.transitionToEnd()
}
} else {
withContext(Dispatchers.Main) {
binding.motionLayout.transitionToStart()
}
}
}
Thanks !

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.

Android MotionLayout Swipe to reveal

I have a list of items that can be swiped away using a MotionLayout. I wanted to implement an animation similar to the one in the Gmail android app, where when you swipe an email away, there is that colored background that gets revealed. So what I tried is to place an ImageView in the MotionLayoutunder the view that moves, so that when that view goes away it will reveal the ImageView beneath.
Here is the layout of the element:
<androidx.constraintlayout.motion.widget.MotionLayout
android:id="#+id/reading_list_item_motion"
android:layout_width="match_parent"
android:layout_height="72dp"
app:layoutDescription="#xml/reading_list_item_scene">
<!-- The image under the element that moves -->
<ImageView
android:id="#+id/reading_list_item_back"
android:layout_width="match_parent"
android:layout_height="72dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
tools:srcCompat="#tools:sample/backgrounds/scenic" />
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/reading_list_item_layout"
android:layout_width="match_parent"
android:layout_height="72dp"
android:gravity="center"
android:paddingLeft="#dimen/search_result_padding"
android:paddingRight="#dimen/search_result_padding"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<ImageView
android:id="#+id/reading_list_item_icon"
android:layout_width="#dimen/ic_search_result"
android:layout_height="#dimen/ic_search_result"
android:layout_gravity="center"
android:layout_marginStart="8dp"
android:layout_marginTop="4dp"
android:layout_weight="1"
android:contentDescription="Search result icon"
app:error="#{#drawable/ic_default_search_result}"
app:imageUrl="#{book.best_book.small_image_url}"
app:layout_constraintEnd_toStartOf="#id/reading_list_item_info_layout"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_default_search_result" />
<LinearLayout
android:id="#+id/reading_list_item_info_layout"
android:layout_width="316dp"
android:layout_height="0dp"
android:layout_marginStart="8dp"
android:layout_marginTop="4dp"
android:layout_weight="1"
android:orientation="vertical"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.4"
app:layout_constraintStart_toEndOf="#+id/reading_list_item_icon"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.6">
<TextView
android:id="#+id/reading_list_item_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ellipsize="end"
android:maxLines="2"
android:singleLine="false"
android:text="#{book.best_book.title}"
android:textColor="#color/textSecondary"
android:textSize="18sp"
android:textStyle="bold" />
<TextView
android:id="#+id/reading_list_item_author"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ellipsize="end"
android:singleLine="true"
android:text='#{"by " + book.best_book.author.name }'
android:textColor="#color/textSecondary" />
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.motion.widget.MotionLayout>
Even though in the Design editor the image appears to be there, and if I play the MotionLayout transition everything behaves as expected, when starting the app the ImageView is nowhere to be seen.
Another approach that I thought of would be to append the ImageView at the end of the view that moves, so that when it starts to go off-screen, the ImageView comes in view. I am not sure how could I implement this though since the ImageView should be as wide as the screen and match_parent obviously wouldn't work
Does anyone have any idea how can I implement this animation?
Thanks in advance!
Edit: Here is an image of how I'd like it to look. The more the item goes of screen, the more of the red background gets revealed.
Here is the MotionScene xml:
<?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">
<ConstraintSet android:id="#+id/start">
<Constraint
android:id="#+id/reading_list_item_layout"
android:layout_width="match_parent"
android:layout_height="72dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Constraint
app:layout_editor_absoluteY="1dp"
android:id="#+id/imageView" />
</ConstraintSet>
<ConstraintSet android:id="#+id/end">
<Constraint
android:id="#+id/reading_list_item_layout"
app:layout_constraintEnd_toEndOf="parent"
android:layout_width="0dp"
android:layout_height="72dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toEndOf="parent" />
</ConstraintSet>
<Transition
app:constraintSetEnd="#id/end"
app:constraintSetStart="#+id/start">
<OnSwipe
app:dragDirection="dragRight"
app:touchAnchorId="#id/reading_list_item_layout"
app:touchAnchorSide="left" />
</Transition>
</MotionScene>

Two Recycler Views inside a MotionLayout creating problems

I am new in using Motion Layout and I have used two Recycler views rv_horizontal and rv_vertical ,rv_horizontal is using LinearLayout Manger with horizontal orientation and rv_vertical is using GridLayout Manger. I have used both of them within Motion Layout. What I want is,when I scroll up the rv_vertical then rv_horizontal, along with the Text ViewtxtCategory, should disappear.
What I tried is following:
home.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.motion.widget.MotionLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context=".Home"
android:background="#color/bgcolor"
app:layoutDescription="#xml/fragment_home_scene">
<!-- TODO: Update blank fragment layout -->
<TextView
android:id="#+id/txtCategory"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="5dp"
android:text="#string/category"
android:textSize="8pt"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/rv_horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/txtCategory"
app:layout_constraintVertical_bias="0.0" />
<TextView
android:id="#+id/txtFamousPlaces"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="8dp"
android:text="#string/famous_places"
android:textSize="8pt"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/rv_horizontal" />
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/rv_vertical"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/txtFamousPlaces"
app:layout_constraintVertical_bias="0.0" />
</androidx.constraintlayout.motion.widget.MotionLayout>
SceneFile of Home Fragment i.e., home_scene.xml :
<?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"
xmlns:motion="http://schemas.android.com/tools">
<ConstraintSet android:id="#+id/start">
<Constraint android:id="#+id/txtCategory"
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:layout_height="wrap_content"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
android:layout_width="match_parent"
app:layout_constraintTop_toBottomOf="#id/txtCategory"
android:id="#+id/rv_horizontal"
app:layout_constraintBottom_toTopOf="#+id/txtFamousPlaces" />
</ConstraintSet>
<ConstraintSet android:id="#+id/end">
<Constraint android:id="#id/txtCategory"
android:layout_width="0dp"
android:layout_height="wrap_content"
motion:layout_constraintEnd_toEndOf="parent"
motion:layout_constraintStart_toStartOf="parent"
motion:layout_constraintBottom_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toTopOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
<Constraint
android:layout_height="0dp"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
android:layout_width="match_parent"
app:layout_constraintTop_toBottomOf="#id/txtCategory"
android:id="#+id/rv_horizontal"
app:layout_constraintBottom_toTopOf="parent" />
</ConstraintSet>
<Transition
app:constraintSetEnd="#id/end"
app:constraintSetStart="#+id/start">
<OnSwipe
motion:onTouchUp="stop"
motion:dragDirection="dragUp"
motion:touchAnchorId="#+id/rv_vertical"
app:moveWhenScrollAtTop="true"/>
</Transition>
</MotionScene>
I am facing the following problems, if anyone knows please help me:
I am scrolling up the rv_vertical but nothing is happening , although I have set the attribute motion:touchAnchorId="#+id/rv_vertical" within OnSwipe attribute in home_scene.xml file. As you can see.
When I scroll up the FamousPlaces then scroll down it then recycler view rv_horizontal does not load completey. As following
I tell you again what I want is,when I scroll up the rv_vertical, rv_horizontal, along with the Text ViewtxtCategory, should disappear.And when I scroll down rv_vertical, rv_horizontal should loaded completely. If anybody knows please help me.

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