We Keep Coding

How to remove the header in Android WebView? (While Loading)

I want to remove the header of the website in android 'WebView'. With the Code that I have, it works. But the problem is that the 'WebView' is removing the header after the page loaded completely. I want to remove it, while it is loading.
Thats the code snippet:
webView.setWebViewClient(new WebViewClient() {
#Override
public void onPageFinished(WebView view, String url)
{
webView.loadUrl("javascript:(function() { " +
"var head = document.getElementsByTagName('header')[0];"
+ "head.parentNode.removeChild(head);" +
"})()");
webView.loadUrl("javascript:(function() { " +
"var head = document.getElementsByTagName('footer')[0];"
+ "head.parentNode.removeChild(head);" +
"})()");
}
});

ANDROID WebView-Remove header or any tag from Webpage in Android
Let's understand how's it possible, in my case I had loaded url in webview and look like below screenshot,
Now from the above view if we want to remove the header and menu
portion of the Webpage. We need to use JSOUP lib with the help of
which you can remove the unnecessary portion of webpage.
STEPS
Add jsoup lib in your app level build gradle
compile 'org.jsoup:jsoup:1.10.3'
Now In activity we will use Async task as we parse / remove some html tags that leads to network operations which cannot be done directly on UI Thread. Async Task allows you to perform background operations and publish results on the UI thread. It has three methods commonly used.
onPreExecute():-Is used to display progress bar
doInBackground():-This step is used to perform background computation that can take a long time. You cannot update any UI in this method.
onPostExecute():-This is invoked after completion of background task and it will update the UI.
I have defined WebView in xml like following way,
<WebView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/webview"/>
And in MainActivity.java, I had wrote JSOUP code for remove the unnecessary portion of webpage
public class MainActivity extends AppCompatActivity {
WebView webview;
String url="http://pixelay.com/";
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
webview= (WebView) findViewById(R.id.webview);
new MyAsynTask().execute();
}
private class MyAsynTask extends AsyncTask<Void, Void, Document> {
#Override
protected Document doInBackground(Void... voids) {
Document document = null;
try {
document= Jsoup.connect(url).get();
document.getElementsByClass("main-navigation").remove();
document.getElementsByClass("custom-header-image").remove();
} catch (IOException e) {
e.printStackTrace();
}
return document;
}
#Override
protected void onPostExecute(Document document) {
super.onPostExecute(document);
webview.loadDataWithBaseURL(url,document.toString(),"text/html","utf-8","");
webview.getSettings().setCacheMode( WebSettings.LOAD_CACHE_ELSE_NETWORK );
webview.setWebViewClient(new WebViewClient(){
#Override
public boolean shouldOverrideUrlLoading(WebView view, WebResourceRequest request) {
view.loadUrl(url);
return super.shouldOverrideUrlLoading(view, request);
}
});
}
}
}
Now, it's time to see the result,

