热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

Android内嵌H5页面调用手机图片操作

  这段时间一直忙着产品需求迭代更新,有几天没有写博客了。在这个迭代中,遇到了一个比较棘手的问题,情况是这样:我们在APP中有一个功能是引导商家入驻我们平台,商家入驻就需要填写一些

   这段时间一直忙着产品需求迭代更新,有几天没有写博客了。在这个迭代中,遇到了一个比较棘手的问题,情况是这样:我们在APP中有一个功能是引导商家入驻我们平台,商家入驻就需要填写一些企业信息和上传营业执照或宣传照片等。为了考虑到方便及兼容性问题,我们产品就考虑用H5开发这个功能,然后内嵌到APP中,刚开始我们APP端开发的满心欢喜,因为用H5开发,我们直接放在WebView就可以了,方便省事,但后来才知道我们是空欢喜一场,因为遇到了令人很头痛的兼容性问题。页面很简单,如下:《Android内嵌H5页面调用手机图片操作》

红色箭头就是这次兼容性问题的根本。因为这个页面纯H5开发的,添加图片功能在APP上本来应该没问题,在ios上确实没问题,但是在我们Android上点击添加图片居然没有任何反应。后来百度,必应等搜索,加上请同事帮忙,才知道问题出在哪里。

    我们的实现原理还是一样的,也是用WebView以load的方式加载h5页面,不过要实现H5在APP上操作图片,我们就需要重写WebChromeClient中的openFileChooser方法才行,顺便百度了下WebView中 WebViewClient与WebChromeClient的区别:

WebViewClient主要帮助WebView处理各种通知、请求事件的,比如:

onLoadResource
onPageStart
onPageFinish
onReceiveError
onReceivedHttpAuthRequest

WebChromeClient主要辅助WebView处理Javascript的对话框、网站图标、网站title、加载进度等比如

onCloseWindow(关闭WebView)
onCreateWindow()
onJsAlert (WebView上alert无效,需要定制WebChromeClient处理弹出)
onJsPrompt
onJsConfirm
onProgressChanged
onReceivedIcon
onReceivedTitle

看上去他们有很多不同,实际使用的话,如果你的WebView只是用来处理一些html的页面内容,只用WebViewClient就行了,如果需要更丰富的处理效果,比如JS、进度条等,就要用到WebChromeClient。因为我们只需要要处理Html中图片上传效果,所以我们用到了WebChromeClient。利益于这两篇文章的帮助 :http://blog.csdn.net/woshinia/article/details/19030437和http://magiclen.org/android-filechooser/,后来通过一些处理,基本实现了图片上传的功能 ,最终我们的代码如下:

mWebView.setWebChromeClient(new WebChromeClient() {
@Override
public void onReceivedTitle(WebView view, String mTitle) {
super.onReceivedTitle(view, mTitle);

                                   //这里可以用来处理我们的页面标题

}
@Override
public void onProgressChanged(WebView view, int newProgress) {
//处理网页面加载进度
}

// For Android <3.0


public void openFileChooser(ValueCallback filePathCallback) {

mFilePathCallback4 = filePathCallback;

IntentUtils.jumpToSelectPics(aty, false, 1, MultiImageSelectorActivity.MODE_SINGLE);

}

// For Android > 4.1.1

public void openFileChooser(ValueCallback filePathCallback, String acceptType) {

mFilePathCallback4 = filePathCallback;

IntentUtils.jumpToSelectPics(aty, false, 1, MultiImageSelectorActivity.MODE_MULTI);

}

// For Android 3.0+

public void openFileChooser(ValueCallback filePathCallback, String acceptType, String capture) {

mFilePathCallback4 = filePathCallback;

IntentUtils.jumpToSelectPics(aty, false, 1, MultiImageSelectorActivity.MODE_MULTI);

}

public boolean onShowFileChooser(WebView webView, ValueCallback filePathCallback,

WebChromeClient.FileChooserParams fileChooserParams) {

mFilePathCallback5 = filePathCallback;

IntentUtils.jumpToSelectPics(aty, false, 1, MultiImageSelectorActivity.MODE_MULTI);

return true;

}

});

我们这里选择好图片后,还要进行处理:

@Override
public void onActivityResult(int requestCode, int resultCode, Intent intent) {
if (requestCode == IntentUtils.REQUEST_IMAGE) {
if (mFilePathCallback4 != null) {
if (null != intent) {
ArrayList resultList = intent
.getStringArrayListExtra(MultiImageSelectorActivity.EXTRA_RESULT);
if (resultList.size() > 0) {

String path = MediaUtility.getPath(BaseWebViewAct.this,
Uri.parse("file://" + resultList.get(0)));//
Uri uri = Uri.fromFile(new File(path));
mFilePathCallback4.onReceiveValue(uri);
}
}
else {
mFilePathCallback4.onReceiveValue(null);
}
}
if (mFilePathCallback5 != null) {
if (null != intent) {
ArrayList resultList = intent
.getStringArrayListExtra(MultiImageSelectorActivity.EXTRA_RESULT);
if (resultList.size() > 0) {

String path = MediaUtility.getPath(BaseWebViewAct.this,
Uri.parse("file://" + resultList.get(0)));//
Uri uri = Uri.fromFile(new File(path));
mFilePathCallback5.onReceiveValue(new Uri[]{uri});
}
}
else {
mFilePathCallback5.onReceiveValue(null);
}
}

mFilePathCallback4 = null;
mFilePathCallback5 = null;
}
}

