Learn to display web pages in WebViews of applications on Android systems

In fact,  WebView  is one of the widgets of  the Android platform, which is also very useful and can be used in many situations. In other words, we can use this view to display an online or offline web page within an Activity. It's the same as opening  a site and webpage in Chrome, except that the user will see the webpage they open inside an application and not connect to a browser. Therefore, using WebView, we can view web pages in  applications designed for the Android platform, but with the difference that when opening web pages, browsers are not connected but are displayed independently in an application.

Here's what you will learn in this tutorial:

- WebView applications

- How to  create a WebView project inside Android Studio  - How to display offline and  online web pages  in applications and activities

WebView applications

To better understand  the applications of WebView, we will give you examples. For example, consider using Google Maps and using it to find the Location you need so that you can easily get to your destination using the map. In this case, you should use web pages, which may not be suitable for using web pages for mapping in some situations, and in this case, it is better to use mapping applications that use Google Maps. This is one of the best examples of using WebView. Or in other cases, consider that you have launched a store site, and for some reason, you cannot create the desired application for your  store site, in which case you should use WebView. Using WebView means this, Which opens web pages inside applications.

In other words, we can set up webpages that we use and refer to on sites and the Internet within the applications and access them through the application.

WebViews are the webpages that we put inside applications and access them to make them easy to access.

How to build a WebView project

1- We  create a new project in Android Studio  and choose the desired name. The name of choice in this tutorial is WebView.

2- The type of activity needed and used in this training is Empty Activity.

3- It should be noted that the appropriate language for this project is Java. Select the Java language for this project.

4- It should be noted that I must define Permission for them to establish a connection between  the application  and the Internet. So first, we define the Permission so that we can finally establish a connection between the application and the Internet.

5- The codes that must be in the AndroidManifest.xml section to get the license are as follows:

6- We have to remove the WebView widget in the UI layer in Design mode, and drag it on the screen.

7- Using another method, we can manually add the relevant tag to the Layout in Text mode, such as the following:

8- The codes that should be in the activity_main.xml section are as follows:

9- Then, we need to complete the MainActivity.java file as follows:

In the code above, we first created an object from the WebView class with the optional name mWebView.

Then inside the onCreate method, we connect this object to the corresponding view.

In this section, we will display the address http://dotneck.com/ inside this activity, which is possible using the load URL method.

10- We will implement the project.

11- After running the project, if the emulator is connected to the Internet, you will see that it will have access to the site's contents.

12- The  web page  is loaded inside activity, and we can easily scroll and scroll up and down and see all the contents.

13- After we run the project and the result is successful, we will see that there is an ActionBar that is not very good in webpages that are displayed inside the application activities, and we should remove it.

14- To remove the ActionBar, we can change the project theme's style to Theme.AppCompat. Light.NoActionBar as below.

15- The codes that should be in the styles.xml section are as follows:

Note:

Apart from the load URL method, there are other methods that you can use. Such as canGoBack (), canGoForward (), clearHistory (), getUrl (), getTitle ()

If we use it, we will be able to make many changes, and we can easily make a lot of changes to  the webpages  displayed in the applications.

All JavaScript codes are activated by entering the above code and using setJavaScriptEnabled and the value true for it.

16- We will implement the project.

17- After running the project, we will see that the Java code has been activated, and all the changes we wanted to make to them have been applied.

18- It should be noted that many methods can be used to make the desired changes.

19- For example, setDefaultFontSize is used to specify font and font sizes.

20- We can enter the zoom buttons on the screen. Like the following:

21- Zoom buttons will appear when scrolling down or up the screen.

22- To manage classes, we need to create an internal class, and in this part of the internal class tutorial that we create to manage classes, it is called mWebViewClient.

23- This built-in class must inherit from WebViewClient.

The first method created for management in the code listed above is the link management method.

24- We will implement the project.

25- After execution, we will see that if we click on one of the links, the page related to that link will be created in a new page called WebView Browser Tester. Of course, this is not very popular.

26- We must use a method to finally load the link on the same  web page  by clicking on a link.

27- To do this, we can use shouldOverrideUrlLoading, which loads links in webpages and does not create new pages to load them.

28- From the list, select another method whose input parameter is WebView called view. And the next parameter is the String named URL.

29- Of course, it should be noted that Android has deprecated these methods, but they can still be used.

We completed and modified the method that had expired by Android as above.

After inserting the above code, if we click or touch a link, the corresponding page will open in URL format.

30- The onPageStarted and onPageFinished methods can show the page load time and completion of this process, respectively.

In the code above, create a ProgressBar inside onPageStarted and stop it inside onPageFinished.

