How do I create a custom network error landing page?

Question
1

I am working on a project to convert a website into App using WebView, however when the app try to load the page without internet connection, it display an unpleasant net error landing page which keeps flashing continuously. How do I create a beautiful custom (error) landing page to display whenever there is no internet connection? Thank you.

2

You should check systemVars.networkStatus variable first to determine if there is connectivity then if not do a Open Page to a custom error screen.

3

Thanks! This works fine to the website first page using the formula systemVars.networkStatus=="none" however when trying to access any other link on the website the problem persist. How do I make my custom network error page display whenever I try to access any link on the site without network?

Screenshot (396)
Screenshot (396)868Ă—291 9.21 KB

4

Perhaps you can try to capture the Location Changed Event from the Webview, which should fire when a user clicks a link, and in that Event you can re-test systemVars.networkStatus value and redirect the user page if == none.

1 Like
5

Thank you, it worked :star_struck: but error page keeps sliding! :frowning_face:

1 Like
6

Oh sometimes the event fires more than once. What you will have to do is check if the network status value changed from the last time before opening a new page.

7

Ok I will try that, kindly give me a guide on how to implement it. Thank you! :bouquet:

8

Just create a page variable that sets to the value of the network status in your webview event but before that do an IF check to see if they are unequal (systemvars.networkstatus != pagevar.networkstatus) and if True then open your error page.

9

Hi John,
I have created a network error page that I want to display when losing contact with the network.
I also want to use systemVars.networkStatus == “none”, but since I am new here and need some support, can you please explain a little more how I can use IF condition to open error page when losing contact with the network?

Thanks in advance

10

one question, When we use this way, does the default error message appear too?

11

Can anyone please help me with this issue?

12

what i would do, is to create this logic in the global canvas

image
image697Ă—277 10.5 KB

This would be the if function
IF(IS_EQUAL(systemVars.networkStatus, “none”), true, false)

And then in the page that you use as the no network message ,i would make this logic

image
image727Ă—217 8 KB

and this function
IF(IS_EQUAL(systemVars.networkStatus, “wifi”), true, false) || IF(IS_EQUAL(systemVars.networkStatus, “cellular”), true, false) || IF(IS_EQUAL(systemVars.networkStatus, “unknown”), true, false)

i hope it helps