BidVertiser

Categories

Follow Us @web_learners

BidVertiser

Monday, April 6, 2020

How to Add Exit Dialog on Splash Screen In Webview Android App | Webview App Development Series Part 8

April 06, 2020 0 Comments
Hi, Today I will show you How to Add Exit Dialog In Webview Android App. In the previous post I have shown you How to Add Pull to Refresh in Webview App. you can check it out. By the way Let's start.



As In my app has Splash Screen, so I will implement App Exit dialog in my SplashActivity.java file.
I will write a function called onBackPressed below the "onCreate" and will set a Message for showing the user when the user will want to exit the app.

And there will be two buttons, one is "Yes" button, another one is the "No" button. If the user clicks on the "Yes" button, Webview App will exit.  and if the user clicks on the "No" button, the user will stay the current page.


Code:



So, the whole code will be in SplashActivity.java is :


Code:

And the whole code will be in activity_splash.xml is:

Code:



That's it. We have finished coding. now we will run our webview project.


As you can see in my screenshot above, It's working perfectly. Thanks.

How to Add Pull to Refresh in Webview App | Webview App Development Series Part 7

April 06, 2020 3 Comments
Hi, Today I am going to show you how to Add Pull to Refresh in Webview App. In the Last post, I have shown you How to Add Progress Dialog in Android Webview App. Let's start.


First, we will write code in "activity_main.xml" file, we will take a "SwipeRefreshLayout" above our Webview, and we will close it below "Webview".

swiperefreshlayout width and height will match_parent, and you need to give a id, I am giving id is "swipe".


Code:


We have finished coding in "activity_main.xml" file. So, the whole code will be in activity_main.xml file is :

Code:


Now we will move to "MainActivity.xml" file. First we will take a private SwipeRefreshLayout variable, will give the name "swipeRefreshLayout".

Code:


After that, in "onCreate" function we need to retrieve swiperefreshlayout design from activity_main.xml file and store it to swiperefreshlayout variable which we have taken above.

And Also you need to call onRefreshListener and I will give custom color for SwipeRefreshLayout, you can use default color also. See below code:


Code:



We have finished writing code for "Pull to Refresh". So, the whole code will be in MainActivity.java is:


Code:


Now we will run our project.


as you can see my screenshot we have successfully added pull to Refresh function in our Webview app. Thanks.

How to Add Progress Dialog in Android Webview App| Webview App Development Series Part 6

April 06, 2020 0 Comments
Hi, Today I am going to show you how to add progress dialog in Webview or any android app. Let's Start.


First, you need to take a global ProgressDialog, I called it pd;

Code:



After that within "oncreate" section you need to assign that variable pd, then you have to set Message which you want to show when the website loading. In my case, I will show "Loading Please wait....".

After that, you need to write a function below "onCreate" and then you need to call that function inside onCreate and pass into WebViewClient function. See below code:


Code:



I have given the name of that function is "mbfllixer" and "web" is my variable name, in that variable I stored webview layout. Also you have to call an override function "onPageFinished". When our website loading will finish, the Progress Dialog should go. So, the code will be:

Code:



We have finished the coding for showing Progress Dialog. So the whole final code will be in MainActivity.java is :

Code:



And the whole code will be in activity_main.xml is :


Code:



That's it, now we will run our project, As you can see in my screenshot below we have successfully added Progress Dialog in our Webview App.


If you face any problem, you can let us know in the comment box below. Thanks.

Sunday, April 5, 2020

How to Enable File Upload in Android Webview App | Webview App Development Series Part 11

April 05, 2020 90 Comments
How to Enable File Upload in Android Webview App? That's what most of the people search in the google and youtube. Because this is the most complicated part of the webview app development.

Are you stuck with the problem "How to allow file upload and download in webview" also? Don't worry, Today I am going to show you how to write the code in android studio to support file upload in android webview app. 

Before we move to the tutorial about uploading part I would like to let you know that we already have a post about "How to enable download in webview?". However Let's Start.



First of all, You need to give 3 permission in AndoidManifest.xml. Those are given below:


Code:


After that, you need to write code in MainActivity.java file. You need to take some global variable for opening file chooser with camera option, see below code:

Code:



After that, you need to write code for showing "file chooser". Just copy the below code and paste it into your WebChromeClient function. By the way, you can see below code contain "web" is my variable name, I have retrieved and stored my Webview from activity_main.xml.you need to replace that variable "web" with your variable name.

Code:



Then you need to write Override function after "onCreate", See below code.


Code:



Don't forget to write this line of code in your "strings.xml" file.

Code:




Whenever you will paste these codes in your project you see lots of red words. you need to click on that red word then press "alt+Enter" then it will import class automatically. Or you can just copy below import class and paste in your import section. all the Error will go.

Code:


After paste above import class, you will see almost all the error gone, only 5 error still there, they are "uri", "uploadMsg" and "result". you need to click on "result" then will show suggestion you need to click on that, then all the error will go. See below picture:



So, the whole final code will be in MainActivty.java is:

Code:



In conclusion, we have finished our coding for our Webview App. Now we will run our project on Emulator. As you can see in my screenshot, it's working perfectly.



By the way, If you face any problem, let us know in the comment box below. We will try our best to solve your problem. Thanks.

Saturday, April 4, 2020

How to Enable Download in Android Webview App | Webview App Development Series Part 10