Easiest way is to inject Javascript in onLoadResource() method. Put it inside try-catch block since WebView will not know about the element before it has been loaded:
webView.setWebChromeClient(new WebChromeClient() {
...
#Override
public void onLoadResource(WebView view, String url) {
try {
webView.loadUrl("javascript:(window.onload = function() { " +
"(elem1 = document.getElementById('id1')); elem.parentNode.removeChild(elem1); " +
"(elem2 = document.getElementById('id2')); elem2.parentNode.removeChild(elem2); " +
"})()");
} catch (Exception e) {
e.printStackTrace();
}
}
}

public class YourwebView extends WebViewClient {
#Override
public boolean shouldOverrideUrlLoading(WebView view, WebResourceRequest request) {
view.loadUrl(request.getUrl());
return true;
}
#Override
public void onPageFinished(WebView view, String url) {
view.loadUrl("javascript:var footer = document.getElementById(\"footer\"); footer.parentNode.removeChild(footer); var header = document.getElementById(\"header-full\"); header.parentNode.removeChild(header);");
}
}
And also make sure you have enabled javscript
YourwebView myWebClient = new YourwebView();
webview.setWebViewClient(myWebClient);
WebSettings webSettings = webview.getSettings();
webSettings.setJavaScriptEnabled(true);

Use onPageStarted method instead of onPageFinished.
From the Android Docs here
EDIT: Reading the comments on other answers, I see you want the header to show again. Simply implement both onPageStarted and onPageEnded, hiding the header in one and showing it again in the other.

Android webview fullscreen video

I working on host a website that include videos , when I run the video and click to fullscreen player button the white color fill all screen but the video sound still playing
MainActivity.class
mWebview = (WebView) findViewById(R.id.web);
mWebview.setWebViewClient(new MyWebViewClient());
mWebview.getSettings().setJavaScriptEnabled(true); // enable javascript
mWebview.getSettings().setDomStorageEnabled(true);
mWebview.loadUrl("http://www.my-site.com/");
mWebview.setWebChromeClient(new WebChromeClient() {
public void onShowCustomView (View view, WebChromeClient.CustomViewCallback callback) {
//do stuff
}
public void onHideCustomView () {
//do stuff
}
});
MyWebViewClient.class
public class MyWebViewClient extends WebViewClient {
public boolean shuldOverrideKeyEvent(WebView view, KeyEvent event) {
return true;
}
public boolean shouldOverrideUrlLoading(WebView view, String url) {
try {
String s = Uri.parse(url).getHost();
if((s.contains("rulanerder"))|| (s.contains("disqus"))){
view.stopLoading();
view.goBack();
return true; }
}
// reject anything other
} catch (Exception e) {
Log.d("Error", "shouldOverrideUrlLoading");
}
return false;
}
}
how can fixed that ?

JavascriptInterface function crashing javascript on web page

I have a webview in my android app. I want to show a banner only if the web page is viewed on browser. I created an interface and it tests fine but because the web page doesn't recognize the function the other javascript on the page doesn't load. Here is my Code:
Interface Class
import android.content.Context;
import android.webkit.JavascriptInterface;
public class WebAppInterface {
Context mContext;
/** Instantiate the interface and set the context */
WebAppInterface(Context c) {
mContext = c;
}
/** Show a toast from the web page */
#JavascriptInterface
public Boolean getUser() {
return true;
}
}
Activity Class
public class MainActivity extends Activity {
ProgressBar progressBar;
WebView webview;
/** Called when the activity is first created. */
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
webview = (WebView)findViewById(R.id.webview);
progressBar = (ProgressBar)findViewById(R.id.progressBar);
webview.addJavascriptInterface(new WebAppInterface(this),"Android");
this.webview.getSettings().setUserAgentString(
this.webview.getSettings().getUserAgentString()
+ " "
+ getString(R.string.user_agent_suffix)
);
WebSettings settings = webview.getSettings();
settings.setJavaScriptEnabled(true);
webview.setWebChromeClient(new WebChromeClient() {
public void onProgressChanged(WebView view, int progress) {
progressBar.setProgress(progress);
if (progress == 100) {
progressBar.setVisibility(View.GONE);
} else {
progressBar.setVisibility(View.VISIBLE);
}
}
});
webview.setWebViewClient(new WebViewClient() {
public boolean shouldOverrideUrlLoading(WebView view, String url) {
view.loadUrl(url);
return true;
}
});
webview.loadUrl("http://www.getonfleek.com");
ParsePush.subscribeInBackground("test");
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.menu_main, menu);
return true;
}
#Override
public boolean onOptionsItemSelected(MenuItem item) {
// Handle action bar item clicks here. The action bar will
// automatically handle clicks on the Home/Up button, so long
// as you specify a parent activity in AndroidManifest.xml.
int id = item.getItemId();
//noinspection SimplifiableIfStatement
if (id == R.id.action_settings) {
return true;
}
return super.onOptionsItemSelected(item);
}
#Override
public void onBackPressed() {
if (webview.canGoBack()) {
webview.goBack();
} else {
super.onBackPressed();
}
}
}
HTML
</script>
<script type="text/javascript">
$(document).ready(function(){
var user = Android.getUser();
if(user == null){
//do something on web
}else{
//do something in app
}
});
</script>

Check to make sure the interface exists before trying to call it.
<script type="text/javascript">
$(document).ready(function(){
var user = null;
if(typeof Android !== 'undefined'){
user = Android.getUser();
//do something in app
}else{
//do something on web
}
});
</script>

