[转]Android使用WebView从相册/拍照中添加图片

原地址：http://blog.csdn.net/djcken/article/details/46379929

解决这个问题花了很长时间搜索了解，网上大部分使用openFileChooser但都没解决一个存在的问题。就是当弹出选择图片/相机框之后，取消选择，就再也不能点击选择按钮了。这篇文章是为了记录这一点，为验证整个流程部署了后端，但是由于很久没接触后端，后端代码是网上的列子，所以后端代码和部署就不说了。单纯的说下Android端的解决方案。

自定义两个文件：

[java] view plaincopy

1. /**
2. * 自定义
3. *
4. * @Author KenChung
5. */
6. public class ReWebViewClient extends WebViewClient {
7. @Override
8. public void onPageStarted(WebView view, String url, Bitmap favicon) {
9. super.onPageStarted(view, url, favicon);
10. }
11. @Override
12. public void onPageFinished(WebView view, String url) {
13. super.onPageFinished(view, url);
14. }
15. }

[java] view plaincopy

1. /**
2. * ReWebChomeClient
3. *
4. * @Author KenChung
5. */
6. public class ReWebChomeClient extends WebChromeClient {
7. private OpenFileChooserCallBack mOpenFileChooserCallBack;
8. public ReWebChomeClient(OpenFileChooserCallBack openFileChooserCallBack) {
9. mOpenFileChooserCallBack = openFileChooserCallBack;
10. }
11. //For Android 3.0+
12. public void openFileChooser(ValueCallback<Uri> uploadMsg, String acceptType) {
13. mOpenFileChooserCallBack.openFileChooserCallBack(uploadMsg, acceptType);
14. }
15. // For Android < 3.0
16. public void openFileChooser(ValueCallback<Uri> uploadMsg) {
17. openFileChooser(uploadMsg, "");
18. }
19. // For Android  > 4.1.1
20. public void openFileChooser(ValueCallback<Uri> uploadMsg, String acceptType, String capture) {
21. openFileChooser(uploadMsg, acceptType);
22. }
23. public interface OpenFileChooserCallBack {
24. void openFileChooserCallBack(ValueCallback<Uri> uploadMsg, String acceptType);
25. }
26. }

选择图片弹框使用AlertDialog：

[java] view plaincopy

1. public void showOptions() {
2. AlertDialog.Builder alertDialog = new AlertDialog.Builder(this);
3. alertDialog.setOnCancelListener(new ReOnCancelListener());
4. alertDialog.setTitle(R.string.options);
5. alertDialog.setItems(R.array.options, new DialogInterface.OnClickListener() {
6. @Override
7. public void onClick(DialogInterface dialog, int which) {
8. if (which == 0) {
9. mSourceIntent = ImageUtil.choosePicture();
10. startActivityForResult(mSourceIntent, REQUEST_CODE_PICK_IMAGE);
11. } else {
12. mSourceIntent = ImageUtil.takeBigPicture();
13. startActivityForResult(mSourceIntent, REQUEST_CODE_IMAGE_CAPTURE);
14. }
15. }
16. }
17. );
18. alertDialog.show();
19. }

关键代码：（这里的意思是取消弹框之后要告诉WebView不要再等待返回结果，设置为空就等于重置了状态）

[java] view plaincopy

1. private class ReOnCancelListener implements DialogInterface.OnCancelListener {
2. @Override
3. public void onCancel(DialogInterface dialogInterface) {
4. if (mUploadMsg != null) {
5. mUploadMsg.onReceiveValue(null);
6. mUploadMsg = null;
7. }
8. }
9. }

完整MainActivity：

[java] view plaincopy

1. /**
2. * WebViewUpload
3. *
4. * @Author KenChung
5. */
6. public class MyActivity extends Activity implements ReWebChomeClient.OpenFileChooserCallBack {
7. private static final String TAG = "MyActivity";
8. private static final int REQUEST_CODE_PICK_IMAGE = 0;
9. private static final int REQUEST_CODE_IMAGE_CAPTURE = 1;
10. private WebView mWebView;
11. private Intent mSourceIntent;
12. private ValueCallback<Uri> mUploadMsg;
13. @Override
14. public void onCreate(Bundle savedInstanceState) {
15. super.onCreate(savedInstanceState);
16. setContentView(R.layout.main);
17. mWebView = (WebView) findViewById(R.id.webview);
18. mWebView.setWebChromeClient(new ReWebChomeClient(this));
19. mWebView.setWebViewClient(new ReWebViewClient());
20. fixDirPath();
21. //这里加载自己部署的（也可加载本地资源）
22. mWebView.loadUrl("file:///android_asset/input.html");
23. }
24. @Override
25. public void onActivityResult(int requestCode, int resultCode, Intent data) {
26. if (resultCode != Activity.RESULT_OK) {
27. return;
28. }
29. switch (requestCode) {
30. case REQUEST_CODE_IMAGE_CAPTURE:
31. case REQUEST_CODE_PICK_IMAGE: {
32. try {
33. if (mUploadMsg == null) {
34. return;
35. }
36. String sourcePath = ImageUtil.retrievePath(this, mSourceIntent, data);
37. if (TextUtils.isEmpty(sourcePath) || !new File(sourcePath).exists()) {
38. Log.w(TAG, "sourcePath empty or not exists.");
39. break;
40. }
41. Uri uri = Uri.fromFile(new File(sourcePath));
42. mUploadMsg.onReceiveValue(uri);
43. } catch (Exception e) {
44. e.printStackTrace();
45. }
46. break;
47. }
48. }
49. }
50. @Override
51. public void openFileChooserCallBack(ValueCallback<Uri> uploadMsg, String acceptType) {
52. mUploadMsg = uploadMsg;
53. showOptions();
54. }
55. public void showOptions() {
56. AlertDialog.Builder alertDialog = new AlertDialog.Builder(this);
57. alertDialog.setOnCancelListener(new ReOnCancelListener());
58. alertDialog.setTitle(R.string.options);
59. alertDialog.setItems(R.array.options, new DialogInterface.OnClickListener() {
60. @Override
61. public void onClick(DialogInterface dialog, int which) {
62. if (which == 0) {
63. mSourceIntent = ImageUtil.choosePicture();
64. startActivityForResult(mSourceIntent, REQUEST_CODE_PICK_IMAGE);
65. } else {
66. mSourceIntent = ImageUtil.takeBigPicture();
67. startActivityForResult(mSourceIntent, REQUEST_CODE_IMAGE_CAPTURE);
68. }
69. }
70. }
71. );
72. alertDialog.show();
73. }
74. private void fixDirPath() {
75. String path = ImageUtil.getDirPath();
76. File file = new File(path);
77. if (!file.exists()) {
78. file.mkdirs();
79. }
80. }
81. private class ReOnCancelListener implements DialogInterface.OnCancelListener {
82. @Override
83. public void onCancel(DialogInterface dialogInterface) {
84. if (mUploadMsg != null) {
85. mUploadMsg.onReceiveValue(null);
86. mUploadMsg = null;
87. }
88. }
89. }
90. }

有些哥们反馈没有附上html无法测试，放上html到本地即可：input.html

[html] view plaincopy

1. <!DOCTYPE html>
2. <html>
3. <head>
4. <meta name="viewport" content="user-scalable=no">
5. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
6. </head>
7. <body>
8. <input id="input" type="file"/>
9. </body>
10. </html>

源码没有附上本地html，需自行创建。源码下载地址：CSDN下载