Shifting elements

Question

I have to make a UI on Xamarin forms, that does this

Implement carousel paging for a 2-column page, but where each element stacks like in the FlexLayoutPage

• All items in a column should be visible (no vertical scrolling necessary)
• If you collapse a column, the items should shift as in the FlexLayoutPage example.

this is the example I got

Answer 1

Hello,

If you collapse a column, the items should shift as in the FlexLayoutPage example.

You could try the following two solutions:

Solution 1.

You could add a Command into your CircleView to control the behavior of the CardView, such as:

   <local:CarCircleView Command="{Binding ToggleCollapseCommand, Source={x:Reference _carView}}"/>  

If you want to use this solution, please refer to Animation in Xamarin.Forms to get details about how to design animation.

Solution 2.

If you just want to implement a expander component, please refer to Xamarin Community Toolkit Expander.

It is simple to use, and you could use the custom animation.

However, you could not collapse the CardView into the CircleView.

Best Regards,

Alec Liu.

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.