April 04, 2020 2 Comments
How to Enable Download in Android Webview App? In the Last post of our Webview Series, I have shown How to Add Splash Screen in Any Android App. Webview doesn't support Download or Upload in App. Today I will show you how can you download any files, video, audio, pdf, image e.t.c file. In the next post, I will show you how to Enable Upload in Webview App. So, Let's Start.


First of all, you need to write a function that will ask users to give permission to access their photos, files, and media in their Mobile Phone. Because for saving the downloaded file on our mobile phone, the Download Manager needs to access it.

Code:



Now For handling download in webview, we need to write another function, in that function we will set notification visibility visible until download complete. Also, we will give saving file directory path "Download".


Code:




So, Whole final code will be in MainActivity.java file is :


Code:


After that, we need to go to AndroidManifest.xml for giving WRITE_EXTERNAL_STORAGE permission. (Don't forget this step otherwise, your app can be crashed)


Code:


We have finished our coding for Enabling Download in Webview, now I will run my project.




As you can see in the video and my screenshot of App, my website is about 25 types of social media free video downloader, and I have shown about Vimeo video download, as you can see all the function is working perfectly in my Webview App. I am recommending you to watch the above video for a better understanding. And if you face any problem in code or Error, don't hesitate to contact me. Thanks

How to Add Splash Screen in Any Android App | Webview App Development Series Part 5

April 04, 2020 0 Comments
Hi, In the last post I have shown how to add ProgressBar in Webview AppToday I am going to show you how to add Splash Screen in any Android app. For Better Understanding, I am recommending you to watch the below video.


First of all, you need to create a New Empty Activity from the left side, click the app and press right button of your mouse then select "New"-->" Activity"-->"Empty Activity"

Splash Screen

Then write your Activity name, I am giving SplashActivity as the activity name.then click on finish. 

Create Splash Screen

After finish sync your webview project it will automatically open activity_splash.xml and SplashActivity.java.
Now first we will design our Splash Screen layout in the activity_splash.xml file. We will show our company logo or company banner on the splash screen. So, first, we will copy that image then we will paste in our project in the drawable folder. For that first expand "res" folder from the left side then click on the drawable folder right-click on your mouse, then click on Paste. 

add Splash Screen in webview app

It will show you two folder and ask you to choose where you want to paste, you should choose drawable, not to choose drawable-v24.

Splash Screen in Android app

After that it shows you the name of your image, remember that your image name should not have space and also should not have the uppercase letter, image name should be all lowercase letter and don't have space. Example "twitterbanner.png"

Webview app

In the activity_splash.xml file first we will write RelativeLayout instead of ConstraintLayout ,thrn we'll take an ImageView, in this imageview we will show our Banner or logo or any image. we will give "height = match_parent","width = match_parent","margin =15dp",id(i am giving id "splash").

Code:
So the whole code will be in activity_splash.xml is:

Code:


Splash Screen design

After that, we will move to the SplashActivity.java file. First, we will store our splash time in a variable called Splash_time, we will take a global variable for efficiency in coding. and I will show my splash screen for 2000 milliseconds. However, you can increase or decrease this showing time as long as you want.

Code:


After that, I will call Handler().postDelayed function in oncreate method.

Code:



So, the final whole code will be in SplashActivity.java file is:

Code:



Webview Android app

We have finished coding in the SplashActivity.java file for Webview App. now we will arrange our activity in the AndroidManifest.xml file. SplashActivity will be first performed before MainActivity. In conclusion, the whole code will be in the AndroidManifest.xml file.

Code:


AndroidManifest.xml

We have finished writing all the code for Creating Splash Screen in Android Webview App. Now I will run my project on Emulator.


As you can see above picture my Splash Screen is working perfectly in Webview App. So we have successfully created our Splash Screen. Thanks.

Friday, April 3, 2020

How to Add Progress Bar in App | Webview App Development Series Part 4

April 03, 2020 2 Comments
Hi, In the previous post I have shown Open Url within the Webview App Not in Browser  Today I will show you how to add a Progress bar in the Android /Webview app. Watch the full video for better understanding. Let's start.



First, you need to go activity_main.xml, in the activity_main.xml file above WebView(the previous post I have shown how to set up WebView) you need to take a Progress Bar.you need to select "width" is "match_parent" and "height" is "wrap_content".Then you need to take an Id, I have given that id name is progressBar, then have to take ProgressBar Style like you can take circle type, Horizontal Bar type e.t.c.I am taking Horizontal type ProgressBarStyleHorizontal

Code:
[


We have finished our code for the progress bar in activity_main.xml. So, the final code will be in activity_main.xml is:

Code:


Now we will write code in MainActivity.java file, First, we will take a global variable ProgressBar, I am giving the name of that variable is progressBar.

Code:




Now we will retrieve ProgressBar layout from activity_main.xml file and will store in our global variable progressBar.
Code:


Then we will write a WebChromeClient() function, in that function we will write code for if our website has not loaded 100% and our progressBar has gone, then ProgressBar visibility will be Visible, else if our website loaded finish and still showing progress bar then ProgressBar visibility will be Gone from Webview App.
Code:



That's it. We have finished writing code in activity_main.xml and MainActivity.java file. Now we will run our Project.

As you can see in my above picture my app is running in Emulator, And you can see its showing ProgressBar and work perfectly also, So we have successfully added ProgressBar in our Webview App. Thanks.