Android Advance WebView - Androhub

WebView Banner

Android Advance WebView

We had learn basic things about WebView in my earlier tutorial. In that tutorial i am showing how to load url in WebView. But in today’s tutorial we are going to learn some more things about WebView. The things that we are going to learn today are given below:

1 . Go Back  – We can go back to previous page in WebView if present.

2 . Go Forward  – We can go forward to next page in WebView if present.

3. Refresh WebView  – We can fetch currentWebView url and reload the WebView.

4. Error Catching – We can catch errors thrown by WebView occurred by HTTP error,etc. inside WebViewClient class.

There are two other things apart from above four steps that we are going to learn are:

1. UserFriendly UI design – I am going to create a Custom Toolbar with some ImageViews as shown in video below.

2. No ActionBar Activity – Since I am creating custom toolbar so we don’t need ActionBar so for that we need our activity withoutActionBar.

Video Demo

1. Create a new project in Android Studio by navigating to File ⇒ New Android ⇒ Application Project and fill required details. By default my activity is MainActivity.java.

2. Create a layout naming activity_main.xml and add the following xml code into it. In this code i had created a custom toolbar at top and added some ImageView and title to it and placed WebView below it.

You can download icons from here. This is a best site to download icons for all sizes, colours and of all app platforms.

3. Now create a xml drawable file under drawable folder naming imageview_selector.xml for background selector for ImageViews.

4. Now create a MainActivity.java and add the following code. In this code all above discussed steps are included.

5. To open url in WebView we need Internet Connection so for that we have to give “INTERNET” permission in Manifest file also we are checking internet connection before loading any url so for that we need “ACCESS_NETWORK_STATE” permission in Manifest file.

6. Finally add below FullScreen style code inside styles.xml file. This style is used for making our activity fullscreen as i mentioned above.

7. Now, you are all done, run your app and you will get the output as shown in video.

Make sure to put http:// or https:// before loading url and change your url instead of androhub.com or you can refer to my earlier tutorial to load url by taking user input.

Thanks. :)

 

3 Comments

Kapil
Thursday, January 26th, 2017

I want to create a listview with image and text in each element of list.
Also the elements must be like hidden checklist when user clicks color of the elements clicked changes and when submits
all selections must pass to another class or activity.

Ram
Friday, June 1st, 2018

Great Tutorial!! Youtube Videos are not playing in full screen mode.

Raj singh
Wednesday, February 13th, 2019

I have the same issue as ram and I want a horizontal progress bar which increases with time but mine show max at the start. please help me to understand this.

Post comment

Your email address will not be published. Required fields are marked *