1.直接通過URL網址打開網頁顯示内容：loadUrl()
<?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"
tools:context="com.example.ygd.jreduch09.WebViewActivity">
<Button
android:id="@+id/bt"
android:layout_alignParentRight="true"
android:text="轉到"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<EditText
android:id="@+id/et"
android:layout_toLeftOf="@+id/bt"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<WebView
android:id="@+id/wv"
android:layout_below="@+id/et"
android:layout_width="match_parent"
android:layout_height="match_parent">
</WebView>
</RelativeLayout>
public class WebViewActivity extends AppCompatActivity {
private WebView wv;
private EditText et;
private Button bt;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_web_view);
wv= (WebView) findViewById(R.id.wv);
et= (EditText) findViewById(R.id.et);
bt= (Button) findViewById(R.id.bt);
bt.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
String url="http://"+et.getText().toString();
WebSettings settings=wv.getSettings(); //擷取WebSetting對象
settings.setJavaScriptEnabled(true); //設定是否支援JavaScript
settings.setSupportZoom(true); //設定是否支援縮放
settings.setDisplayZoomControls(true); //設定内置縮放控制
wv.setWebViewClient(new WebViewClient()); //使用WebViewClient作為用戶端
wv.loadUrl(url); //打開一個頁面
}
});
}
}
- 效果圖如下：
Android之WebView控件簡單使用總結
2.使用WebView加載Html代碼：loadDataWithBaseURL()
- 首先還是在布局中寫一個WebView的控件（同上）
- 然後将html代碼連成字元串，調用該方法
public class WebViewHtmlActivity extends AppCompatActivity {
private WebView wv;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_web_view_html);
wv= (WebView) findViewById(R.id.wv);
StringBuilder sbd=new StringBuilder(); //此處盡量使用StringBuilder
sbd.append("<html>");
sbd.append("<head><title>加載HTML</title></head>");
sbd.append("<body>");
sbd.append("<h1>大标題</h1>");
sbd.append("<ul>");
sbd.append("<li>無序清單ul标簽</li>");
sbd.append("</ul>");
sbd.append("<ol>");
sbd.append("<li>嵌套li标簽</li>");
sbd.append("</ol>");
sbd.append("</body>");
sbd.append("</html>");
wv.loadDataWithBaseURL(null,sbd.toString(),"text/html","utf-8",null);
}
}
- 效果如下：
Android之WebView控件簡單使用總結
3.Android與JS互相調用（同時重寫WebChromeClient()來顯示加載進度）
- 寫好一個Html檔案放入項目的assets目錄中（沒有則在下圖位置建立）
Android之WebView控件簡單使用總結 - Html代碼如下：
<html>
<head>
<title>我的第一個網頁</title>
<script>
function test(){
var a=;
var b='星期';
alert(b+a);
}
</script>
<body>
<h1>大标題</h1>
<ul>
<li>你好</li>
<li>世界</li>
<li>哈哈</li>
</ul>
<input type="button" onclick="test()" value="點選我">
</body>
</head>
</html>
public class LoadHtmlActivity extends AppCompatActivity {
private WebView wv;
private Button bt1,bt2;
private ProgressBar progressBar;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_load_html);
wv= (WebView) findViewById(R.id.wv);
bt1= (Button) findViewById(R.id.bt1);
bt2= (Button) findViewById(R.id.bt2);
progressBar= (ProgressBar) findViewById(R.id.pb);
WebSettings settings=wv.getSettings();
settings.setJavaScriptEnabled(true);
wv.setWebChromeClient(new MyClient());
wv.setWebViewClient(new WebViewClient());
wv.loadUrl("file:///android_asset/1.html"); //asset不用加s
// wv.loadUrl("http://www.baidu.com");
bt1.setOnClickListener(new View.OnClickListener() { //通過布局的button來調用html中的方法
@Override
public void onClick(View v) {
wv.loadUrl("file:///android_asset/1.html");
wv.loadUrl("javaScript:test()");
}
});
bt2.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
progressBar.setVisibility(View.VISIBLE);
wv.loadUrl("http://www.baidu.com");
}
});
}
public class MyClient extends WebChromeClient{
@Override
public void onProgressChanged(WebView view, int newProgress) {
super.onProgressChanged(view, newProgress);
if(newProgress==){
progressBar.setVisibility(View.GONE);
}
}
}
}
