Search code examples
c#androidiosxamlmaui

MAUI | .NET | How can I make the toolbar (Title view) flexible and scrollable?


I would like to do the effects shown at the end of this Material Design link.

https://m1.material.io/patterns/scrolling-techniques.html#scrolling-techniques-behavior

Flexible space with image

Flexible space with overlapping content

Where to have a background image or in the header and that when scrolling disappears and the toolbar appears.

I do not know where to start, any help or example would be appreciated.

I haven't tried anything because I don't have any idea where to start, I only have a TitleView with a logo in the Shell, but I want to put a bigger image at the beginning and when the scroll starts it will fade and the TitleView I have will remain.


Solution

  • The effect you need is not something that can be achieved with a little code,but you can start with animation.

    You can also refer the aiticle Awesome Scroll Effects in Xamarin.Forms by David Ortinau. Though it is based on xamarin form, but the achievement on maui is similar. You can refer to the implementation idea of above article.

    You can also check the tutorial here: Awesome Scroll Effects.