photoView實(shí)現(xiàn)圖片多點(diǎn)觸控效果
本文實(shí)例為大家分享了PhotoView實(shí)現(xiàn)圖片多點(diǎn)觸控效果展示的具體代碼,供大家參考,具體內(nèi)容如下
效果:點(diǎn)擊后能夠自由縮放、平移;

添加依賴:
compile 'com.commit451:PhotoView:1.2.4' compile 'com.github.bumptech.glide:glide:3.5.2'
布局文件:
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <RelativeLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@android:color/white"> <!-- 抽取所有的Viewpager布局--> <android.support.v4.view.ViewPager android:id="@+id/viewPager" android:layout_width="match_parent" android:layout_height="wrap_content" /> <LinearLayout android:id="@+id/ll_point" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignBottom="@id/viewPager" android:layout_marginBottom="10dp" android:layout_marginTop="10dp" android:gravity="center" android:orientation="horizontal" /> </RelativeLayout> </LinearLayout>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:background="#ffffff"> <com.example.tuhuadmin.imagetouch.HackyViewPager android:id="@+id/hViewPager" android:layout_width="match_parent" android:layout_height="match_parent" /> </RelativeLayout>
代碼實(shí)現(xiàn):
package com.example.tuhuadmin.imagetouch;
import android.content.Intent;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.RelativeLayout;
import com.bumptech.glide.Glide;
import java.util.ArrayList;
public class MainActivity extends AppCompatActivity {
private ViewPager vp;
private LinearLayout ll_point;
private ArrayList<String> mImages;
//用于存放ImageView
private ArrayList<ImageView> imageViewsList;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initViews();
initImageUrl();
getImageData();
}
private void initImageUrl() {
//要顯示的圖片地址添加到集合里面
mImages = new ArrayList<String>();
mImages.add(Constant.url1);
mImages.add(Constant.url2);
mImages.add(Constant.url4);
mImages.add(Constant.url5);
mImages.add(Constant.url6);
imageViewsList = new ArrayList<>();
}
private void initViews() {
vp = (ViewPager) findViewById(R.id.viewPager);
ll_point = (LinearLayout) findViewById(R.id.ll_point);
//讓圖片正方形顯示
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.MATCH_PARENT, ScreenUtils.getScreenWidth(this));
vp.setLayoutParams(params);
}
public void getImageData() {
if (mImages.size() == 1) {
// 只有一張圖片 就不顯示圓點(diǎn)
} else {
for (int i = 0; i < mImages.size(); i++) {
View point = new View(this);
//point.setId(i);//設(shè)置Id
point.setTag(i);//設(shè)置Tag
//設(shè)置背景
point.setBackgroundResource(R.drawable.point_selector);
//布局參數(shù)
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(15, 15);
params.rightMargin = 20;//右邊距
//把點(diǎn)添加到線性布局
ll_point.addView(point, params);
}
View point = ll_point.getChildAt(0);
point.setEnabled(false);
}
for (int i = 0; i < mImages.size(); i++) {
ImageView iv = new ImageView(this);
//設(shè)置iv的寬高
ViewGroup.LayoutParams params = new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ScreenUtils.getScreenWidth(this));
iv.setLayoutParams(params);
//設(shè)置iv的填充樣式--->可能導(dǎo)致圖片變形
iv.setScaleType(ImageView.ScaleType.FIT_XY);
String url = mImages.get(i);
Glide.with(this).load(url).into(iv);
//設(shè)置圖片的點(diǎn)擊事件
//為每一個(gè)ImageView設(shè)置單獨(dú)的標(biāo)記、圖片的位置
iv.setTag(i);
iv.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
int position = (int) view.getTag();
Intent intent = new Intent(MainActivity.this, PhotoShowActivity.class);
//傳遞當(dāng)前點(diǎn)擊的圖片的位置、圖片路徑集合
intent.putExtra("position", position);
intent.putStringArrayListExtra("mImages", mImages);
startActivity(intent);
}
});
// 把圖片添加到集合里面
imageViewsList.add(iv);
}
vp.setAdapter(new ViewPagerAdapter(imageViewsList,vp) );
vp.setOnPageChangeListener(new MyOnPageChangeListener());
}
private class MyOnPageChangeListener implements ViewPager.OnPageChangeListener {
@Override
public void onPageScrollStateChanged(int arg0) {
}
@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
}
//頁(yè)面選擇
@Override
public void onPageSelected(int index) {
changePager(index);
}
}
private void changePager(int index) {
int childCount = ll_point.getChildCount();
for (int i = 0; i < childCount; i++) {
View point = ll_point.getChildAt(i);//獲取小圓點(diǎn)
if (index == i) {
//當(dāng)前選擇的頁(yè)面下標(biāo)
point.setEnabled(false);
} else {
point.setEnabled(true);
}
}
}
}
PhotoShowActivity中代碼實(shí)現(xiàn):
package com.example.tuhuadmin.imagetouch;
import android.app.Activity;
import android.graphics.Color;
import android.os.Bundle;
import android.support.v4.view.PagerAdapter;
import android.text.TextUtils;
import android.view.View;
import android.view.ViewGroup;
import com.bumptech.glide.Glide;
import java.util.ArrayList;
import uk.co.senab.photoview.PhotoView;
import uk.co.senab.photoview.PhotoViewAttacher;
/**
* Created on 2016/7/19.
* Author:crs
* Description:XXX
*/
public class PhotoShowActivity extends Activity {
private int position;
private ArrayList<String> mDatas;
private HackyViewPager hViewPager;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_photo_show);
getFrontPageData();
initViews();
}
private void initViews() {
hViewPager = (HackyViewPager) findViewById(R.id.hViewPager);
hViewPager.setAdapter(new ImageAdapter());
//為ViewPager當(dāng)前page的數(shù)字
hViewPager.setCurrentItem(position);
}
public void getFrontPageData() {
//點(diǎn)擊圖片的位置
position = getIntent().getIntExtra("position", 0);
//獲取傳遞過(guò)來(lái)的圖片地址
mDatas = getIntent().getStringArrayListExtra("mImages");
}
public class ImageAdapter extends PagerAdapter {
@Override
public int getCount() {
return null == mDatas ? 0 : mDatas.size();
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View) object);
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
//創(chuàng)建顯示圖片的控件
PhotoView photoView = new PhotoView(container.getContext());
//設(shè)置背景顏色
photoView.setBackgroundColor(Color.WHITE);
//把photoView添加到viewpager中,并設(shè)置布局參數(shù)
container.addView(photoView, ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);
//加載當(dāng)前PhtotoView要顯示的數(shù)據(jù)
String url = mDatas.get(position);
if (!TextUtils.isEmpty(url)) {
//使用使用Glide進(jìn)行加載圖片進(jìn)行加載圖片
Glide.with(PhotoShowActivity.this).load(url).into(photoView);
}
//圖片單擊事件的處理
photoView.setOnViewTapListener(new PhotoViewAttacher.OnViewTapListener() {
@Override
public void onViewTap(View view, float x, float y) {
finish();
}
});
return photoView;
}
}
}
ScreenUtils中代碼:WindowManager類的使用 WINDOW_SERVICE Display(屏幕參數(shù)工具類)
package com.example.tuhuadmin.imagetouch;
import android.content.Context;
import android.view.Display;
import android.view.WindowManager;
/**
* Created on 2016/7/19.
* Author:crs
* Description:XXX
*/
public class ScreenUtils {
public static int getScreenWidth(Context context) {
WindowManager wm = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);
Display defaultDisplay = wm.getDefaultDisplay();
int width = defaultDisplay.getWidth();
return width;
}
}
Constant接口中存儲(chǔ)字符串常量:
package com.example.tuhuadmin.imagetouch;
/**
* Created on 2016/7/19.
* Author:crs
* Description:XXX
*/
public interface Constant {
String url1 = "http://pic.yesky.com/uploadImages/2016/181/06/L3JL486FYCL7.jpg";
String url2 = "http://pic.yesky.com/uploadImages/2016/181/07/9MXS11F0HOC2.jpg";
String url5 = "http://xm.fjsen.com/images/attachement/jpg/site2/20160629/38c986e7161c18dd5a6c1d.jpg";
String url4 = "http://pimg.damai.cn/perform/project/281/28183_n.jpg";
String url6 = "http://i3.hunantv.com/p1/20110905/1702374043.jpg";
}
ViewPagerAdapter:
package com.example.tuhuadmin.imagetouch;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import java.util.ArrayList;
/**
* Created on 2016/7/19.
* Author:crs
* Description:XXX
*/
public class ViewPagerAdapter extends PagerAdapter {
ArrayList<ImageView> mImages;
ViewPager vp;
public ViewPagerAdapter(ArrayList<ImageView> mImages, ViewPager vp) {
this.mImages = mImages;
this.vp = vp;
}
@Override
public int getCount() {
return null == mImages ? 0 : mImages.size();
}
@Override
public boolean isViewFromObject(View arg0, Object arg1) {
return arg0 == arg1;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
ImageView iv = mImages.get(position);
vp.removeView(iv);
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
ImageView iv = mImages.get(position);
vp.addView(iv);
return mImages.get(position);
}
}
代碼下載
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
Android搜索結(jié)果顯示高亮實(shí)例(有數(shù)據(jù)滑動(dòng)底部自動(dòng)刷新)
本篇文章主要介紹了Android搜索結(jié)果顯示高亮實(shí)例(有數(shù)據(jù)滑動(dòng)底部自動(dòng)刷新),非常具有實(shí)用價(jià)值,需要的朋友可以參考下2017-04-04
Android SurfaceView預(yù)覽變形完美解決方法
本篇文章主要介紹了Android SurfaceView預(yù)覽變形完美解決方法,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-04-04
Android開(kāi)發(fā)之使用通知欄顯示提醒信息的方法
這篇文章主要介紹了Android開(kāi)發(fā)之使用通知欄顯示提醒信息的方法,涉及Notification的使用及通知欄信息設(shè)置技巧,需要的朋友可以參考下2016-01-01
Android九宮格手勢(shì)密碼代碼設(shè)計(jì)
這篇文章主要為大家詳細(xì)介紹了Android九宮格手勢(shì)密碼的代碼設(shè)計(jì)思路,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-03-03
Android倒計(jì)時(shí)的開(kāi)始與停止 剩余時(shí)分秒的展示
這篇文章主要為大家詳細(xì)介紹了Android倒計(jì)時(shí)的開(kāi)始與停止,剩余時(shí)分秒的展示,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2019-09-09
Android快速實(shí)現(xiàn)一個(gè)財(cái)務(wù)APP程序詳解
這篇文章主要介紹了Android實(shí)現(xiàn)的財(cái)務(wù)APP程序,結(jié)合前后端共功能完善,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-07-07

