Xamarin Forms Showing animated label at startup

Question

I have a problem. I created a ContentPage with a string: public MainPage(string Status) . Now when I call this page with the value "Mail sent" I want to slide in a label from the top for 2 seconds and slide it back up again. Now the label is in a RelativeLayout like this:

<Label x:Name="txtMailSent" HorizontalTextAlignment="Center" TextColor="White" BackgroundColor="Green" Text="A verification mail has been sent."
    RelativeLayout.XConstraint="{ConstraintExpression
    Type=RelativeToParent,Property=Width,Factor=0,Constant=0}"
    RelativeLayout.YConstraint="{ConstraintExpression
    Type=RelativeToParent,Property=Height,Factor=0,Constant=0}"
    RelativeLayout.WidthConstraint="{ConstraintExpression
    Type=RelativeToParent,Property=Width,Factor=1,Constant=0}"
    RelativeLayout.HeightConstraint="{ConstraintExpression
    Type=RelativeToParent,Property=Height,Factor=0.025,Constant=0}"/>

So I created this code:

public MainPage(string Status)
{
    InitializeComponent();

    SizeChanged += (s, a) =>
    {
        txtMailSent.TranslateTo(0, -txtMailSent.Height, 1, Easing.Linear);
    };

    if (Status == "Mail sent")
    {
        new Action(async () => await ShowMail())();
    }
}

private async Task ShowMail()
{
    await txtMailSent.TranslateTo(0, 0, 400, Easing.Linear);
}

But when I startup the app and give that parameter, no label shows up. What am I doing wrong?

Answer 1

I would say your code executes before visual elements are fully rendered. You can do something like this.

private string status = string.Empty;
public MainPage(string Status)
{
    InitializeComponent();
    status = Status;

    SizeChanged += (s, a) =>
    {
        txtMailSent.TranslateTo(0, -txtMailSent.Height, 1, Easing.Linear);
    };
}

protected async  override void OnAppearing()
{
    if (status == "Mail sent")
    {
        await txtMailSent.TranslateTo(0, 0, 4000, Easing.Linear);
        await Task.Delay(200);
        await txtMailSent.TranslateTo(0, -txtMailSent.Height, 4000, Easing.Linear);
    }
}