1.概述
首先,需要提出一個概念,那就是hybrid,主要意思就是native原生Android和h5混合開發(fā)。為什么要這樣做呢?大家可以想象一下針對于同一個活動,如果使用純native的開發(fā)方式,Android和iOS兩邊都要維護(hù)同一套界面甚至是邏輯,這樣開發(fā)和維護(hù)的成本會很大,而使用hybrid的開發(fā)方式的話,讓前端的同學(xué)去寫一套界面和邏輯,對于native端來說只要使用對應(yīng)的容器去展示就可以了(對于Android來說這個容器當(dāng)然就是WebView)。那為什么不所有的頁面都使用這種方式開發(fā)呢?因為使用h5來展示界面的話用戶體驗始終是不如native的,所以在這兩者之間我們需要一個權(quán)衡。
介紹完了何為hybrid,我們來思考下面幾個場景:
場景1:前端那邊的頁面有一個按鈕,點擊這個按鈕需要顯示一個native的組件(比如一個toast),或者點擊這個按鈕需要去在native端執(zhí)行一個耗時的任務(wù)。
場景2:還是前端頁面有一個按鈕,點擊這個按鈕的邏輯是:如果登錄了,則跳轉(zhuǎn)到相應(yīng)的界面,如果沒有登錄,則跳轉(zhuǎn)到登錄界面。而這個登錄界面是我們native維護(hù)的。
看完上面兩個場景,相信大家也發(fā)現(xiàn)了一個問題,hybrid這樣的開發(fā)方式有一個問題需要解決,那就是前端和本地的通信。
下面將會給大家介紹active原生Android和h5之間的通信方式。
2.如何使用WebView
使用WebView控件 與其他控件的使用方法相同 在layout中使用一個”WebView”標(biāo)簽
WebView不包括導(dǎo)航欄,地址欄等完整瀏覽器功能,只用于顯示一個網(wǎng)頁
在WebView中加載Web頁面,使用loadUrl()
注意在manifest文件中加入訪問互聯(lián)網(wǎng)的權(quán)限:
1. <uses-permission android:name="android.permission.INTERNET"/>
但是,在Android中點擊一個鏈接,默認(rèn)是調(diào)用手機(jī)上已經(jīng)安裝的瀏覽器程序來啟動,因此想要通過WebView代為處理這個動作 ,那么需要通過WebViewClient
當(dāng)然,我們也可以寫一個類繼承WebViewClient來對WebViewClient對象進(jìn)行擴(kuò)展
然后只需要將setWebViewClient的內(nèi)容進(jìn)行修改即可
另外出于用戶習(xí)慣上的考慮 需要將WebView表現(xiàn)得更像一個瀏覽器,也就是需要可以回退歷史記錄,因此需要覆蓋系統(tǒng)的回退鍵 goBack,goForward可向前向后瀏覽歷史頁面
例子1:WebViewClient的使用
布局代碼activity_main.xml:
1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 2. xmlns:tools="http://schemas.android.com/tools" 3. android:layout_width="match_parent" 4. android:layout_height="match_parent" 5. android:paddingBottom="@dimen/activity_vertical_margin" 6. android:paddingLeft="@dimen/activity_horizontal_margin" 7. android:paddingRight="@dimen/activity_horizontal_margin" 8. android:paddingTop="@dimen/activity_vertical_margin" 9. tools:context="com.example.hybirddemo.MainActivity" > 10. 11. <WebView 12. android:layout_width="match_parent" 13. android:layout_height="match_parent" 14. android:id="@+id/webView" /> 15. 16. </RelativeLayout>
-
1
-
2
-
3
-
4
-
5
-
6
-
7
-
8
-
9
-
10
-
11
-
12
-
13
-
14
-
15
-
16
-
17
-
1
-
2
-
3
-
4
-
5
-
6
-
7
-
8
-
9
-
10
-
11
-
12
-
13
-
14
-
15
-
16
-
17
MainActivity代碼:
public class MainActivity extends Activity { 2. 3. private WebView webView; 4. 5. @Override 6. protected void onCreate(Bundle savedInstanceState) { 7. super.onCreate(savedInstanceState); 8. setContentView(R.layout.activity_main); 9. 10. 11. webView = (WebView) findViewById(R.id.webView); 12. 13. 14. 15. webView.loadUrl("http://www.baidu.com"); 16. 17. webView.setWebViewClient(new WebViewClient() { 18. 19. @Override 20. public boolean shouldOverrideUrlLoading(WebView view, String url) { 21. view.loadUrl(url); 22. return true; 23. } 24. 25. @Override 26. public void onPageStarted(WebView view, String url, Bitmap favicon) { 27. 28. super.onPageStarted(view, url, favicon); 29. } 30. 31. @Override 32. public void onPageFinished(WebView view, String url) { 33. 34. } 35. 36. }); 37. 38. } 39. 40. @Override 41. 42. public boolean onKeyDown(int keyCode, KeyEvent event) { 43. if (keyCode == KeyEvent.KEYCODE_BACK && webView.canGoBack()) { 44. webView.goBack(); 45. return true; 46. } 47. 48. return super.onKeyDown(keyCode, event); 49. } 50. 51. }
-
1
-
2
-
3
-
4
-
5
-
6
-
7
-
8
-
9
-
10
-
11
-
12
-
13
-
14
-
15
-
16
-
17
-
18
-
19
-
20
-
21
-
22
-
23
-
24
-
25
-
26
-
27
-
28
-
29
-
30
-
31
-
32
-
33
-
34
-
35
-
36
-
37
-
38
-
39
-
40
-
41
-
42
-
43
-
44
-
45
-
46
-
47
-
48
-
49
-
50
-
51
-
52
-
53
-
1
-
2
-
3
-
4
-
5
-
6
-
7
-
8
-
9
-
10
-
11
-
12
-
13
-
14
-
15
-
16
-
17
-
18
-
19
-
20
-
21
-
22
-
23
-
24
-
25
-
26
-
27
-
28
-
29
-
30
-
31
-
32
-
33
-
34
-
35
-
36
-
37
-
38
-
39
-
40
-
41
-
42
-
43
-
44
-
45
-
46
-
47
-
48
-
49
-
50
-
51
-
52
-
53
3.JavaScript和java的相互調(diào)用
WebSetting用處非常大,通過WebSetting可以使用Android原生的JavascriptInterface來進(jìn)行js和Java的通信。
例子2:JavaScript和java的相互調(diào)用
首先我們寫一段html代碼:
1. <!DOCTYPE html> 2. <html> 3. <head> 4. <title>MyHtml.html</title> 5.
6. <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> 7. <meta http-equiv="description" content="this is my page"> 8. <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 9.
10. 11. <script type="text/javascript"> 12. function showToast(toast) { 13. javascript:control.showToast(toast); 14. } 15. function log(msg) { 16. consolse.log(msg); 17. } 18. </script> 19. </head> 20.
21. <body> 22. <input type="button" value="toast" onclick="showToast('hello world!')"> 23. </body> 24. </html>
-
1
-
2
-
3
-
4
-
5
-
6
-
7
-
8
-
9
-
10
-
11
-
12
-
13
-
14
-
15
-
16
-
17
-
18
-
19
-
20
-
21
-
22
-
23
-
24
-
25
-
1
-
2
-
3
-
4
-
5
-
6
-
7
-
8
-
9
-
10
-
11
-
12
-
13
-
14
-
15
-
16
-
17
-
18
-
19
-
20
-
21
-
22
-
23
-
24
-
25
這是一個很簡單的HTML5頁面,里面有一個button,點擊這個button就執(zhí)行js腳本中的showToast方法。
那么這個showToast方法做了什么呢?
可以看到control.showToast,這個是什么我們后面再說,下面看我們Android工程中的java代碼。
編寫布局文件activity_main.xml
布局的內(nèi)容很簡單,就是嵌套一個WebView控件
編寫MainActivity.java代碼
1. package com.example.hybirddemo; 2. 3. import android.annotation.SuppressLint; 4. import android.app.Activity; 5. import android.os.Bundle; 6. import android.util.Log; 7. import android.view.Menu; 8. import android.view.MenuItem; 9. import android.webkit.JavascriptInterface; 10. import android.webkit.WebSettings; 11. import android.webkit.WebView; 12. import android.widget.Toast; 13. 14. public class MainActivity extends Activity { 15. 16. private WebView webView; 17. 18. @Override 19. protected void onCreate(Bundle savedInstanceState) { 20. super.onCreate(savedInstanceState); 21. setContentView(R.layout.activity_main); 22. 23. webView = (WebView) findViewById(R.id.webView); 24. 25. WebSettings webSettings = webView.getSettings(); 26. 27. webSettings.setJavaScriptEnabled(true); 28. 29. webView.addJavascriptInterface(new JsInterface(), "control"); 30. 31. webView.loadUrl("file:///android_asset/MyHtml.html"); 32. 33. } 34. public class JsInterface{ 35. @JavascriptInterface 36. public void showToast(String toast) { 37. Toast.makeText(MainActivity.this,toast , Toast.LENGTH_SHORT).show(); 38. Log.d("html", "show toast success"); 39. } 40. public void log(final String msg) { 41. webView.post(new Runnable() { 42. 43. @Override 44. public void run() { 45. webView.loadUrl("javascript log("+"'"+msg+"'"+")"); 46. 47. } 48. }); 49. } 50. } 51. }
-
1
-
2
-
3
-
4
-
5
-
6
-
7
-
8
-
9
-
10
-
11
-
12
-
13
-
14
-
15
-
16
-
17
-
18
-
19
-
20
-
21
-
22
-
23
-
24
-
25
-
26
-
27
-
28
-
29
-
30
-
31
-
32
-
33
-
34
-
35
-
36
-
37
-
38
-
39
-
40
-
41
-
42
-
43
-
44
-
45
-
46
-
47
-
48
-
49
-
50
-
51
-
52
-
1
-
2
-
3
-
4
-
5
-
6
-
7
-
8
-
9
-
10
-
11
-
12
-
13
-
14
-
15
-
16
-
17
-
18
-
19
-
20
-
21
-
22
-
23
-
24
-
25
-
26
-
27
-
28
-
29
-
30
-
31
-
32
-
33
-
34
-
35
-
36
-
37
-
38
-
39
-
40
-
41
-
42
-
43
-
44
-
45
-
46
-
47
-
48
-
49
-
50
-
51
-
52
上面的代碼主要做了以下的步驟:
a) 獲取webview控件
b) 獲取webview的設(shè)置,將JavaScript設(shè)置為可用,打開JavaScript的通道
c) 在Android程序中建立接口 ,并編寫相關(guān)邏輯
再去看之前js腳本中的那個showToast()方法
這里的control就是我們的那個interface,調(diào)用了interface的showToast方法,很明顯這里是js調(diào)用了Android的代碼,輸出了一個Toast
可以看到這個interface我們給它取名叫control,后通過loadUrl加載頁面。
可以看到先顯示一個toast,然后調(diào)用log()方法,log()方法里調(diào)用了js腳本的log()方法, js的log()方法做的事就是在控制臺輸出msg,這里明顯是Android調(diào)用了js的方法。
d) 給webview添加我們自己編寫的JavaScript接口
通過WebView的addJavascriptInterface方法去注入一個我們自己寫的interface。
e) 使用webview控件加載我們之前編寫的html文件
在真實手機(jī)上運行程序,在控制臺成功輸出內(nèi)容:
這樣我們就完成了js和java的互調(diào),是不是很簡單。
4.Android中處理JS的警告,對話框等
在Android中處理JS的警告,對話框等需要對WebView設(shè)置WebChromeClient對象,并復(fù)寫其中的onJsAlert,onJsConfirm,onJsPrompt方法可以處理javascript的常用對話框
例子3:在Android中處理javascript的對話框
1) 編寫html頁面布局
1. <%@LANGUAGE="JAVASCRIPT" CODEPAGE="936"%> 2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 3. <html xmlns="http://www.w3.org/1999/xhtml"> 4. <head> 5. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8 " /> 6. <title>分別測試javascript的三種對話框</title> 7. <script language="javascript"> 8. function ale() 9. { 10. alert("這是一個警告對話框!"); 11. } 12. function firm() 13. { 14. if(confirm("更多信息請到我的博客去?")) 15. { 16. location.href="http://yarin.javaeye.com"; 17. } 18. else 19. { 20. alert("你選擇了不去!"); 21. } 22. } 23. function prom() 24. { 25. var str=prompt("演示一個帶輸入的對話框","這里輸入你的信息"); 26. if(str) 27. { 28. alert("謝謝使用,你輸入的是:"+ str) 29. } 30. } 31. </script> 32. </head> 33. <body> 34. <p>下面我們演示3種對話框</p> 35. <p>警告、提醒對話框</p> 36. <p> 37. <input type="submit" name="Submit" value="提交" onclick="ale()" /> 38. </p> 39. <p>帶選擇的對話框</p> 40. <p> 41. <input type="submit" name="Submit2" value="提交" onclick="firm()" /> 42. </p> 43. <p>要求用戶輸入的對話框</p> 44. <p> 45. <input type="submit" name="Submit3" value="提交" onclick="prom()" /> 46. </p> 47. </body> 48. </html>
-
1
-
2
-
3
-
4
-
5
-
6
-
7
-
8
-
9
-
10
-
11
-
12
-
13
-
14
-
15
-
16
-
17
-
18
-
19
-
20
-
21
-
22
-
23
-
24
-
25
-
26
-
27
-
28
-
29
-
30
-
31
-
32
-
33
-
34
-
35
-
36
-
37
-
38
-
39
-
40
-
41
-
42
-
43
-
44
-
45
-
46
-
47
-
48
-
49
-
1
-
2
-
3
-
4
-
5
-
6
-
7
-
8
-
9
-
10
-
11
-
12
-
13
-
14
-
15
-
16
-
17
-
18
-
19
-
20
-
21
-
22
-
23
-
24
-
25
-
26
-
27
-
28
-
29
-
30
-
31
-
32
-
33
-
34
-
35
-
36
-
37
-
38
-
39
-
40
-
41
-
42
-
43
-
44
-
45
-
46
-
47
-
48
-
49
頁面效果:
2) Android中布局的編寫
1. <?xml version="1.0" encoding="utf-8"?> 2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 3. android:orientation="vertical" 4. android:layout_width="fill_parent" 5. android:layout_height="fill_parent" 6. > 7. <LinearLayout 8. android:orientation="horizontal" 9. android:layout_width="fill_parent" 10. android:layout_height="fill_parent" 11. android:animationCache="true" 12. android:layout_weight="9"> 13. <EditText 14. android:id="@+id/EditText01" 15. android:layout_width="wrap_content" 16. android:layout_weight="9" 17. android:layout_height="wrap_content" 18. android:text="請輸入網(wǎng)址"/> 19. <Button android:id="@+id/Button01" 20. android:layout_width="wrap_content" 21. android:layout_weight="1" 22. android:layout_height="wrap_content" 23. android:text="連接" /> 24. </LinearLayout> 25. <WebView 26. android:id="@+id/WebView01" 27. android:layout_width="fill_parent" 28. android:layout_height="fill_parent" 29. android:layout_weight="1" 30. /> 31. </LinearLayout>
-
1
-
2
-
3
-
4
-
5
-
6
-
7
-
8
-
9
-
10
-
11
-
12
-
13
-
14
-
15
-
16
-
17
-
18
-
19
-
20
-
21
-
22
-
23
-
24
-
25
-
26
-
27
-
28
-
29
-
30
-
31
-
32
-
1
-
2
-
3
-
4
-
5
-
6
-
7
-
8
-
9
-
10
-
11
-
12
-
13
-
14
-
15
-
16
-
17
-
18
-
19
-
20
-
21
-
22
-
23
-
24
-
25
-
26
-
27
-
28
-
29
-
30
-
31
-
32
3) 編寫自定義對話框的布局
新建prom_dialog.xml文件,在其中自定義一個帶輸入的對話框由TextView和EditText構(gòu)成
1. <?xml version="1.0" encoding="utf-8"?> 2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 3. android:gravity="center_horizontal" 4. android:orientation="vertical" 5. android:layout_width="fill_parent" 6. android:layout_height="wrap_content" 7. > 8. <TextView 9. android:id="@+id/TextView_PROM" 10. android:layout_width="fill_parent" 11. android:layout_height="wrap_content"/> 12. <EditText 13. android:id="@+id/EditText_PROM" 14. android:layout_width="fill_parent" 15. android:layout_height="wrap_content" 16. android:selectAllOnFocus="true" 17. android:scrollHorizontally="true"/> 18. </LinearLayout>
-
1
-
2
-
3
-
4
-
5
-
6
-
7
-
8
-
9
-
10
-
11
-
12
-
13
-
14
-
15
-
16
-
17
-
18
-
19
-
1
-
2
-
3
-
4
-
5
-
6
-
7
-
8
-
9
-
10
-
11
-
12
-
13
-
14
-
15
-
16
-
17
-
18
-
19
4) 獲取WebView控件,并進(jìn)行相關(guān)的設(shè)置
5) 復(fù)寫onKeyDown方法,當(dāng)用戶按返回鍵時,返回上一個加載的頁面
6) 給WebView設(shè)置setWebChromeClient,并復(fù)寫其中的方法
1. // 設(shè)置WebChromeClient 2. mWebView.setWebChromeClient(new WebChromeClient() { 3. 4. @Override 5. // 處理javascript中的alert 6. public boolean onJsAlert(WebView view, String url, String message, 7. final JsResult result) { 8. // 構(gòu)建一個Builder來顯示網(wǎng)頁中的對話框 9. Builder builder = new Builder(MainActivity.this); 10. builder.setTitle("提示對話框"); 11. builder.setMessage(message); 12. builder.setPositiveButton(android.R.string.ok, 13. new AlertDialog.OnClickListener() { 14. 15. @Override 16. public void onClick(DialogInterface dialog, 17. int which) { 18. // TODO Auto-generated method stub 19. // 點擊確定按鈕之后,繼續(xù)執(zhí)行網(wǎng)頁中的操作 20. result.confirm(); 21. } 22. }); 23. builder.setNegativeButton(android.R.string.cancel, 24. new OnClickListener() { 25. 26. @Override 27. public void onClick(DialogInterface dialog, 28. int which) { 29. result.cancel(); 30. 31. } 32. }); 33. builder.setCancelable(false); 34. builder.create(); 35. builder.show(); 36. 37. return true; 38. 39. } 40. 41. @Override 42. //處理javascript中的confirm 43. public boolean onJsConfirm(WebView view, String url, 44. String message, final JsResult result) { 45. Builder builder = new Builder(MainActivity.this); 46. builder.setTitle("帶選擇的對話框"); 47. builder.setMessage(message); 48. builder.setPositiveButton(android.R.string.ok, 49. new AlertDialog.OnClickListener() { 50. public void onClick(DialogInterface dialog, int which) { 51. result.confirm(); 52. } 53. }); 54. builder.setNegativeButton(android.R.string.cancel, 55. new DialogInterface.OnClickListener() { 56. public void onClick(DialogInterface dialog, int which) { 57. result.cancel(); 58. } 59. }); 60. builder.setCancelable(false); 61. builder.create(); 62. builder.show(); 63. return true; 64. } 65. 66. @Override 67. // 處理javascript中的prompt 68. // message為網(wǎng)頁中對話框的提示內(nèi)容 69. // defaultValue在沒有輸入時,默認(rèn)顯示的內(nèi)容 70. public boolean onJsPrompt(WebView view, String url, String message, 71. String defaultValue, final JsPromptResult result) { 72. // 自定義一個帶輸入的對話框由TextView和EditText構(gòu)成 73. LayoutInflater layoutInflater = LayoutInflater 74. .from(MainActivity.this); 75. final View dialogView = layoutInflater.inflate( 76. R.layout.prom_dialog, null); 77. 78. // 設(shè)置TextView對應(yīng)網(wǎng)頁中的提示信息 79. ((TextView) dialogView.findViewById(R.id.TextView_PROM)) 80. .setText(message); 81. // 設(shè)置EditText對應(yīng)網(wǎng)頁中的輸入框 82. ((EditText) dialogView.findViewById(R.id.EditText_PROM)) 83. .setText(defaultValue); 84. //構(gòu)建一個Builder來顯示網(wǎng)頁中的對話框 85. Builder builder = new Builder(MainActivity.this); 86. //設(shè)置彈出框標(biāo)題 87. builder.setTitle("帶輸入的對話框"); 88. //設(shè)置彈出框的布局 89. builder.setView(dialogView); 90. //設(shè)置按鍵的監(jiān)聽 91. builder.setPositiveButton(android.R.string.ok, 92. new AlertDialog.OnClickListener() { 93. 94. @Override 95. public void onClick(DialogInterface dialog, 96. int which) { 97. 98. // 點擊確定之后,取得輸入的值,傳給網(wǎng)頁處理 99. String value = ((EditText) dialogView 100. .findViewById(R.id.EditText_PROM)) 101. .getText().toString(); 102. result.confirm(value); 103. } 104. 105. }); 106. 107. builder.setNegativeButton(android.R.string.cancel, 108. new OnClickListener() { 109. 110. @Override 111. public void onClick(DialogInterface dialog, 112. int which) { 113. // TODO Auto-generated method stub 114. result.cancel(); 115. } 116. }); 117. 118. builder.setOnCancelListener(new DialogInterface.OnCancelListener() { 119. public void onCancel(DialogInterface dialog) { 120. result.cancel(); 121. } 122. }); 123. builder.show(); 124. return true; 125. } 126. 127. @Override 128. //設(shè)置網(wǎng)頁加載的進(jìn)度條 129. public void onProgressChanged(WebView view, int newProgress) { 130. MainActivity.this.getWindow().setFeatureInt(Window.FEATURE_PROGRESS, newProgress *100); 131. super.onProgressChanged(view, newProgress); 132. } 133. 134. @Override 135. public void onReceivedTitle(WebView view, String title) { 136. MainActivity.this.setTitle(title); 137. super.onReceivedTitle(view, title); 138. } 139. 140. }); 141. mButton.setOnClickListener(new View.OnClickListener() { 142. 143. @Override 144. public void onClick(View v) { 145. //取得編輯框中我們輸入的內(nèi)容 146. String url = mEditText.getText().toString().trim(); 147. //判斷輸入的內(nèi)容是不是網(wǎng)址 148. if(URLUtil.isNetworkUrl(url)){ 149. //裝載網(wǎng)址 150. mWebView.loadUrl(url); 151. }else{ 152. mEditText.setText("輸入網(wǎng)址錯誤,請重新輸入"); 153. } 154. } 155. }); 156. 157. }
-
1
-
2
-
3
-
4
-
5
-
6
-
7
-
8
-
9
-
10
-
11
-
12
-
13
-
14
-
15
-
16
-
17
-
18
-
19
-
20
-
21
-
22
-
23
-
24
-
25
-
26
-
27
-
28
-
29
-
30
-
31
-
32
-
33
-
34
-
35
-
36
-
37
-
38
-
39
-
40
-
41
-
42
-
43
-
44
-
45
-
46
-
47
-
48
-
49
-
50
-
51
-
52
-
53
-
54
-
55
-
56
-
57
-
58
-
59
-
60
-
61
-
62
-
63
-
64
-
65
-
66
-
67
-
68
-
69
-
70
-
71
-
72
-
73
-
74
-
75
-
76
-
77
-
78
-
79
-
80
-
81
-
82
-
83
-
84
-
85
-
86
-
87
-
88
-
89
-
90
-
91
-
92
-
93
-
94
-
95
-
96
-
97
-
98
-
99
-
100
-
101
-
102
-
103
-
104
-
105
-
106
-
107
-
108
-
109
-
110
-
111
-
112
-
113
-
114
-
115
-
116
-
117
-
118
-
119
-
120
-
121
-
122
-
123
-
124
-
125
-
126
-
127
-
128
-
129
-
130
-
131
-
132
-
133
-
134
-
135
-
136
-
137
-
138
-
139
-
140
-
141
-
142
-
143
-
144
-
145
-
146
-
147
-
148
-
149
-
150
-
151
-
152
-
153
-
154
-
155
-
156
-
157
-
158
-
1
-
2
-
3
-
4
-
5
-
6
-
7
-
8
-
9
-
10
-
11
-
12
-
13
-
14
-
15
-
16
-
17
-
18
-
19
-
20
-
21
-
22
-
23
-
24
-
25
-
26
-
27
-
28
-
29
-
30
-
31
-
32
-
33
-
34
-
35
-
36
-
37
-
38
-
39
-
40
-
41
-
42
-
43
-
44
-
45
-
46
-
47
-
48
-
49
-
50
-
51
-
52
-
53
-
54
-
55
-
56
-
57
-
58
-
59
-
60
-
61
-
62
-
63
-
64
-
65
-
66
-
67
-
68
-
69
-
70
-
71
-
72
-
73
-
74
-
75
-
76
-
77
-
78
-
79
-
80
-
81
-
82
-
83
-
84
-
85
-
86
-
87
-
88
-
89
-
90
-
91
-
92
-
93
-
94
-
95
-
96
-
97
-
98
-
99
-
100
-
101
-
102
-
103
-
104
-
105
-
106
-
107
-
108
-
109
-
110
-
111
-
112
-
113
-
114
-
115
-
116
-
117
-
118
-
119
-
120
-
121
-
122
-
123
-
124
-
125
-
126
-
127
-
128
-
129
-
130
-
131
-
132
-
133
-
134
-
135
-
136
-
137
-
138
-
139
-
140
-
141
-
142
-
143
-
144
-
145
-
146
-
147
-
148
-
149
-
150
-
151
-
152
-
153
-
154
-
155
-
156
-
157
-
158
圖1 dialog.html頁面
圖2 javascript的警告對話框
圖3 javascript的confirm對話框
圖4 javascript的prompt對話框
總結(jié):在這個項目中,使用setWebChromeClient方法來為WebView設(shè)置一個WebChromeClient對象,來輔助WebView來處理Javascript的對話框等,圖4是我們自定義的對話框,圖2和圖3我們都只需要監(jiān)聽按鈕的點擊事件,然后通過confirm和cancel方法將我們的操作傳遞給Javascript進(jìn)行處理。當(dāng)你在圖1的界面,點擊個按鈕時,會打開圖2的對話框,點擊第二個按鈕時,會打開圖3的對話框,同時在這里點擊確定,會跳轉(zhuǎn)到另一個頁面,當(dāng)點擊第三個按鈕時,會打開圖4對話框,并且可以輸入內(nèi)容。
本站文章版權(quán)歸原作者及原出處所有 。內(nèi)容為作者個人觀點, 并不代表本站贊同其觀點和對其真實性負(fù)責(zé),本站只提供參考并不構(gòu)成任何投資及應(yīng)用建議。本站是一個個人學(xué)習(xí)交流的平臺,網(wǎng)站上部分文章為轉(zhuǎn)載,并不用于任何商業(yè)目的,我們已經(jīng)盡可能的對作者和來源進(jìn)行了通告,但是能力有限或疏忽,造成漏登,請及時聯(lián)系我們,我們將根據(jù)著作權(quán)人的要求,立即更正或者刪除有關(guān)內(nèi)容。本站擁有對此聲明的最終解釋權(quán)。