这样功能基本上就实现了,但是还是没有完全解决我们的需求,因为我测试了7个品牌的手机,其中华为,三星,联想,小米,酷派,魅族六款手机没问题,但是HTC手机还是没有实现功能,百度了下也讲到上面所讲的图片操作方法对于Android 4.4.2版本不支持,刚好我测试的HTC手机也是4.4.2版本的。也想请教大神们,这个问题可以怎么处理?


推荐阅读
  • 在Android开发中,使用Picasso库可以实现对网络图片的等比例缩放。本文介绍了使用Picasso库进行图片缩放的方法,并提供了具体的代码实现。通过获取图片的宽高,计算目标宽度和高度,并创建新图实现等比例缩放。 ... [详细]
  • Android中高级面试必知必会,积累总结
    本文介绍了Android中高级面试的必知必会内容,并总结了相关经验。文章指出,如今的Android市场对开发人员的要求更高,需要更专业的人才。同时,文章还给出了针对Android岗位的职责和要求,并提供了简历突出的建议。 ... [详细]
  • 自动轮播,反转播放的ViewPagerAdapter的使用方法和效果展示
    本文介绍了如何使用自动轮播、反转播放的ViewPagerAdapter,并展示了其效果。该ViewPagerAdapter支持无限循环、触摸暂停、切换缩放等功能。同时提供了使用GIF.gif的示例和github地址。通过LoopFragmentPagerAdapter类的getActualCount、getActualItem和getActualPagerTitle方法可以实现自定义的循环效果和标题展示。 ... [详细]
  • HTML学习02 图像标签的使用和属性
    本文介绍了HTML中图像标签的使用和属性,包括定义图像、定义图像地图、使用源属性和替换文本属性。同时提供了相关实例和注意事项,帮助读者更好地理解和应用图像标签。 ... [详细]
  • 深入理解CSS中的margin属性及其应用场景
    本文主要介绍了CSS中的margin属性及其应用场景,包括垂直外边距合并、padding的使用时机、行内替换元素与费替换元素的区别、margin的基线、盒子的物理大小、显示大小、逻辑大小等知识点。通过深入理解这些概念,读者可以更好地掌握margin的用法和原理。同时,文中提供了一些相关的文档和规范供读者参考。 ... [详细]
  • macOS Big Sur全新设计大版本更新,10+个值得关注的新功能
    本文介绍了Apple发布的新一代操作系统macOS Big Sur,该系统采用全新的界面设计,包括图标、应用界面、程序坞和菜单栏等方面的变化。新系统还增加了通知中心、桌面小组件、强化的Safari浏览器以及隐私保护等多项功能。文章指出,macOS Big Sur的设计与iPadOS越来越接近,结合了去年iPadOS对鼠标的完善等功能。 ... [详细]
  • 如何压缩网站页面以减少页面加载时间
    本文介绍了影响网站打开时间的两个因素,即网页加载速度和网站页面大小。重点讲解了如何通过压缩网站页面来减少页面加载时间。具体包括图片压缩、Javascript压缩、CSS压缩和HTML压缩等方法,并推荐了相应的压缩工具。此外,还提到了一款Google Chrome插件——网页加载速度分析工具Speed Tracer。 ... [详细]
  • 资源:吊炸天!74款APP完整源码!android界面中点击输入框时弹出输入法如果输入框在底部会出现输入法遮挡输入内容的问题解决办法设置activity的windowsoftinpu ... [详细]
  • Android Studio中的IBM MobileFirst Compile问题 - IBM MobileFirst Compile in Android Studio Issue
    IbuiltaMultipageapplicationbyusingIBMMobileFirst,accordingto据我所知,我使用IBMMobileFirst构建了一个 ... [详细]
  • 安卓开发入门!BAT大厂面试基础题集合,顺利通过阿里Android岗面试
    其实不是Android不行了,而是你跟不上了我的很多读者都在反馈说,现在一个岗位可以收到的简历数,是前几年的几倍。我们必须承认ÿ ... [详细]
  • 本文介绍了高校天文共享平台的开发过程中的思考和规划。该平台旨在为高校学生提供天象预报、科普知识、观测活动、图片分享等功能。文章分析了项目的技术栈选择、网站前端布局、业务流程、数据库结构等方面,并总结了项目存在的问题,如前后端未分离、代码混乱等。作者表示希望通过记录和规划,能够理清思路,进一步完善该平台。 ... [详细]
  • 使用chrome编辑器实现网页截图功能的方法
    本文介绍了在chrome浏览器中使用编辑器实现网页截图功能的方法。通过在地址栏中输入特定命令,打开控制台并调用命令面板,用户可以方便地进行网页截图操作。 ... [详细]
  • 本文介绍了网页播放视频的三种实现方式,分别是使用html5的video标签、使用flash来播放以及使用object标签。其中,推荐使用html5的video标签来简单播放视频,但有些老的浏览器不支持html5。另外,还可以使用flash来播放视频,需要使用object标签。 ... [详细]
  • 本文整理了常用的CSS属性及用法,包括背景属性、边框属性、尺寸属性、可伸缩框属性、字体属性和文本属性等,方便开发者查阅和使用。 ... [详细]
  • css元素可拖动,如何使用CSS禁止元素拖拽?
    一、用户行为三剑客以下3个CSS属性:user-select属性可以设置是否允许用户选择页面中的图文内容;user-modify属性可以设置是否允许输入 ... [详细]
author-avatar
手机用户2602921931
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有