Android 使用腾讯X5浏览器上传图片的示例

 更新时间:2021年04月02日 08:50:09   作者:沉默王贰  
这篇文章主要介绍了Android 使用腾讯X5浏览器上传图片的示例,帮助大家更好的理解和学习使用Android开发,感兴趣的朋友可以了解下

这几天在客户端接入一个Web页的客服系统,用来接受用户的反馈和建议。Android客户端集成这个客服H5之后,图片死活传递不上去。看了一下iOS同事的集成效果,可以自由上传图片,再把H5的地址用Android原生浏览器打开,也可以正常打开相册上传图片。

What??? 见鬼了, 气抖冷!!!

看了一些博客,使用Android的WebView在默认情况下是不能够支持上传文件的(需要重写 onShowFileChooser方法)。那就只能撸起袖子自己干了。

项目中使用的浏览器内核是腾讯X5浏览器,那就去腾讯X5的技术文档看看有没有实现方式:TBS开发指引, 找了一下发现还真有

1、文件选择

方法一: 文件单选:设置client回调

mWebView.setWebChromeClient(new WebChromeClient() {
  @Override
  public void openFileChooser(
    ValueCallback<Uri> uploadFile,
    String acceptType, 
    String captureType) {
    //保存对应的valuecallback供选择后使用
    //通过startActivityForResult启动文件选择窗口或自定义文件选择
  } 
});

文件多选:设置client回调

mWebView.setWebChromeClientExtension(new ProxyWebChromeClientExtension() {
  @Override
  public void openFileChooser(
    android.webkit.ValueCallback<Uri[]> uploadFile, 
    String acceptType,
    String captureType) {
    //保存对应的valuecallback供选择后使用
    //通过startActivityForResult启动文件选择窗口或自定义文件选择  
  }
});

方法二: 设置client回调(单选多选均会回调该接口)

mWebView.setWebChromeClient(new WebChromeClient() {
  @Override
  public boolean onShowFileChooser(
    IX5WebViewBase webView, 
    ValueCallback<Uri[]> filePathCallback,
    FileChooserParams fileChooserParams) {
    //保存对应的valuecallback供选择后使用
    //通过startActivityForResult启动文件选择窗口或自定义文件选择
  }  
});

然后在activity返回时将用户的选择设置给对应的ValueCallback

protected void onActivityResult(int requestCode, int resultCode, Intent data) {
  //如果是文件选择
  if (resultCode == RESULT_OK) {
    //给文件选择的ValueCallback设置onReceiveValue值
  } else if (resultCode == RESULT_CANCELED) {
    //给文件选择的ValueCallback设置null值
  }
}

2、实现文件单选

在项目自定义的WebChromeClient 中,重写openFileChooser方法, 调用项目中图片选择组件,图片选择成功后将生成的uri使用valueCallback回调,即可上传成功

  // 图片单选上传
  @Override
  public void openFileChooser(ValueCallback<Uri> valueCallback, String s, String s1) {
    Log.i(TAG, "openFileChooser: acceptType: " + s + "  captureType: " + s1);
    
    // 调用项目中图片选择组件
    // 图片选择成功后将生成的uri使用valueCallback回调 
    // 即可上传成功
    
  }
  // 很多博客介绍了, 要写很多Android各个API的兼容代码, 其实不用。 X5在这个方法底层其实实现了兼容各系统的能力,不需要上层开发者来实现。 只需实现这一个方法即可
  

实现效果:

3、举个例子

为简单起见, 集成一个第三方的图片选择控件

github.com/thewyp/Avat…

集成方式:

dependencies {
        ...
        compile 'me.thewyp:avatar:1.0.4'
      }

使用方式:

new AvatarStudio.Builder(activityContext)
              .needCrop(true)//是否裁剪,默认裁剪
              .setTextColor(Color.BLUE)
              .dimEnabled(true)//背景是否dim 默认true
              .setAspect(1, 1)//裁剪比例 默认1:1
              .setOutput(200, 200)//裁剪大小 默认200*200
              .setText("打开相机", "从相册中选取", "取消")
              .show(new AvatarStudio.CallBack() {
                @Override
                public void callback(String uri) {
                   //uri为图片路径
                   Picasso.with(activityContext).load(new File(uri)).into(mImageView);
                }
              });

实现Web上传图片

