Android Webview: Display image while page loading - android

I'm new on programming. I'm trying to create an app with Webview/Android.
I'm trying to add a type of splash image until the web page is finished loading.
I got it the splash image, but the bliss ends before the url is finished loading. Then I get a white screen before the page is displayed. I tried many different guides, but none of them solve the problem. I hope some one can help me with this.
I want splash or an images to display while the web page finished loading and showing page without any white screen in between.
Here is my code:
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<WebView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/webView1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"/>
MainActivity.java
package com.eatnow.brasil
import androidx.appcompat.app.AppCompatActivity;
import android.os.Build;
import android.os.Bundle;
import android.os.Handler;
import android.webkit.JavascriptInterface;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.graphics.Bitmap;
import android.view.View;
public class MainActivity extends AppCompatActivity {
private WebView webView;
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//webview use to call own site
webView =(WebView)findViewById(R.id.webView1);
webView.setWebViewClient(new WebViewClient());//use to hide the address bar
webView .getSettings().setJavaScriptEnabled(true);
webView.getSettings().setBuiltInZoomControls(true); // Enable zoom on sites
webView.getSettings().setSupportZoom(true);
webView .getSettings().setTextZoom(95); // where 90 is 90%; default value is ... 100
webView .getSettings().setDomStorageEnabled(true); //to store history
webView.setBackgroundColor(0xff2f0848);
//imporove webView performance
webView.getSettings().setRenderPriority(WebSettings.RenderPriority.HIGH);
webView.getSettings().setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK);
webView.getSettings().setAppCacheEnabled(true);
webView.getSettings().setLayoutAlgorithm(WebSettings.LayoutAlgorithm.NARROW_COLUMNS);
webView.getSettings().setUseWideViewPort(true);
webView.getSettings().setSaveFormData(true);
webView.setScrollBarStyle(View.SCROLLBARS_INSIDE_OVERLAY);
webView.loadUrl("https://eat-now.no/");
}
#Override
public void onBackPressed() {
if(webView.canGoBack())
{
webView.goBack();
}
else{
super.onBackPressed();
}
}
}
activity_splash.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:background="#2f0848"
tools:context=".SplashActivity">
<ImageView
android:id="#+id/splash"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="0dp"
android:contentDescription="#string/app_name"
android:src="#drawable/eatnow_splash" />
</RelativeLayout>

This is a typical problem of WebView.
We normally use a ProgressDiglog to fill the white screen when webView loading.
Here is a example using ProgressDialog when the WebView is loaging:
https://github.com/rupok/webview
Its a old project using eclipse IDE, but you could refer the ShowWebView.java and the xml in layout. You could use a image to replace the ProgressDialog, if you want.

Related

WebView is clipping the webpage in android 4.4

WebView is clipping the webpage on Android 4.4. Here is how it looks:
It is opening correctly in google chrome. I want it to open like this in the webview.
Following is my code:
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<WebView
android:id="#+id/web_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
MainActivity.java
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.webkit.WebResourceError;
import android.webkit.WebResourceRequest;
import android.webkit.WebView;
import android.webkit.WebViewClient;
public class MainActivity extends AppCompatActivity {
WebView webView;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
webView=findViewById(R.id.web_view);
webView.getSettings().setJavaScriptEnabled(true);
webView.setWebViewClient(new WebViewClient());
webView.getSettings().setDomStorageEnabled(true);
webView.getSettings().setAllowContentAccess(true);
webView.getSettings().setAllowFileAccess(true);
webView.getSettings().setDatabaseEnabled(true);
webView.getSettings().setDomStorageEnabled(true);
webView .getSettings().setLoadWithOverviewMode(true);
webView .getSettings().setUseWideViewPort(true);
webView.loadUrl("https://viftbox.com/");
}
}
For using a recent WebView engine on Android and you can't use Android System WebView or Google Chrome:
Prior to Android 5.0 improvements to the Android WebView was limited to OS upgrades/updates. So the recommendation was to use the NOW DEPRECATED Crosswalk Project as the WebView. While the site no longer exists, its ghost exists on archive.org I don't know if enough of the site survives there to be useful. This might be a solution if you are unable to change hardware and need more recent webkit features.
As the Crosswalk Project is no longer updated, or it doesn't have the features you need, I've learned that Mozilla has a GeckoView which wraps their Gecko render engine.
Note that according to Mozilla's documentation they have their own APIs so GeckoView is NOT a drop-in replacement for Android's WebView, so some effort must be made for integration.
Either way including a custom webview engine will add to the APK size.

Discord OAuth2 login Fail via Android Webview

I'm using discord to let the user login on my android app.
The code is as follows:
MainActivity.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<FrameLayout
android:id="#+id/webview_frame"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MyActivity">
<WebView
android:id="#+id/authWebView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="invisible"
app:layout_anchorGravity="center" />
</FrameLayout>
DiscordOAuth.java:
package com.example.oauth2test;
import android.app.Activity;
import android.view.View;
import android.webkit.CookieManager;
import android.webkit.WebView;
import android.webkit.WebViewClient;
class DiscordOAuth {
private static final String LOG_TAG = "Discord OAuth 2 Login";
public void getAuthentication(Activity activity) {
String authURL = "https://discordapp.com/login";
WebView authWebView = activity.findViewById(R.id.authWebView);
authWebView.getSettings().setJavaScriptEnabled(true); // enable javascript
authWebView.getSettings().setAppCacheEnabled(true);
authWebView.getSettings().setLoadWithOverviewMode(true);
authWebView.getSettings().setUseWideViewPort(true);
authWebView.getSettings().setBuiltInZoomControls(true);
authWebView.getSettings().setSupportMultipleWindows(true);
authWebView.getSettings().setJavaScriptCanOpenWindowsAutomatically(true);
CookieManager cookieManager = CookieManager.getInstance();
cookieManager.setAcceptCookie(true);
authWebView.setWebViewClient(new WebViewClient());
authWebView.loadUrl(authURL);
authWebView.setVisibility(View.VISIBLE);
}
}
when the above is executed, you will get a login page, but when you try to loging, the loading animation will appear for a moment, and you will be back on the login page without even a success or a failure
after searching, i suspect that the problem has something to do with multiple windows and how to deal with them, but i can't be sure.
The final goal is to use oauth2 via a WebView to login to discord and get the username of the user
Implement AuthCallback interface in your class & you will get response in callback methods
Discord internally needs WSS connection to complete authorization. WSS connection requires DOM storage to store client information. However in Android webview, DOM storage is disabled by default. you can change this in WebSettings by webSettings.domStorageEnabled = true

