example - javascript webview android
Inyectar CSS en un sitio con webview en Android (1)
No puede inyectar CSS directamente; sin embargo, puede usar Javascript para manipular la página dom.
public class MainActivity extends ActionBarActivity {
WebView webView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
webView = new WebView(this);
setContentView(webView);
// Enable Javascript
webView.getSettings().setJavaScriptEnabled(true);
// Add a WebViewClient
webView.setWebViewClient(new WebViewClient() {
@Override
public void onPageFinished(WebView view, String url) {
// Inject CSS when page is done loading
injectCSS();
super.onPageFinished(view, url);
}
});
// Load a webpage
webView.loadUrl("https://www.google.com");
}
// Inject CSS method: read style.css from assets folder
// Append stylesheet to document head
private void injectCSS() {
try {
InputStream inputStream = getAssets().open("style.css");
byte[] buffer = new byte[inputStream.available()];
inputStream.read(buffer);
inputStream.close();
String encoded = Base64.encodeToString(buffer, Base64.NO_WRAP);
webView.loadUrl("javascript:(function() {" +
"var parent = document.getElementsByTagName(''head'').item(0);" +
"var style = document.createElement(''style'');" +
"style.type = ''text/css'';" +
// Tell the browser to BASE64-decode the string into your script !!!
"style.innerHTML = window.atob(''" + encoded + "'');" +
"parent.appendChild(style)" +
"})()");
} catch (Exception e) {
e.printStackTrace();
}
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.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();
if (id == R.id.action_settings) {
return true;
}
return super.onOptionsItemSelected(item);
}
}
Por ejemplo, quiero cambiar el color de fondo de www.google.com
a red
. He utilizado la vista webview
, y mi archivo style.css
está en la assest folder
. Quiero style.css
este archivo style.css
en www.google.com
. ¿Qué pasa con mis códigos? Por favor escribe los códigos correctos para mí. Gracias. Mi archivo MainActitviy.java
:
package com.example.mysina;
import android.support.v7.app.ActionBarActivity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.webkit.WebView;
public class MainActivity extends ActionBarActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
WebView webView = new WebView(this);
setContentView(webView);
String html = "<html><head><style> src: url(''file:///android_asset/style.css'')</style></head></html>";
webView.loadData(html, "text/html", "utf-8");
webView.loadUrl("https://www.google.com");
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.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();
if (id == R.id.action_settings) {
return true;
}
return super.onOptionsItemSelected(item);
}
}