31- Then we have to use Toast.

 32- Then, we define the setWebViewClient method inside onCreate, and for its input, we put the mWebViewClient class:

33- Then, run the project and click on a link.

34- After running the project, we will see that if we click on a link, it will open the link in WebView and not in a browser. So, the changes we have made have been successful.

35- Then, you will see the messages Loading page… and Loading finished, provided in Toast format.

36- The complete and final code that should be in the MainActivity.java section is as follows:

How to display local and offline HTML webpages in WebView

In the previous part, we displayed a web page online that required to be connected to the Internet and communication between them. But sometimes, we may need to display and access webpages offline. In this case, we can provide local HTML pages offline.  The application  of this method is that, for example, a designer wants to present his booklet offline in the form of a web page, in which case there is no need for an Internet connection.

We have to put all the related files inside the assets in this method. Of course, it should be noted that this folder does not exist by default, and we must create it.

To create this folder, right-click on the app and go to New> Folder> Assets Folder. Then in the window that opens, we must click Finish to create the desired folder.

Note:

Another way to create this folder is outside the Android Studio environment.

To do this, a page contains an Html and CSS file.

- We need to copy these two files and paste them into  the Android Studio  or File Explorer operating system.

- At the end, we act like the following, instead of the site URL, we enter the following address.

After performing these steps, the index.html file that exists in the assets folder of the Android project will be executed in WebView.

In this part of the tutorial, we learned how to add simple HTML webpages to applications, although there are more sophisticated methods. But in this part of the tutorial, we learned how to import  webpages online and offline  into applications and display them in activities.

Enable the ability to install programs and applications locally on the internal memory card.

All applications and programs are installed by default in the internal of devices and phones. In other words, it can be said that by default in Android systems, all programs and applications are installed in the device's internal. For many reasons, users may not want the applications to be installed internally by default. These reasons can be that the device's internal memory is low or the internal of the device does not have high features and capabilities. In this case, we have to apply settings and changes to put applications in the memory card or memory by default. Install the device externally.

In this part of the training, we will also learn that:

- In what case should we install programs and applications on external and memory cards?

- How to determine where to install applications

- In what cases should we not install applications on external and memory cards?

In what case should we install programs and apps on external and memory cards?

In some cases, there may be devices with a small amount of internal storage space, and in this case, installing some apps on the devices may fill their space, and in this case, it is necessary to use memory cards that act as external memories. In such cases, using memory cards to install applications is necessary, and we must use them.

1- Put the android feature: install Location with the desired value inside the AndroidManifest.xml file tag. As below.

2- The codes that should be in the AndroidManifest.xml section are as follows:

In the codes listed above, we have considered three values ​​for this feature:

- Auto:

If we select the Auto value for this feature and consider the program may be stored on external-memory or the same memory cards. But there is no 100% guarantee, and the operating system will determine where the application will be installed based on some criteria. Some of these criteria are the amount of space left in the internal. In other words, in this case, if the internal memory of the device is full and there is external, the application will be installed on external.

- preferExternal:

By setting this value to this attribute, we specify that we prefer the application to be installed on external-memory to the operating system. Of course, it should be noted that in this section, we have used the word preference, and it is clear that there is no guarantee that the application will be installed 100% on external-memory.

- internal Only:

Let's consider this value for this feature. We will see that the application is always installed on the internal memory. It is impossible to transfer it from the internal memory to the external memory and will be installed in the internal memory forever.

Note:

According to the description above, to install  the application  on external memory, we must select the value ofExternalExternal. Of course, you should note that there is no 100% guarantee that it will be installed on external memory and not on the internal memory.

Note:

On some devices and tablets in the market, it is impossible to install applications on external memory with preferredExternal enabled, and applications cannot be installed on external memory, even after installing it on the internal memory. There is no transfer to external memory.

On some devices, in the Developer Options section, there is an option called Force to allow apps on external, which, if enabled, will be possible to install applications on external storage.

In what cases should we not install apps on external memory and memory cards?

Note that in some cases, if the external memory is removed from the device, it will not be possible to restore and use the files in the external memory. In some sensitive cases where it is necessary to have programs, it is better to install them in the device's internal memory so that we always have them.

In other words, if the applications are connected to the services and if the memory card is removed from the device,  the applications  can no longer connect to the services as before, or in other cases, it will be difficult to use them. Therefore, to avoid these problems, it is better not to install applications on external storage because if the memory cards are removed, running applications will be difficult.

In this section, you provided settings that change the Location of installation and storage of  applications on Android systems  and transfer them from internal memory to external memory or vice versa. In some cases, which for various reasons, need to change the location of installation and storage of applications, in these cases, you can follow the steps included in this tutorial and change their storage and installation.