[FIXED] How to show (appear) elements in order in Xamarin Forms

Issue

I have a grid of buttons (2 x 3) which will be always fixed size menu for my application.

I want to display them on start in order of appearing with a little bit of delay (going from left to right, top to bottom).

I have tried this way:

in onAppearing method use FadeTo animation and delay to show the elements in order:

 await schedule_label_shadow.FadeTo(0, 1);
 await schedule_label.FadeTo(0, 1);
 await employees_label.FadeTo(0, 1);
 await employees_label_shadow.FadeTo(0, 1);

 await schedule_label.FadeTo(1, 250);
 await schedule_label_shadow.FadeTo(1, 250);
 await employees_label.FadeTo(1, 250);
 await employees_label_shadow.FadeTo(1, 250);

It works, but I had to fade out first, so the elements won't be displayed at the start. However, this doesn't seem as a right or effective way to do such animation. I also wanted to try isVisible (true/false), but was told it is a bad practice as it is blocking the UI thread.

Can you tell me if I do it right or point me to right direction?

Solution

You need set opacity = 0 in schedule_label_shadow and other views. Also you can set the property from xaml.

 schedule_label.Opacity = 0;

And remove

 await schedule_label_shadow.FadeTo(0, 1);

Answered By - Артём Тищенко

Answer Checked By - Clifford M. (PHPFixing Volunteer)