Android App not connecting to internet on emulator

The app does not connect to the internet. I have
<uses-permission android:name="android.permission.INTERNET" />
in my manifest and I checked the other applications on the emulator for example youtube and google search works but the application isn't able to load the page. This is my main java file.
import android.app.Activity;
import android.os.Bundle;
import android.webkit.WebView;
public class MainActivity extends Activity {
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
WebView myWebview ;
myWebview = (WebView) this.findViewById(R.id.webz);
myWebview.loadUrl("https://en.wikipedia.org/");
}
}
and this is my main activity
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.hoda.myapplication.MainActivity">
<WebView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/webz"></WebView>
</android.support.constraint.ConstraintLayout>
this is the error i get
[ERROR:gl_surface_egl.cc(289)] eglChooseConfig failed with error EGL_SUCCESS
Try enabling javascript and override the webviewclient to avoid redirection:
WebView myWebview ;
myWebview = (WebView) this.findViewById(R.id.webz);
myWebview.getSettings().setJavaScriptEnabled(true);
myWebview.setWebViewClient(new WebViewClient());
myWebview.loadUrl("https://en.wikipedia.org/");
and update the constraints of your WebView:
<WebView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:id="#+id/webz"></WebView>
The problem was with the emulator's graphics I believe as trying #diegoveloper 's solution on the emulator still did not load the page but trying it on an actual android device was successful.
Do this
Restart the emulator (as suggested in another post and in the comments of this post)
If that doesn't work, restart your device.
Worked for me.
Add activity in your AndroidManifest.xml
android:name="com.(your browser activity)"
android:screenOrientation="portrait">

Android Studio: How to set a webview loading and error view?

I am working on an application for my study purpose , the app contain a navigation drawer and some webviews.
my problem is when the page is loading, the screen still white and boring. and if the connection failed the ugly "no connexion" page appear showing my host adresse..
I want to set a loading page or image and an other one for alternative scenario(connexion fail, ...)i tried some solutions but no one of then suite my code.
the is the fragment JAVA and XML code..
layout1_acceuil.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent">
<WebView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/webView1"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />
</RelativeLayout>​
menu1_acceuil.java
package xxxx.yyyyyy;
import android.support.v4.app.Fragment;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
/**
* Created by Malek Boubakri on 13/03/2015.
*/
public class menu1_accueil extends Fragment {
View rootview;
#Nullable
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle setInitialSavedState) {
rootview = inflater.inflate(R.layout.layout1_accueil, container, false);
//set up webview
WebView webView1 = (WebView) rootview.findViewById(R.id.webView1);
// Enable Javascript
WebSettings webSettings = webView1.getSettings();
webSettings.setJavaScriptEnabled(true);
//load an URL
webView1.loadUrl("http://myhost.tn");
// Force links and redirects to open in the WebView instead of in a browser
webView1.setWebViewClient(new WebViewClient());
return rootview;
}
}
may my problem can seen easy for some genuis but am just a beginer and if this app dont run it will effect my mark badly :'( please post any information can help me and i will be thankful.
(Again,I have to mention that i still beginner in android dev and my English may be somehow bad..)
You can perform any action before and after the webpage is loaded with the class WebViewClient. You can override method like onPageStarted(), onPageFinished() and onReceivedError().
This is the android developer site for the WebViewClient, you can find all the information here: http://developer.android.com/reference/android/webkit/WebViewClient.html

Android App with WebView not working

Trying to use WebView, I have the following code:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:orientation="vertical"
tools:context="com.example.places.xt.MainActivity$PlaceholderFragment" >
<WebView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/webview"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true" />
</RelativeLayout>
and
(...)
import android.webkit.WebView;
import android.os.Build;
public class MainActivity extends ActionBarActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
if (savedInstanceState == null) {
getSupportFragmentManager().beginTransaction()
.add(R.id.container, new PlaceholderFragment()).commit();
}
WebView webview = (WebView) findViewById(R.id.webview);
setContentView(webview);
String summary = "<html><body style=\"background-color: yellow\">You scored <b>192</b> points.</body></html>";
webview.loadData(summary, "text/html", null);
}
(...)
When I click on "Run" to force building APK file and then download and start it on my phone, it says "App has been stopped". The app has the size of only about 760 kB. I think it's not very much, I guess the WebView package is not correctly imported. What can be the reason?
Tested on 4.4 Kitkat, Eclipse, Win 7 32 bit
First, your webview is in the fragment layout and not in the activity layout. Move the code that accesses the webview to the fragment's onCreateView(). See NullPointerException accessing views in onCreate().
Second, remove the setContentView(webview). It serves no practical purpose to find a view from the current content view and set it as the content view.

Categories

Resources