onPreExecute as preloader for webview in a fragment

I am trying to show a preloader before loading the complete page as webview but here is a small problem which I already made a preloader but it goes on and on and there is no end to it .
How can I tell the script to stop showing dialog when the page is loaded .
public class EzFragment extends Fragment {
public ProgressDialog pDialog;
public EzFragment(){}
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
new getFeed().execute();
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.fragment_ez, container, false);
WebView myWebView = (WebView) rootView.findViewById(R.id.webView1);
String summary = "<html><head> <link rel=\"stylesheet\" type=\"text/css\"
href=\"http://www.example.com/demo/android_connect/assets/style/jquery.fullPage.css\" /></head></html>";
myWebView.loadData(summary, "text/html", null);
myWebView.loadUrl("http://www.example.com/demo/android_connect/get_ez_webmob.php");
WebSettings webSettings = myWebView.getSettings();
webSettings.setJavaScriptEnabled(true);
return rootView;
}
private class getFeed extends AsyncTask<Void, Void, Document> {
#Override
protected void onPreExecute() {
super.onPreExecute();
pDialog = new ProgressDialog(getActivity());
pDialog.setTitle("Connect to Server");
pDialog.setMessage("This process can take a few seconds to a few minutes, depending on your Internet Connection Speed.");
pDialog.setIndeterminate(false);
pDialog.setCancelable(false);
pDialog.show();
}
#Override
protected Document doInBackground(Void... arg0) {
// TODO Auto-generated method stub
return null;
}
}
Is it possible to add webview to Document doInBackground in order to load the page in background ?!

How can I tell the script to stop showing dialog when the page is
loaded .
Use onPageFinished to dismiss ProgressDialog because onPageFinished method is called when page is fully loaded in WebView :
myWebView.setWebViewClient(new WebViewClient(){
//.....
#Override
public void onPageFinished(WebView view, String url) {
Log.d("mytag","Page Loading Finished!");
super.onPageFinished(myWebView, url);
// dismiss ProgressDialog here
}
});

#Override
protected void onPostExecute(String result) {
super.onPostExecute(result);
if (pDialog.isShowing()) {
pDialog.dismiss();
}
}
Stop the dialog in postexecute..

JavaScript doesn't work in Android WebView

I want to load a url by webView.
The url is http://wapp.baidu.com/f?kw=%BB%F0%BC%FD ,this page can work correctly on system default browser, but in my webView, some JavaScript not working.
JavaScript is enabled, and I dont know what's wrong with it.
I would appreciate any help.
private void initUI() {
webView = (WebView) findViewById(R.id.web_view);
webView.getSettings().setJavaScriptEnabled(true);
final NavigationBar navigationBar = (NavigationBar) findViewById(R.id.navigationbar);
navigationBar.refreshUI();
navigationBar.rightButton.setImageResource(R.drawable.refresh);
navigationBar.rightButton.setVisibility(View.VISIBLE);
navigationBar.rightButton.setOnClickListener(new OnClickListener() {
public void onClick(View v) {
refresh();
}
});
navigationBar.leftButton.setImageResource(R.drawable.back);
navigationBar.leftButton.setOnClickListener(new OnClickListener() {
public void onClick(View arg0) {
webView.goBack();
}
});
webView.setWebViewClient(new WebViewClient() {
public boolean shouldOverrideUrlLoading(WebView view, String url) {
view.loadUrl(url);
return true;
}
public void onPageFinished(WebView view, String url) {
navigationBar.leftButton.setVisibility(webView.canGoBack() ? View.VISIBLE
: View.INVISIBLE);
super.onPageFinished(view, url);
}
});
refresh();
}
update: the problem is solved
just add following code:
webView.getSettings().setDomStorageEnabled(true);

If you're using proguard, it stops javascript running. For instance, in my proguard-project.txt file I have the following:
if your project uses WebView with JS, uncomment the following
# and specify the fully qualified class name to the JavaScript interface
# class:
#-keepclassmembers class fqcn.of.javascript.interface.for.webview {
# public *;
#}

I think there is some issue with javascript file caching/refreshing. I changed the filename of js & it starts working fine.