A modern programming language that makes developers happier.

kotlinlang

hey! Can anyone suggest me how to implement this animation with motion layout?
Thread in Slack Conversation

I am going to guess that this is not very straightforward. Basically what you want is to have a list item from a recyclerview pop out and move into the shopping cart.

Do you have any experience with motion layout?

Is it possible to do it with motion layout?

I think the difficulty is that motionlayout like the elements to be all defined in 1 layout, and then swap the constraint sets on it

but that is not really possibly with items from a recyclerview

so you somehow have to draw the item on top of the recyclerview, and then animate it to the shopping cart

But motion layout says everything is possible with motion layout :joy:

for example, have a motion layout with the toolbar and an empty dummy view that is similar to your list item

then set the visibility to gone while you don't use it

then as soon as you click the "Buy now", you programmatically set the values to the dummy view and set constraints programmatically to exactly overlay your item in the list

and then start a scene to move it towards teh button

device-2020-08-27-173122.mp4

So basically:
```<motion layout>
  <toolbar />
  <recyclerview />
  <movingItem />
</ motion layout>```
then when you click an item in the recyclerview, you pass the coordinates and data to the movingItem
You set the constraints to the MotionScene's start constraint layout and the MotionScene's end constraintlayout
Including this you should calculate scaling factor and position
And you get a result like this:

But doing things programmatically with motion layout always feels very hacky

Shoppingbutton.rar

because you cannot reassign the view to another parent

but then there will be no motionlayout probably

In the example I sent you, you can still use keyframes and such things and tweak the animation