Activity Indicator not working in Xamarin.Forms

563 views Asked by At

I have an activity indicator designed inside a absolute layout. Based on a button click event, I try to show and hide the activity indicator alternatively. But due to some reason, I cannot see my activity Indicator.Any help will be greatly appreciated!!! Thanks in advance.

This is my .xaml.cs class:

public partial class PBTestPage : ContentPage
{
    private bool _pbIndicator;
    public PBTestPage()
    {
        InitializeComponent();
    }

    public bool PBIndicator{
        get{
            return _pbIndicator;
        }set{
            _pbIndicator = value;
            OnPropertyChanged();
        }
    }

    protected override void OnAppearing()
    {
        base.OnAppearing();
        var parentLayout = new AbsoluteLayout();

        var stackContent = new StackLayout();
        AbsoluteLayout.SetLayoutFlags(stackContent,AbsoluteLayoutFlags.PositionProportional);
        AbsoluteLayout.SetLayoutBounds(stackContent,new Rectangle(0f,0f,AbsoluteLayout.AutoSize,AbsoluteLayout.AutoSize));

        var activityIndicator = new ActivityIndicator
        {
            Color = Color.Black,
            IsRunning = PBIndicator,
            IsVisible = PBIndicator
        };
        AbsoluteLayout.SetLayoutFlags(activityIndicator, AbsoluteLayoutFlags.PositionProportional);
        AbsoluteLayout.SetLayoutBounds(activityIndicator, new Rectangle(.5, .5, AbsoluteLayout.AutoSize, AbsoluteLayout.AutoSize));

        var button = new Button
        {
            Text="Click",
            VerticalOptions=LayoutOptions.CenterAndExpand,
            HorizontalOptions=LayoutOptions.CenterAndExpand,
        };
        button.Clicked += OnClicked;

        stackContent.Children.Add(button);

        parentLayout.Children.Add(stackContent);
        parentLayout.Children.Add(activityIndicator);

        Content = parentLayout;
    }

    private void OnClicked(object sender, EventArgs e)
    {
        if(PBIndicator==false){
            PBIndicator = true;
        }else{
            PBIndicator = false;
        }

    }
}
2

There are 2 answers

0
Diego Rafael Souza On BEST ANSWER

I'm inferring you're intending to use bindings by the use of OnPropertyChanged, so it's a good time to start do it.

I've made some changes in your code and I guess it will work properly now. The changes are:

  1. Moved the layout creation to the constructor (I can't see create the whole same layout on every time the page is shown as a good choice );
  2. The OnClicked event just invert the value of the property, no need to check it before with an if;
  3. Using Bindings to handle the ActivityIndicator's properties state;
  4. Set true to PBIndicator property on the OnAppearing event.

This is the changed code:

public partial class PBTestPage : ContentPage
{
    private bool _pbIndicator;
    public bool PBIndicator
    {
        get { return _pbIndicator; }
        set
        {
            _pbIndicator = value;
            OnPropertyChanged();
        }
    }

    public PBTestPage()
    {
        InitializeComponent();

        var parentLayout = new AbsoluteLayout();

        var stackContent = new StackLayout();
        AbsoluteLayout.SetLayoutFlags(stackContent, AbsoluteLayoutFlags.PositionProportional);
        AbsoluteLayout.SetLayoutBounds(stackContent, new Rectangle(0f, 0f, AbsoluteLayout.AutoSize, AbsoluteLayout.AutoSize));

        var activityIndicator = new ActivityIndicator
        {
            Color = Color.Black
        };

        activityIndicator.SetBinding(ActivityIndicator.IsRunningProperty, new Binding(nameof(PBIndicator)));
        activityIndicator.SetBinding(ActivityIndicator.IsVisibleProperty, new Binding(nameof(PBIndicator)));
        activityIndicator.BindingContext = this;

        AbsoluteLayout.SetLayoutFlags(activityIndicator, AbsoluteLayoutFlags.PositionProportional);
        AbsoluteLayout.SetLayoutBounds(activityIndicator, new Rectangle(.5, .5, AbsoluteLayout.AutoSize, AbsoluteLayout.AutoSize));

        var button = new Button
        {
            Text = "Click",
            VerticalOptions = LayoutOptions.CenterAndExpand,
            HorizontalOptions = LayoutOptions.CenterAndExpand,
        };
        button.Clicked += OnClicked;

        stackContent.Children.Add(button);

        parentLayout.Children.Add(stackContent);
        parentLayout.Children.Add(activityIndicator);

        Content = parentLayout;
    }

    protected override void OnAppearing()
    {
        base.OnAppearing();
        PBIndicator = true;
    }

    private void OnClicked(object sender, EventArgs e)
    {
        PBIndicator = !PBIndicator;
    }
}

Let me know if it works. I hope it helps.

0
Supun Liyanaarachchi On

Try this one

private void OnClicked(object sender, EventArgs e)
        {
            if(PBIndicator==false){
                activityIndicator.IsRunning=true; 
            }else{
                activityIndicator.IsRunning=false; 
            }

        }