Blog

With Appery.io and Ionic, you can easily add a spinner to a page:

1. Drag’n’drop the spinner component to a page.
2. Provide an expression for ng-show in the properties panel. It could be a variable that returns true or false.
3. To vertically and horizontally center the spinner do the following:
   1. Add a centered-spinner class to Class in the properties panel.
   2. Create new CSS by going to CREATE NEW > CSS > Create CSS.
   3. Add the following code to create the CSS file:

.centered-spinner {
    width: 28px;
    height: 28px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -14px;
    margin-left: -14px;
}

.scroll
{
    height:100%;
}

Your spinner is ready to use! Don’t forget to change the variable provided for ng-show to true when you need to show the spinner, and to false when you need to hide it.

You can find related information here or here.

Make sure to check out all of our mobile development tips.

Do you want to build apps fast? Start developing with our trial plan!