public class WebChromeClientImpl extends WebChromeClient {
  ......
    // 图片单选上传
  @Override
  public void openFileChooser(ValueCallback<Uri> valueCallback, String s, String s1) {
    Log.i(TAG, "openFileChooser: acceptType: " + s + "  captureType: " + s1);
    
    new AvatarStudio.Builder(context)
      .needCrop(true)//是否裁剪,默认裁剪
      .setTextColor(Color.BLUE)
      .dimEnabled(true)//背景是否dim 默认true
      .setAspect(1, 1)//裁剪比例 默认1:1
      .setOutput(200, 200)//裁剪大小 默认200*200
      .setText("打开相机", "从相册中选取", "取消")
      .show(new AvatarStudio.CallBack() {
        @Override
        public void callback(String uri) {
          //uri为图片路径
          valueCallback.onReceiveValue(Uri.parse(uri)); // 将生成的Uri使用valueCallback 回调给X5底层,实现图片上传
        }
      });
  }
  ......
}

至此,图片的上传就实现了。文件的实现也是同理, 大家感兴趣的可以试试

以上就是Android 使用腾讯X5浏览器上传图片的示例的详细内容,更多关于Android 上传图片的资料请关注脚本之家其它相关文章!

相关文章

  • OpenGL关于glStencilFuncSeparate()和glStencilFunc()函数的区别讲解

    OpenGL关于glStencilFuncSeparate()和glStencilFunc()函数的区别讲解

    今天小编就为大家分享一篇OpenGL关于glStencilFuncSeparate()和glStencilFunc()函数的区别讲解,小编觉得内容挺不错的,现在分享给大家,具有很好的参考价值,需要的朋友一起跟随小编来看看吧
    2019-04-04
  • Android Studio提示inotify大小不足的解决办法

    Android Studio提示inotify大小不足的解决办法

    大家在使用Android Studio导入AOSP源码的时候,可能会遇到inotify大小不足的问题,这篇文章就给大家介绍了怎么解决这个问题的方法,有需要的朋友们可以参考借鉴。
    2016-09-09
  • Kotlin中空判断与问号和感叹号标识符使用方法

    Kotlin中空判断与问号和感叹号标识符使用方法

    最近使用kotlin重构项目,遇到了一个小问题,在Java中,可能会遇到判断某个对象是否为空,为空执行一段逻辑,不为空执行另外一段逻辑,下面这篇文章主要给大家介绍了关于Kotlin中空判断与问号和感叹号标识符处理操作的相关资料,需要的朋友可以参考下
    2022-12-12
  • Android开发之高德地图实现定位

    Android开发之高德地图实现定位

    本篇文章主要介绍了Android中高德地图实现定位的相关知识。具有很好的参考价值。下面跟着小编一起来看下吧
    2017-04-04
  • Android编程使用pull方式解析xml格式文件的方法详解

    Android编程使用pull方式解析xml格式文件的方法详解

    这篇文章主要介绍了Android编程使用pull方式解析xml格式文件的方法,结合实例形式分析了Android调用pull解析器操作xml格式文件的步骤与相关操作技巧,需要的朋友可以参考下
    2017-07-07
  • Android自定义view利用PathEffect实现动态效果

    Android自定义view利用PathEffect实现动态效果

    这篇文章主要为大家详细介绍了Android自定义view利用PathEffect实现动态效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-05-05
  • Android网络数据开关用法简单示例

    Android网络数据开关用法简单示例

    这篇文章主要介绍了Android网络数据开关用法,通过自定义函数调用系统服务实现开关功能,具有一定参考借鉴价值,需要的朋友可以参考下
    2016-06-06
  • Android如何让WebView中的HTML5页面实现视频全屏播放

    Android如何让WebView中的HTML5页面实现视频全屏播放

    最近在工作遇到一个需求,需要让WebView中的HTML5页面实现视频全屏播放的效果,通过查找相关的资料终于找到了解决的方法,所以想着分享给大家,所以本文介绍了关于Android如何让WebView中的HTML5页面实现视频全屏播放的相关资料,需要的朋友可以参考学习。
    2017-04-04
  • Android drawable微技巧,你不知道的drawable细节

    Android drawable微技巧,你不知道的drawable细节

    今天小编就为大家分享一篇关于Android drawable微技巧,你不知道的drawable细节,小编觉得内容挺不错的,现在分享给大家,具有很好的参考价值,需要的朋友一起跟随小编来看看吧
    2018-10-10
  • Android使用viewpager实现画廊式效果

    Android使用viewpager实现画廊式效果

    这篇文章主要为大家详细介绍了Android使用viewpager实现画廊式效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-08-08

最新评论