Search code examples
c#androidxamarin.formsloading

Activity Indicator does not change visible property and show whole page


I'm developing a xamarin forms app and I wanted to add to show "loading" states. But I'm facing that problem right now. When I open that page this bottom stacklayout shown but it never change anything and not show the my main page.

XAML :

ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
         xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
         xmlns:local="clr-namespace:İdaServis.ViewModels"
         x:Class="İdaServis.View.SamplePage">

<ContentPage.BindingContext>
    <local:SamplePageViewModel/>
</ContentPage.BindingContext>
<ContentPage.Content >
    <StackLayout >
        <Label Text="Sample Page"
            VerticalOptions="CenterAndExpand" 
            HorizontalOptions="CenterAndExpand" />

       
    </StackLayout>
</ContentPage.Content>

<StackLayout IsVisible="{Binding Isloading}"   VerticalOptions="CenterAndExpand" HorizontalOptions="Center" >
    <Label Text="Yükleniyor..." TextColor="Black" FontSize="Medium" />

    <ActivityIndicator  Color="SpringGreen"  IsRunning="True" />
</StackLayout>

I write viewodel like this:

public class SamplePageViewModel : INotifyPropertyChanged
{

    private bool _isloading, showPage;
    
    public SamplePageViewModel ()
    {
        _isloading = true;
        showPage = false;
        manageLoadings();
    }

    private async void manageLoadings()
    {
        await Task.Delay(2500);
        _isloading = false;
        showPage = true;
        OnPropertyChanged();

    }

    public bool Isloading { get => _isloading; set { _isloading = value; OnPropertyChanged(); } }

    public bool ShowPage { get => showPage; set { showPage = value; OnPropertyChanged(); } }

    public event PropertyChangedEventHandler PropertyChanged;
    protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

Solution

  • I've found very simple method to achive this "loading popup". I'm going to use UserDialogs nuget package.

    To show pop up :

    UserDialogs.Instance.ShowLoading("Loading...");
    

    To hide pop up :

    UserDialogs.Instance.HideLoading();
    

    You can use this code before api calls then hide it when you get result.