AMFTF: Something to know to make your apps just a bit more perfect - #ARCHIVED#

This content has been archived. It may no longer be relevant.  

If you are like me, your app needs to be perfect. Well, ok, close to it then. O wait, how much time do I have for this app? Ok, the app must be good enough 😛 But then I try to make it a bit more perfect in my own time. Sounds familiar?

This happened to me recently regarding a for me annoying “feature”. Let me explain the situation.

A screen contains a visible label. The value (“Text” property) of this label is set by a variable. The value of the variable is calculated during the “OnVisible” event of a screen. When a screen loads for the first time, there is no real issue because there is no value for the variable yet and after the calculation the new value is shown. A user therefore experience no sudden change of value.

But what happens when the screen is visited for a second, third etc. time? Well, here the annoying feature appears. The variable now has a value and when the calculation results in a different value, a user will see first the old value and soon after the new calculated value. I do not like this! I do not want values to change “on its own” for users. The value should be correct from the start.

So a preloader hiding the screen temporary to the rescue you would think. The first statement of the screen’s “OnVisible” event is to change a variable that is used for the “Visible” property of the preloader so that…, Wait, this still does not work. I now see the old value, soon after the screen only shows the preloader and after the calculation is done, the preloader is hidden showing the new calculated value. Grrrrr.

So how do I solve this?

All screens have a preloader (a set of control) which temporary hides the screen content and only an animated gif and some text which show the progress is shown. This preloader is shown based on a variable (“var_ShowPreloader”). Just before I navigate to another screen, I set the value of this variable using the function “Set” to true.

You could imagine that this triggers the preloader on the screen your navigate from, and I imagine it does but because the variable is set just before the function “Navigate”, you do not see this. Trust me, I checked this many times where each screen has a different preloader color screen. Whoeha 😊

When a screen is now rendered, the preloader is directly shown. When the calculation is done, the preloader is hidden and the new value is shown. No old value is shown anymore.

Tip: The preloader needs to be the first set of controls of a screen!