Android WebView中图片浏览及缩放效果

概述本文实例为大家分享了AndroidWebView图片浏览及缩放效果展示的具体代码，供大家参考，具体内容如下

本文实例为大家分享了AndroID WebVIEw图片浏览及缩放效果展示的具体代码，供大家参考，具体内容如下

此工程用到了两个开源库:

PhotoView支持图片的缩放
Android-Universal-Image-Loader图片的异步加载

（androID studio）将两个源工程中的library文件夹导入到Demo Module所在的Project中，修改各自的build.gradle文件，让里面的版本号、所用的androID包等与Demo Module相同即可。大致如图：

源代码：

主Activity.java

public class MainActivity extends Activity { private WebVIEw webvIEw; private WebSettings wv; private ArrayList<String> Listimg; @OverrIDe protected voID onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentVIEw(R.layout.activity_main); webvIEw = (WebVIEw)findVIEwByID(R.ID.webvIEw); Listimg = new ArrayList<>();  wv = webvIEw.getSettings();  wv.setJavaScriptEnabled(true);  webvIEw.addJavaScriptInterface(new JavaScriptInterface(this),"imageListner");//绑定javasrcipt接口，imageListner为接口的别名  webvIEw.loadUrl("http://portal.smu.edu.cn/e/action/ShowInfo2.PHP?classID=1415&ID=63663&tlpID=98");  webvIEw.setWebVIEwClIEnt(new WebVIEwClIEnt(){  public boolean shouldOverrIDeUrlLoading(WebVIEw vIEw,String url)  {   //点击webVIEw中的键接，依然在此webvIEw中显示，而不跳转到别的浏览器   webvIEw.loadUrl(url);   return super.shouldOverrIDeUrlLoading(vIEw,url);  } @OverrIDe public voID onPageFinished(WebVIEw vIEw,String url) {  super.onPageFinished(vIEw,url);  addImageListner();  //当页面加载完成，就调用我们的addImageListener()函数  } @OverrIDe public voID onPageStarted(WebVIEw vIEw,String url,Bitmap favicon) {  super.onPageStarted(vIEw,url,favicon);  } }); } private voID addImageListner() { //遍历页面中所有img的节点，因为节点里面的图片的url即obJs[i].src，保存所有图片的src. //为每个图片设置点击事件，obJs[i].onclick webvIEw.loadUrl("JavaScript:(function(){" +  "var obJs = document.getElementsByTagname(\"img\"); " +  "for(var i=0;i<obJs.length;i++) " + "{" +  "window.imageListner.readImageUrl(obJs[i].src); " +  " obJs[i].onclick=function() " +  " { "+   " window.imageListner.openImage(this.src); " +  " } " + "}" +  "})()"); } class JavaScriptInterface { private Context context; public JavaScriptInterface(Context context) {   this.context = context;  }  @androID.webkit.JavaScriptInterface public voID readImageUrl(String img) { //把所有图片的url保存在ArrayList<String>中  Listimg.add(img); } @androID.webkit.JavaScriptInterface //对于targetSdkVersion>=17的，要加这个声明 public voID openImage(String clickimg)//点击图片所调用到的函数 { int index = 0; for(String url:Listimg) if(url.equals(clickimg)) index = Listimg.indexOf(clickimg);//获取点击图片在整个页面图片中的位置 Intent intent = new Intent(); Bundle bundle = new Bundle(); bundle.putStringArrayList("List_image",Listimg); bundle.putInt("index",index); intent.putExtra("bundle",bundle);//将所有图片的url以及点击图片的位置作为参数传给启动的activity intent.setClass(context,VIEwPagerActivity.class); context.startActivity(intent);//启动VIEwPagerActivity,用于显示图片 } }}

VIEwPagerActivity.java

public class VIEwPagerActivity extends Activity { private VIEwPager mVIEwPager; private VIEw rootVIEw; private PhotoVIEw image; private TextVIEw indicator; private Bundle bundle; ArrayList<String> Listimg; private int index; private int count; @OverrIDe public voID onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentVIEw(R.layout.activity_vIEw_pager); mVIEwPager = (HackyVIEwPager) findVIEwByID(R.ID.vIEw_pager); setContentVIEw(mVIEwPager); bundle = getIntent().getBundleExtra("bundle"); Listimg = bundle.getStringArrayList("List_image"); index = bundle.getInt("index"); count = Listimg.size(); mVIEwPager.setAdapter(new SamplePagerAdapter()); mVIEwPager.setCurrentItem(index); } class SamplePagerAdapter extends PagerAdapter { @OverrIDe public int getCount() {  return count; } @OverrIDe //此处用到PhotoVIEw、ImageLoader均为第三方类库的类 public VIEw instantiateItem(VIEwGroup container,int position) {  rootVIEw = VIEw.inflate(VIEwPagerActivity.this,R.layout.vIEwpager_item,null);  image = (PhotoVIEw) rootVIEw.findVIEwByID(R.ID.photovIEw);  indicator = (TextVIEw) rootVIEw.findVIEwByID(R.ID.indicator);  ImageLoader imageloader=ImageLoader.getInstance();  imageloader.init(ImageLoaderConfiguration.createDefault(VIEwPagerActivity.this));  imageloader.displayImage(Listimg.get(position),image);  CharSequence text = getString(R.string.vIEwpager_indicator,position+1,count);  indicator.setText(text);  container.addVIEw(rootVIEw,LayoutParams.MATCH_PARENT,LayoutParams.MATCH_PARENT);  return rootVIEw; } @OverrIDe public voID destroyItem(VIEwGroup container,int position,Object object) {  container.removeVIEw((VIEw) object); } @OverrIDe public boolean isVIEwFromObject(VIEw vIEw,Object object) {  return vIEw == object; } }}

HackVIEwPager.java

public class HackyVIEwPager extends VIEwPager { private boolean isLocked; public HackyVIEwPager(Context context) { super(context); isLocked = false; } public HackyVIEwPager(Context context,AttributeSet attrs) { super(context,attrs); isLocked = false; } @OverrIDe public boolean onIntercepttouchEvent(MotionEvent ev) {//用于处理touch事件 if (!isLocked) {  try {  return super.onIntercepttouchEvent(ev);  } catch (IllegalArgumentException e) {  e.printstacktrace();  return false;  } } return false; } @OverrIDe public boolean ontouchEvent(MotionEvent event) { return !isLocked && super.ontouchEvent(event); }}

相关的布局文件：
MainActivity布局中只有一个简单的webVIEw;
VIEwPagerActivity布局中也只是一个HackVIEwPager;
HackVIEwPager中每一个VIEw的布局：

vIEwpager_item.xml

<?xml version="1.0" enCoding="utf-8"?><relativeLayout xmlns:androID="http://schemas.androID.com/apk/res/androID" androID:layout_wIDth="match_parent" androID:layout_height="match_parent" > <uk.co.senab.photovIEw.PhotoVIEw androID:ID="@+ID/photovIEw" androID:layout_wIDth="match_parent" androID:layout_height="match_parent" /> <TextVIEw androID:ID="@+ID/indicator" androID:layout_wIDth="match_parent" androID:layout_height="wrap_content" androID:layout_alignParentBottom="true" androID:gravity="center" androID:textSize="18sp" androID:textcolor="@androID:color/white" androID:text="@string/vIEwpager_indicator" androID:background="@androID:color/transparent" /></relativeLayout>

用到了一个@string/vIEwpager_indicator为

<string name="vIEwpager_indicator">%1$d/%2$d</string>

总结：主要难点还是在获取页面中图片的url,用到的是java函数与JavaScript的通信。

总结

以上是内存溢出为你收集整理的Android WebView中图片浏览及缩放效果全部内容，希望文章能够帮你解决Android WebView中图片浏览及缩放效果所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。