Nobody wants to wait for a page to load and then view the information on page. But in data centric applications it usually happens when a page is trying to fetch the data from backend and rendering again during that time we see a wait symbol on screen.
In my last APEX application, I customized the usual wait icon and used my own image (.PNG file) in one of the pages. Today in this blog I am going to talk about the same. Let me first show you how the page looks like with new icon.
In this page, these five balls moves up and down as a wait icon.
This is the actual GIF file that I used.
Following are the steps which I followed.
Step 1: Uploaded the GIF file under the Static Application Files component (in Shared Component)
Step 2: I wanted to display a report after the wait is over so in the same report region I created a "Display Image" item. Set the following properties of this item:
Name: P370_SORT_GIF
Type: Display Image
Based On: Image URL stored in Page Item Value
Alternative Text: Querying file. Please wait...
Custom Attributes: style="width: 80%"
Static Value: #APP_IMAGES#sorting.gif
Step 3: Created 2 dynamic actions
1st Dynamic Action Event: Page Load | 2nd Dynamic Action Event: After Refresh |
True Action: Show Selection Type: Item(s) Items(s): P370_SORT_GIF Fire on Initialization: Yes True Action: Refresh Selection Type: Region Region: Region_Name Fire on Initialization: No | True Action: Hide Selection Type: Item(s) Items(s): P370_SORT_GIF Fire on Initialization: No |
Step 4: As soon as the page is loaded the GIF image will be displayed as a wait symbol.
Step 5: After the page is refreshed and once the report is displayed the GIF image will be hidden.
This is just a short and simple way of customizing the default components.
As I mentioned initially that nobody wants to wait to see the desired results on the page, but if we customize the icons with some better looking images then definitely our client will not be irritated
I hope this was helpful and understood.
Thanks for giving your time and reading my blog !!