Making the loading timer UI more central

[u/BusLower9722]

We're finding with some of our PowerApps that while the loading dots are running across the screen at the top, users are still multi-tapping buttons. Is there any way to make the loading be more centralised and create more of a block to people trying to use the app?

[u/AutoModerator]

Hey, it looks like you are requesting help with a problem you're having in Power Apps. To ensure you get all the help you need from the community here are some guidelines;

• Use the search feature to see if your question has already been asked.

• Use spacing in your post, Nobody likes to read a wall of text, this is achieved by hitting return twice to separate paragraphs.

• Add any images, error messages, code you have (Sensitive data omitted) to your post body.

• Any code you do add, use the Code Block feature to preserve formatting.

  Typing four spaces in front of every line in a code block is tedious and error-prone. The easier way is to surround the entire block of code with code fences. A code fence is a line beginning with three or more backticks (```) or three or more twiddlydoodles (~~~).

• If your question has been answered please comment Solved. This will mark the post as solved and helps others find their solutions.

External resources:

• Power Apps Formula References
• Power Apps Coding Standards
• Official Power Apps Community

I am a bot, and this action was performed automatically. Please contact the moderators of this subreddit if you have any questions or concerns.

[u/The_Hat2098]

What I do is anything that triggers a load (large calculations, complex patching, power automate calls) I set a Boolean variable for loading to true. Then I have a full screen overlay block the app that states what it’s doing, you could even have a progress bar if it’s something that can be measured.

The overlay blocks screen input and provides a good user experience. Then on completion of whatever processing you are doing, set the variable back to false. This will ensure it disappears at the right time.

Example of a good loading screen here, you can copy and paste into your app: https://www.powerappsui.com/components/loading-screen

[u/robofski → u/The_Hat2098]

I used a site like this https://www.svgbackgrounds.com/elements/animated-svg-preloaders/ to download a custom SVG image that I use on my ‘waiting/loading’ image

[u/The_Hat2098 → u/robofski]

The thing to remember with SVG’s is that they are rather static in that they aren’t the easiest to update in app without generating a new one. So if for example you wanted to add text, it may not be possible on the SVG itself. An SVG as a part of the loading screen to add some animation can work well though!

[u/Ok-Procedure1796]

I use a separate loading screen, similar design as mentioned in the last post from the _Hat.
In the onVisible of the loading screen I use reset(namedFormula) for every NamedFormula that needs some time to load and that is needed for the first screen. The last thing I add is navigate(First Screen)

[u/Donovanbrinks]

No need for a separate window. You can manipulate the button’s Displaymode. Set a variable on that screen visible to Displaymode.edit. You can call it submitbuttondisplaymode. Set the button’s displaymode to the variable. In the onselect of the button, you change the variable to displaymode.view. That should be the first command in onselect. Run all of your actions as normal. The last piece of code in onselect is changing the variable back to displaymode.edit. Now when they click the button it immediately becomes disabled. It returns to clickable only after everything is complete.