I am not able to Zoom the ImageView on the ViewPager.
my main Activity
public class ViewPagerMain extends AppCompatActivity {
ScaleGestureDetector scaleGestureDetector;
ImageView imageView;
Matrix matrix;
ViewPager viewPager;
private ViewPagerArrowIndicator viewPagerArrowIndicator;
Drawable rightarrow, leftarrow;
Button buttonnext, buttonprev;
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_viewpager);
buttonnext = (Button) findViewById(R.id.nexxt);
buttonprev = (Button) findViewById(R.id.prevv);
viewPager = (ViewPager) findViewById(R.id.view_pager);
// viewPagerArrowIndicator = (ViewPagerArrowIndicator) findViewById(R.id.viewPagerArrowIndicator);
imageView = (ImageView) findViewById(R.id.imageView);
CustomPagerAdapter customPagerAdapter = new CustomPagerAdapter(this);
viewPager.setAdapter(customPagerAdapter);
// viewPagerArrowIndicator.bind(viewPager);
// viewPagerArrowIndicator.setArrowIndicatorRes(R.drawable.ic_arrow_left, R.drawable.ic_arrow_right);
// rightarrow = getResources().getDrawable(R.drawable.ic_arrow_right);
// rightarrow.setColorFilter(getResources().getColor(R.color.RED), PorterDuff.Mode.SRC_ATOP);
// leftarrow = getResources().getDrawable(R.drawable.ic_arrow_left);
// leftarrow.setColorFilter(getResources().getColor(R.color.RED), PorterDuff.Mode.SRC_ATOP);
matrix = new Matrix();
scaleGestureDetector = new ScaleGestureDetector(this, new ScaleListener());
buttonnext.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
int currentItem = viewPager.getCurrentItem();
viewPager.setCurrentItem(currentItem + 1);
}
});
buttonprev.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
int currentItem = viewPager.getCurrentItem();
viewPager.setCurrentItem(currentItem - 1);
}
});
}
@Override
public boolean onTouchEvent(MotionEvent event) {
scaleGestureDetector.onTouchEvent(event);
return true;
}
private class ScaleListener extends ScaleGestureDetector.SimpleOnScaleGestureListener {
@Override
public boolean onScale(ScaleGestureDetector detector) {
float SF = detector.getScaleFactor();
SF = Math.max(0.1f, Math.min(SF, 0.5f));
matrix.setScale(SF, SF);
imageView.setImageMatrix(matrix);
return true;
}
}
}
my PagerAdapter Class
public class CustomPagerAdapter extends PagerAdapter {
Context mContext;
LayoutInflater mLayoutInflater;
int[] mResources = {
R.mipmap.page7,
R.mipmap.page8,
R.mipmap.page9,
R.mipmap.page10,
R.mipmap.page11,
R.mipmap.page12,
R.mipmap.page13,
R.mipmap.page14,
R.mipmap.page15,
R.mipmap.page16,
R.mipmap.page17,
R.mipmap.page18
};
public CustomPagerAdapter(Context context) {
mContext = context;
mLayoutInflater = (LayoutInflater) mContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
}
@Override
public int getCount() {
return mResources.length;
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view == ((RelativeLayout) object);
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
View itemView = mLayoutInflater.inflate(R.layout.activity_pager_items, container, false);
ImageView imageView = (ImageView) itemView.findViewById(R.id.imageView);
imageView.setImageResource(mResources[position]);
container.addView(itemView);
return itemView;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((RelativeLayout) object);
}
}
my TouchViewPagerImageView class for Zooming
public class TouchViewPagerImageView extends ImageView {
Matrix matrix = new Matrix();
// We can be in one of these 3 states
static final int NONE = 0;
static final int DRAG = 1;
static final int ZOOM = 2;
int mode = NONE;
//static NonSwipeableViewPager PagerLeft;
// Remember some things for zooming
PointF last = new PointF();
PointF start = new PointF();
float minScale = 1f;
float maxScale = 3f;
float[] m;
static boolean b = false, c = false;
float redundantXSpace, redundantYSpace;
float width, height;
static final int CLICK = 3;
float saveScale = 1f;
float right, bottom, origWidth, origHeight, bmWidth, bmHeight;
ScaleGestureDetector mScaleDetector;
Context context;
ViewGroup vp;
public TouchViewPagerImageView(Context context) {
super(context);
sharedConstructing(context);
}
public TouchViewPagerImageView(Context context, AttributeSet attrs) {
super(context, attrs);
sharedConstructing(context);
}
public void setChild(ViewGroup vp) {
this.vp = vp;
}
private void sharedConstructing(Context context) {
super.setClickable(true);
this.context = context;
mScaleDetector = new ScaleGestureDetector(context, new ScaleListener());
matrix.setTranslate(1f, 1f);
m = new float[9];
setImageMatrix(matrix);
setScaleType(ScaleType.MATRIX);
setOnTouchListener(new OnTouchListener() {
@SuppressWarnings("deprecation")
@Override
public boolean onTouch(View v, MotionEvent event) {
mScaleDetector.onTouchEvent(event);
matrix.getValues(m);
float x = m[Matrix.MTRANS_X];
float y = m[Matrix.MTRANS_Y];
/*Log.v("log_tag", event.getX()+" matrix "
+ x);*/
PointF curr = new PointF(event.getX(), event.getY());
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
TouchViewPagerImageView.b = false;
Log.v("event", "ACTION_DOWN");
last.set(event.getX(), event.getY());
start.set(last);
mode = DRAG;
break;
case MotionEvent.ACTION_MOVE:
if (mode == DRAG) {
float deltaX = curr.x - last.x;
float deltaY = curr.y - last.y;
float scaleWidth = Math.round(origWidth * saveScale);
float scaleHeight = Math.round(origHeight * saveScale);
if (scaleWidth < width) {
deltaX = 0;
if (y + deltaY > 0) {
TouchViewPagerImageView.b = true;
Log.v("event", "ACTION_MOVE scaleWidth < width y + deltaY > 0");
deltaY = -y;
} else if (y + deltaY < -bottom) {
TouchViewPagerImageView.b = false;
Log.v("event", "else ACTION_MOVE scaleWidth < width y + deltaY < -bottom");
deltaY = -(y + bottom);
} else {
TouchViewPagerImageView.b = false;
}
} else if (scaleHeight < height) {
deltaY = 0;
if (x + deltaX > 0) {
TouchViewPagerImageView.b = true;
Log.v("event", "ACTION_MOVE scaleWidth < height x + deltaX > 0");
deltaX = -x;
} else if (x + deltaX < -right) {
TouchViewPagerImageView.b = true;
Log.v("event", "ACTION_MOVE scaleWidth < height x + deltaX < -right");
deltaX = -(x + right);
} else {
TouchViewPagerImageView.b = false;
}
} else {
if (x + deltaX > 0) {
TouchViewPagerImageView.b = true;
Log.v("event", "scaleWidth > width");
deltaX = -x;
} else if (x + deltaX < -right) {
TouchViewPagerImageView.b = true;
Log.v("event", "else scaleWidth > width");
deltaX = -(x + right);
} else {
TouchViewPagerImageView.b = true;
}
if (y + deltaY > 0) {
TouchViewPagerImageView.b = true;
Log.v("event", "y + deltaY");
deltaY = -y;
} else if (y + deltaY < -bottom) {
TouchViewPagerImageView.b = true;
Log.v("event", "y + deltaY < -bottom");
deltaY = -(y + bottom);
} else {
TouchViewPagerImageView.b = false;
}
}
/*Log.v("log_tag",height + " matrix "
+ (int) getHeightFromMatrix(matrix, TouchImageView.this));*/
matrix.postTranslate(deltaX, deltaY);
last.set(curr.x, curr.y);
}
break;
case MotionEvent.ACTION_UP:
Log.v("event", "ACTION_UP");
TouchViewPagerImageView.b = true;
mode = NONE;
int xDiff = (int) Math.abs(curr.x - start.x);
int yDiff = (int) Math.abs(curr.y - start.y);
if (xDiff < CLICK && yDiff < CLICK) {
Log.v("event", "ACTION_UP xDiff < CLICK && yDiff < CLICK");
performClick();
}
break;
case MotionEvent.ACTION_POINTER_UP:
//TouchImageView.b = false;
Log.v("event", "ACTION_POINTER_UP");
mode = NONE;
break;
case MotionEvent.ACTION_POINTER_3_DOWN:
Log.v("event", "ACTION_HOVER_MOVE");
break;
}
/*getLayoutParams().height = (int) getWidthFromMatrix(matrix,
TouchImageView.this);
getLayoutParams().width = (int) getHeightFromMatrix(matrix,
TouchImageView.this);*/
setImageMatrix(matrix);
invalidate();
return true;
}
});
}
@Override
public void setImageBitmap(Bitmap bm) {
super.setImageBitmap(bm);
if (bm != null) {
bmWidth = bm.getWidth();
bmHeight = bm.getHeight();
}
}
public void setMaxZoom(float x) {
maxScale = x;
}
private class ScaleListener extends
ScaleGestureDetector.SimpleOnScaleGestureListener {
@Override
public boolean onScaleBegin(ScaleGestureDetector detector) {
mode = ZOOM;
return true;
}
@SuppressLint("NewApi")
@TargetApi(8)
@Override
public boolean onScale(ScaleGestureDetector detector) {
float mScaleFactor = (float) Math.min(
Math.max(.95f, detector.getScaleFactor()), 1.05);
float origScale = saveScale;
saveScale *= mScaleFactor;
if (saveScale > maxScale) {
saveScale = maxScale;
mScaleFactor = maxScale / origScale;
} else if (saveScale < minScale) {
saveScale = minScale;
mScaleFactor = minScale / origScale;
}
right = width * saveScale - width
- (2 * redundantXSpace * saveScale);
bottom = height * saveScale - height
- (2 * redundantYSpace * saveScale);
if (origWidth * saveScale <= width
|| origHeight * saveScale <= height) {
matrix.postScale(mScaleFactor, mScaleFactor, width / 2,
height / 2);
if (mScaleFactor < 1) {
matrix.getValues(m);
float x = m[Matrix.MTRANS_X];
float y = m[Matrix.MTRANS_Y];
if (mScaleFactor < 1) {
if (Math.round(origWidth * saveScale) < width) {
if (y < -bottom)
matrix.postTranslate(0, -(y + bottom));
else if (y > 0)
matrix.postTranslate(0, -y);
} else {
if (x < -right)
matrix.postTranslate(-(x + right), 0);
else if (x > 0)
matrix.postTranslate(-x, 0);
}
}
}
} else {
matrix.postScale(mScaleFactor, mScaleFactor,
detector.getFocusX(), detector.getFocusY());
matrix.getValues(m);
float x = m[Matrix.MTRANS_X];
float y = m[Matrix.MTRANS_Y];
if (mScaleFactor < 1) {
if (x < -right)
matrix.postTranslate(-(x + right), 0);
else if (x > 0)
matrix.postTranslate(-x, 0);
if (y < -bottom)
matrix.postTranslate(0, -(y + bottom));
else if (y > 0)
matrix.postTranslate(0, -y);
}
}
return true;
}
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
width = MeasureSpec.getSize(widthMeasureSpec);
height = MeasureSpec.getSize(heightMeasureSpec);
// Fit to screen.
float scale;
float scaleX = (float) width / (float) bmWidth;
float scaleY = (float) height / (float) bmHeight;
scale = Math.min(scaleX, scaleY);
matrix.setScale(scale, scale);
setImageMatrix(matrix);
saveScale = 1f;
// Center the image
redundantYSpace = (float) height - (scale * (float) bmHeight);
redundantXSpace = (float) width - (scale * (float) bmWidth);
redundantYSpace /= (float) 2;
redundantXSpace /= (float) 2;
matrix.postTranslate(redundantXSpace, redundantYSpace);
origWidth = width - 2 * redundantXSpace;
origHeight = height - 2 * redundantYSpace;
right = width * saveScale - width - (2 * redundantXSpace * saveScale);
bottom = height * saveScale - height
- (2 * redundantYSpace * saveScale);
setImageMatrix(matrix);
}
/*public static void setPager(NonSwipeableViewPager pagerLeft) {
PagerLeft = pagerLeft;
}*/
}
my viewpager xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="@+id/imageView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY" />
</RelativeLayout>
where do i have to implement the TouchViewPagerImageView class???
try this :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<yourpackage_name.TouchViewPagerImageView
android:id="@+id/imageView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY" />
</RelativeLayout>
in your my_viewpager xml
also in your adapter class:
@Override
public Object instantiateItem(ViewGroup container, int position) {
TouchViewPagerImageView imgDisplay;
mLayoutInflater = (LayoutInflater) mContext
.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View itemView = mLayoutInflater.inflate(R.layout.activity_pager_items, container,
false);
imgDisplay = (TouchViewPagerIMageView) itemView.findViewById(R.id.imageView);
imgDisplay.setImageResource(mResources(position));
((ViewPager) container).addView(itemView);
return itemView;
}
problem with your TouchViewPagerIMageView
class
use this code:
public class TouchViewPagerIMageView extends ImageView {
Matrix matrix;
// We can be in one of these 3 states
static final int NONE = 0;
static final int DRAG = 1;
static final int ZOOM = 2;
int mode = NONE;
// Remember some things for zooming
PointF last = new PointF();
PointF start = new PointF();
float minScale = 1f;
float maxScale = 3f;
float[] m;
int viewWidth, viewHeight;
static final int CLICK = 3;
float saveScale = 1f;
protected float origWidth, origHeight;
int oldMeasuredWidth, oldMeasuredHeight;
ScaleGestureDetector mScaleDetector;
Context context;
public TouchImageView(Context context) {
super(context);
sharedConstructing(context);
}
public TouchImageView(Context context, AttributeSet attrs) {
super(context, attrs);
sharedConstructing(context);
}
private void sharedConstructing(Context context) {
super.setClickable(true);
this.context = context;
mScaleDetector = new ScaleGestureDetector(context, new ScaleListener());
matrix = new Matrix();
m = new float[9];
setImageMatrix(matrix);
setScaleType(ScaleType.MATRIX);
setOnTouchListener(new OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
mScaleDetector.onTouchEvent(event);
PointF curr = new PointF(event.getX(), event.getY());
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
last.set(curr);
start.set(last);
mode = DRAG;
break;
case MotionEvent.ACTION_MOVE:
if (mode == DRAG) {
float deltaX = curr.x - last.x;
float deltaY = curr.y - last.y;
float fixTransX = getFixDragTrans(deltaX, viewWidth,
origWidth * saveScale);
float fixTransY = getFixDragTrans(deltaY, viewHeight,
origHeight * saveScale);
matrix.postTranslate(fixTransX, fixTransY);
fixTrans();
last.set(curr.x, curr.y);
}
break;
case MotionEvent.ACTION_UP:
mode = NONE;
int xDiff = (int) Math.abs(curr.x - start.x);
int yDiff = (int) Math.abs(curr.y - start.y);
if (xDiff < CLICK && yDiff < CLICK)
performClick();
break;
case MotionEvent.ACTION_POINTER_UP:
mode = NONE;
break;
}
setImageMatrix(matrix);
invalidate();
return true; // indicate event was handled
}
});
}
public void setMaxZoom(float x) {
maxScale = x;
}
private class ScaleListener extends
ScaleGestureDetector.SimpleOnScaleGestureListener {
@Override
public boolean onScaleBegin(ScaleGestureDetector detector) {
mode = ZOOM;
return true;
}
@Override
public boolean onScale(ScaleGestureDetector detector) {
float mScaleFactor = detector.getScaleFactor();
float origScale = saveScale;
saveScale *= mScaleFactor;
if (saveScale > maxScale) {
saveScale = maxScale;
mScaleFactor = maxScale / origScale;
} else if (saveScale < minScale) {
saveScale = minScale;
mScaleFactor = minScale / origScale;
}
if (origWidth * saveScale <= viewWidth
|| origHeight * saveScale <= viewHeight)
matrix.postScale(mScaleFactor, mScaleFactor, viewWidth / 2,
viewHeight / 2);
else
matrix.postScale(mScaleFactor, mScaleFactor,
detector.getFocusX(), detector.getFocusY());
fixTrans();
return true;
}
}
void fixTrans() {
matrix.getValues(m);
float transX = m[Matrix.MTRANS_X];
float transY = m[Matrix.MTRANS_Y];
float fixTransX = getFixTrans(transX, viewWidth, origWidth * saveScale);
float fixTransY = getFixTrans(transY, viewHeight, origHeight
* saveScale);
if (fixTransX != 0 || fixTransY != 0)
matrix.postTranslate(fixTransX, fixTransY);
}
float getFixTrans(float trans, float viewSize, float contentSize) {
float minTrans, maxTrans;
if (contentSize <= viewSize) {
minTrans = 0;
maxTrans = viewSize - contentSize;
} else {
minTrans = viewSize - contentSize;
maxTrans = 0;
}
if (trans < minTrans)
return -trans + minTrans;
if (trans > maxTrans)
return -trans + maxTrans;
return 0;
}
float getFixDragTrans(float delta, float viewSize, float contentSize) {
if (contentSize <= viewSize) {
return 0;
}
return delta;
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
viewWidth = MeasureSpec.getSize(widthMeasureSpec);
viewHeight = MeasureSpec.getSize(heightMeasureSpec);
//
// Rescales image on rotation
//
if (oldMeasuredHeight == viewWidth && oldMeasuredHeight == viewHeight
|| viewWidth == 0 || viewHeight == 0)
return;
oldMeasuredHeight = viewHeight;
oldMeasuredWidth = viewWidth;
if (saveScale == 1) {
// Fit to screen.
float scale;
Drawable drawable = getDrawable();
if (drawable == null || drawable.getIntrinsicWidth() == 0
|| drawable.getIntrinsicHeight() == 0)
return;
int bmWidth = drawable.getIntrinsicWidth();
int bmHeight = drawable.getIntrinsicHeight();
Log.d("bmSize", "bmWidth: " + bmWidth + " bmHeight : " + bmHeight);
float scaleX = (float) viewWidth / (float) bmWidth;
float scaleY = (float) viewHeight / (float) bmHeight;
scale = Math.min(scaleX, scaleY);
matrix.setScale(scale, scale);
//Center the image
float redundantYSpace = (float) viewHeight - (scale * (float) bmHeight);
float redundantXSpace = (float) viewWidth - (scale * (float) bmWidth);
redundantYSpace /= (float) 2;
redundantXSpace /= (float) 2;
matrix.postTranslate(redundantXSpace, redundantYSpace);
origWidth = viewWidth - 2 * redundantXSpace;
origHeight = viewHeight - 2 * redundantYSpace;
setImageMatrix(matrix);
}
fixTrans();
}
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With