How to create PowerApps Loading Spinner Image?

Nobody likes staring at a frozen screen, wondering if their PowerApp is working or just broken. That’s why smooth, user-friendly design matters—especially when loading data or running slow processes. A simple fix? Add a loading spinner. It’s a small touch that goes a long way, letting users know the app is still running and saving them from guessing (or frustration).

In this post, I’ll show you exactly how to build a loading spinner into your PowerApp, step by step. Whether your app is basic or packed with features, this trick makes it feel faster, more reliable, and way more professional.

What does PowerApps do?

It provides a drag-and-drop user interface that allows adding controls, media, forms, and other screens to construct a mobile app. It connects to the external data source and stores it inside the app. PowerApps has a flow like an office 365 automation tool; it comes with the following features:

• A library of sample apps that work from a starting point
• A library of 200 connectors to integrate system and data
• An easy drag and drop interface
• The close integration of office 365 and other Dynamic tools
• High support structures and active PowerApps community

How to creating PowerApps Loading Spinner Image?

Do you have a leisurely PowerApps Screen? A loading image can help with user satisfaction. Therefore, creating a loading spinner gives the user the perception of what’s happening inside the app. Check the loading spinner for PowerApps displayed below, and here the components are presented to the user while the team configures.

Here the component will rotate and fade in/out. It consists of three elements composed of properties where the user can control the loading text. The navigation between screens is very common in any app. Also, when you tap the next button, the screen hangs for a few seconds and takes you to the next screen. Note that it depends on the kind of data you are fetching on the second screen. But if the fetching is from the SQL database or Sharepoint list, then it will take a few seconds to load.

Every screen comes with different properties named Loading Power Apps Spinner. Here the features show the loader control where the default value is set to None. You can set the value to LoadingSpinner.Data or LoadingSpinner.Controls

Where the user navigates to the below screen and helps in resolving complex UI and tons of other fields.

If you want to have marching ants across your screen, then you need to follow these techniques. In Powerapps mainly two methods help in deciding when to show the loading spinner image. Let’s discuss them in brief:

In this blog post, we are going to take an example from -> this Video for a Better understanding

#Technique One- Automated Way

• Select the whole home opener screen. You’ll find the Advanced tab property called Loading Spinner in it. Select the code bar which says, LoadingSpinner.None it will be set as default.
• Set the data to LoadingSpinner.Data with making environment sluggish.
• The screen will be opened, and the data will come in. With this, the loading spinner will easily understand what’s happening.
• In the drop-down list, you’ll see the loading spinner color option which will look like a spinner.
• Set a spinner that controls side and slow controls using Power BI

#Technique Two – Manually Setting Spinner

• Users can import an image for loading spinner by using loading.io.
• The method will help to show and hide the images on different screens. It will have full control overload spinner.
• Choose the loading.io website and download my icon from tons of choices. Few of them are open source, and few are paid. It will show the preview before downloads and will allow choosing a color scheme.
• Users can customize the spinner and can download its speed and size of it.
• Please choose the next screen and implement it to communicate with the user about what’s happening. Now click on the Shoutout button.
• Later click on media and select images to download. Simply type the image name and the app will find it.
• Now, place the image above the shoutout button, so it gets captured once the user clicks it.
• Go to visible and add variable by writing code VARloading by setting it in default ‘false’ state.
• Show the icon by clicking the send shoutout button. Set the variable to VARloading =True.
• Add at least three events and submit the form with moving on to the previous screen.

Wrap up

The above techniques that we have discussed are very simple to understand. It comes with a great option to customize the spinner and give complete control over how we can use the method. If you still don’t have PowerApps and want to create a spinner component in PowerApps, hire PowerApps Consultant and allow your business to proliferate.

If you’re looking for a PowerApps Development company, then get in touch with us. We have the best PowerApps Developers who’ll create an excellent mobile application with technical limitations and customer satisfaction.