11) Show Image with features of Zoom, Drag and Slide
Subtasks:
i) Get the set of images and selected image position from Parent Activity and show selected image in ImageView.
activity_show_photo.xml
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".ShowPhoto">
<ImageView
android:id="@+id/imageView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginBottom="8dp"
android:layout_marginEnd="0dp"
android:layout_marginStart="0dp"
android:layout_marginTop="8dp"
android:adjustViewBounds="true"
android:scaleType="fitCenter"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
ShowPhoto.java
ImageView selectedImage;
ArrayList<String> searchFilesPath;
ArrayList<String> searchFilesName;
int selectedImagePosition;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_show_photo);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
selectedImage = (ImageView) findViewById(R.id.imageView);
try {
Intent intent = getIntent(); // get Intent which we set from Previous Activity
selectedImagePosition = intent.getIntExtra("selectedImagePosition",0);
searchFilesPath=intent.getStringArrayListExtra("searchFilesPath");
searchFilesName=intent.getStringArrayListExtra("searchFilesName");
//from file path
Bitmap myBitmap = BitmapFactory.decodeFile(searchFilesPath.get(selectedImagePosition));
selectedImage.setImageBitmap(myBitmap);
getSupportActionBar().setTitle(searchFilesName.get(selectedImagePosition));
}
catch(Exception e) {
Toast.makeText(this, e.toString(), Toast.LENGTH_LONG).show();
}
}
ii) setOnTouchListener to ImageView for Zoom, Drag and Slide Features.
ShowPhoto.java
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_show_photo);
selectedImage = (ImageView) findViewById(R.id.imageView);
selectedImage.setOnTouchListener(new View.OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
ImageView view = (ImageView) v;
view.bringToFront();
viewTransformation(view, event);
return true;
}
});
}
//====================================================================
//ImageView Zoom-in and Zoom-Out
//ZOOM (two finger) / ROTATION (two finger) / DRAG (Single finger)
//====================================================================
float[] lastEvent = null;
float d = 0f;
float newRot = 0f;
private boolean isZoomAndRotate;
private boolean isOutSide;
private static final int NONE = 0;
private static final int DRAG = 1;
private static final int ZOOM = 2;
private int mode = NONE;
private PointF start = new PointF();
private PointF mid = new PointF();
float oldDist = 1f;
private float xCoOrdinate, yCoOrdinate;
private int isPreviousMode = NONE;
private void viewTransformation(View view, MotionEvent event) {
switch (event.getAction() & MotionEvent.ACTION_MASK) {
case MotionEvent.ACTION_DOWN:
// executed after the user touch on the screen
xCoOrdinate = view.getX() - event.getRawX();
yCoOrdinate = view.getY() - event.getRawY();
start.set(event.getX(), event.getY());
isOutSide = false;
mode = DRAG;
lastEvent = null;
break;
case MotionEvent.ACTION_POINTER_DOWN:
oldDist = spacing(event);
if (oldDist > 10f) {
midPoint(mid, event);
mode = ZOOM;
}
lastEvent = new float[4];
lastEvent[0] = event.getX(0);
lastEvent[1] = event.getX(1);
lastEvent[2] = event.getY(0);
lastEvent[3] = event.getY(1);
//d = rotation(event);
break;
case MotionEvent.ACTION_UP:
// executed after the user release the touch on the screen
isZoomAndRotate = false;
if (mode == DRAG) {
float x = event.getX();
float y = event.getY();
if (isPreviousMode != ZOOM) {
if (start.x - x > 1) { //using start.x-x>1, not start.x>x because start.x>x executes in case of tapping also ()
selectedImagePosition = selectedImagePosition + 1;
if (selectedImagePosition <= maxImagePosition) {
selectedImage.setImageBitmap(BitmapFactory.decodeFile(searchFilesPath.get(selectedImagePosition)));
getSupportActionBar().setTitle(searchFilesName.get(selectedImagePosition));
isPreviousMode = NONE;
} else
selectedImagePosition = maxImagePosition;//when reach to last picture and thenafter move the finger again and again then selectedImagePosition values go to very high one by one therefore put the last picture index
} else if (x - start.x > 1) {
selectedImagePosition = selectedImagePosition - 1;
if (selectedImagePosition >= 0) {
selectedImage.setImageBitmap(BitmapFactory.decodeFile(searchFilesPath.get(selectedImagePosition)));
getSupportActionBar().setTitle(searchFilesName.get(selectedImagePosition));
isPreviousMode = NONE;
} else
selectedImagePosition = 0;
}
}
}
case MotionEvent.ACTION_OUTSIDE:
isOutSide = true;
mode = NONE;
lastEvent = null;
case MotionEvent.ACTION_POINTER_UP:
mode = NONE;
lastEvent = null;
break;
case MotionEvent.ACTION_MOVE:
// executed when user move the finger on the screen
if (!isOutSide) {
if (mode == DRAG) {
isZoomAndRotate = false;
if(isPreviousMode == ZOOM)
view.animate().x(event.getRawX() + xCoOrdinate).y(event.getRawY() + yCoOrdinate).setDuration(0).start();
}
if (mode == ZOOM && event.getPointerCount() == 2) {
float newDist1 = spacing(event);
if (newDist1 > 10f) {
float scale = newDist1 / oldDist * view.getScaleX();
view.setScaleX(scale);
view.setScaleY(scale);
isPreviousMode = ZOOM;
}
if (lastEvent != null) {
//newRot = rotation(event);
//view.setRotation((float) (view.getRotation() + (newRot - d)));
}
}
}
break;
}
}
private float rotation(MotionEvent event) {
double delta_x = (event.getX(0) - event.getX(1));
double delta_y = (event.getY(0) - event.getY(1));
double radians = Math.atan2(delta_y, delta_x);
return (float) Math.toDegrees(radians);
}
private float spacing(MotionEvent event) {
float x = event.getX(0) - event.getX(1);
float y = event.getY(0) - event.getY(1);
return (int) Math.sqrt(x * x + y * y);
}
private void midPoint(PointF point, MotionEvent event) {
float x = event.getX(0) + event.getX(1);
float y = event.getY(0) + event.getY(1);
point.set(x / 2, y / 2);
}
Subtasks:
i) Get the set of images and selected image position from Parent Activity and show selected image in ImageView.
activity_show_photo.xml
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".ShowPhoto">
<ImageView
android:id="@+id/imageView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginBottom="8dp"
android:layout_marginEnd="0dp"
android:layout_marginStart="0dp"
android:layout_marginTop="8dp"
android:adjustViewBounds="true"
android:scaleType="fitCenter"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
ShowPhoto.java
ImageView selectedImage;
ArrayList<String> searchFilesPath;
ArrayList<String> searchFilesName;
int selectedImagePosition;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_show_photo);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
selectedImage = (ImageView) findViewById(R.id.imageView);
try {
Intent intent = getIntent(); // get Intent which we set from Previous Activity
selectedImagePosition = intent.getIntExtra("selectedImagePosition",0);
searchFilesPath=intent.getStringArrayListExtra("searchFilesPath");
searchFilesName=intent.getStringArrayListExtra("searchFilesName");
//from file path
Bitmap myBitmap = BitmapFactory.decodeFile(searchFilesPath.get(selectedImagePosition));
selectedImage.setImageBitmap(myBitmap);
getSupportActionBar().setTitle(searchFilesName.get(selectedImagePosition));
}
catch(Exception e) {
Toast.makeText(this, e.toString(), Toast.LENGTH_LONG).show();
}
}
ii) setOnTouchListener to ImageView for Zoom, Drag and Slide Features.
ShowPhoto.java
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_show_photo);
selectedImage = (ImageView) findViewById(R.id.imageView);
selectedImage.setOnTouchListener(new View.OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
ImageView view = (ImageView) v;
view.bringToFront();
viewTransformation(view, event);
return true;
}
});
}
//====================================================================
//ImageView Zoom-in and Zoom-Out
//ZOOM (two finger) / ROTATION (two finger) / DRAG (Single finger)
//====================================================================
float[] lastEvent = null;
float d = 0f;
float newRot = 0f;
private boolean isZoomAndRotate;
private boolean isOutSide;
private static final int NONE = 0;
private static final int DRAG = 1;
private static final int ZOOM = 2;
private int mode = NONE;
private PointF start = new PointF();
private PointF mid = new PointF();
float oldDist = 1f;
private float xCoOrdinate, yCoOrdinate;
private int isPreviousMode = NONE;
private void viewTransformation(View view, MotionEvent event) {
switch (event.getAction() & MotionEvent.ACTION_MASK) {
case MotionEvent.ACTION_DOWN:
// executed after the user touch on the screen
xCoOrdinate = view.getX() - event.getRawX();
yCoOrdinate = view.getY() - event.getRawY();
start.set(event.getX(), event.getY());
isOutSide = false;
mode = DRAG;
lastEvent = null;
break;
case MotionEvent.ACTION_POINTER_DOWN:
oldDist = spacing(event);
if (oldDist > 10f) {
midPoint(mid, event);
mode = ZOOM;
}
lastEvent = new float[4];
lastEvent[0] = event.getX(0);
lastEvent[1] = event.getX(1);
lastEvent[2] = event.getY(0);
lastEvent[3] = event.getY(1);
//d = rotation(event);
break;
case MotionEvent.ACTION_UP:
// executed after the user release the touch on the screen
isZoomAndRotate = false;
if (mode == DRAG) {
float x = event.getX();
float y = event.getY();
if (isPreviousMode != ZOOM) {
if (start.x - x > 1) { //using start.x-x>1, not start.x>x because start.x>x executes in case of tapping also ()
selectedImagePosition = selectedImagePosition + 1;
if (selectedImagePosition <= maxImagePosition) {
selectedImage.setImageBitmap(BitmapFactory.decodeFile(searchFilesPath.get(selectedImagePosition)));
getSupportActionBar().setTitle(searchFilesName.get(selectedImagePosition));
isPreviousMode = NONE;
} else
selectedImagePosition = maxImagePosition;//when reach to last picture and thenafter move the finger again and again then selectedImagePosition values go to very high one by one therefore put the last picture index
} else if (x - start.x > 1) {
selectedImagePosition = selectedImagePosition - 1;
if (selectedImagePosition >= 0) {
selectedImage.setImageBitmap(BitmapFactory.decodeFile(searchFilesPath.get(selectedImagePosition)));
getSupportActionBar().setTitle(searchFilesName.get(selectedImagePosition));
isPreviousMode = NONE;
} else
selectedImagePosition = 0;
}
}
}
case MotionEvent.ACTION_OUTSIDE:
isOutSide = true;
mode = NONE;
lastEvent = null;
case MotionEvent.ACTION_POINTER_UP:
mode = NONE;
lastEvent = null;
break;
case MotionEvent.ACTION_MOVE:
// executed when user move the finger on the screen
if (!isOutSide) {
if (mode == DRAG) {
isZoomAndRotate = false;
if(isPreviousMode == ZOOM)
view.animate().x(event.getRawX() + xCoOrdinate).y(event.getRawY() + yCoOrdinate).setDuration(0).start();
}
if (mode == ZOOM && event.getPointerCount() == 2) {
float newDist1 = spacing(event);
if (newDist1 > 10f) {
float scale = newDist1 / oldDist * view.getScaleX();
view.setScaleX(scale);
view.setScaleY(scale);
isPreviousMode = ZOOM;
}
if (lastEvent != null) {
//newRot = rotation(event);
//view.setRotation((float) (view.getRotation() + (newRot - d)));
}
}
}
break;
}
}
private float rotation(MotionEvent event) {
double delta_x = (event.getX(0) - event.getX(1));
double delta_y = (event.getY(0) - event.getY(1));
double radians = Math.atan2(delta_y, delta_x);
return (float) Math.toDegrees(radians);
}
private float spacing(MotionEvent event) {
float x = event.getX(0) - event.getX(1);
float y = event.getY(0) - event.getY(1);
return (int) Math.sqrt(x * x + y * y);
}
private void midPoint(PointF point, MotionEvent event) {
float x = event.getX(0) + event.getX(1);
float y = event.getY(0) + event.getY(1);
point.set(x / 2, y / 2);
}
No comments:
Post a Comment