Xamarin Forms Waiting Icon

One of the most important features in applications is usability. We may also have to wait for your mobile applications whether you are exchanging data from web services or working locally. You need to understand this too. For example, if you are recording data in a database, your internet speed may be long, so you need to specify that the user is busy at that moment. Xamarin has a few extensions for it, but there is no need for them because there is Activity Indicator. The Activity Indicator shows a circle on the screen that fills in a circle. This is what we all are accustomed to, now I am doing something that the user is waiting for. In this post we will talk about using it. Because it has a somewhat distressing use.

First of all, you need to show Activity Indicator in the middle of the screen. Because the user waits for it. You can use Relative Layout or Absolute Layout to position it in the center of the screen. I will not use these two in my writing. I will do this with the Grid.

Let’s start by designing a page. Here I first assigned a Grid to the page. The purpose of this is to bring the activty indicators on top of the form on the screen, or any page design whatsoever. Then I put a Scroll View inside the grid, maybe it does not fit on the page controls that I added. I start assigning the controls that will appear on the page afterwards. I just made a button to be a simple example. When I press this button, it will work if the indicator is not working, if it is working it will stop. Finally, I put an indicator in the gridin outside the scroll view. I set the Indicator to be the center of the screen. I’m done with the design side.

<Grid>
  <ScrollView>
    <StackLayout>
       <Button x:Name="buttonBas"
                    Text="Bas"
                    BackgroundColor="Black"
                    TextColor="White"
                    Clicked="btn_Clicked"/>
     </StackLayout>
  </ScrollView>
   <ActivityIndicator x:Name="indicator"
                      VerticalOptions="Center"
                      orizontalOptions="Center" />
</Grid>

We need to use isRunning to run Activity Indicator. If it is true, it will work, otherwise it will not work. Of course we need to check this out. After doing these checks, we have removed the activty indicator in front of the user.

void btn_Clicked(object sender,EventArgs e)
        {
            if (indicator.IsRunning==false)
            {
                indicator.IsRunning = true;
            }
            else
            {
                indicator.IsRunning = false;
            }
        }

If you have any questions, you can reach us by email or comment.