Develop Reference

onTouchListener is not working properly in ImageView

I am developing an android application, in my application I dynamically create some ImageViews and set that ImageViews in to a RelativeLayout. So I want to drag each image in the layout independently.Now its working but not properly, when I drag image then the image start vibrating and moving slowly. And I wanted to implement Pinch Zoom in this image.Is it possible? And how how can I remove the vibration on moving the image ? If any one know it please help me..
Thanks
This is my onTouchListener()
canvasImage[i].setOnTouchListener(new View.OnTouchListener() {
#Override
public boolean onTouch(View view, MotionEvent motionEvent) {
x1 = motionEvent.getX();
y1 = motionEvent.getY();
//Log.v("vvvvvv", "" + x1 + " " + y1);
final int action = motionEvent.getAction();
switch (motionEvent.getAction() & MotionEvent.ACTION_MASK) {
case MotionEvent.ACTION_DOWN:
String w = imglayout.getTop() + " " + imglayout.getHeight();
Log.v("wwww", "" + w);
x2 = motionEvent.getX();
y2 = motionEvent.getY();
dx = x2 - canvasImage[finalI].getX();
dy = y2 - canvasImage[finalI].getY();
//Log.v("cccccc", "" + x2 + " " + y2);
moving = true;
break;
case MotionEvent.ACTION_UP:
moving = false;
break;
case MotionEvent.ACTION_MOVE:
if (moving) {
canvasImage[finalI].setX(motionEvent.getX() - dx);
canvasImage[finalI].setY(motionEvent.getY() - dy);
//Log.v("qqqqqq", "" + canvasImage[finalI].getX());
}
break;
}
//mainLayout.invalidate();
return true;
}
});
This is my setCanvasImage() method used to set images into RelativeLayout
public void setCanvasImage() {
int screenSize = getResources().getConfiguration().screenLayout &
Configuration.SCREENLAYOUT_SIZE_MASK;
final int imgCount = dbobj.getFromTemp();
canvasImage = new ImageView[imgCount];
imglayout = (RelativeLayout) findViewById(R.id.canvas);
final String[] strImage = dbobj.getdImage();
imglayout.removeAllViews();
for (int i = 0; i < imgCount; i++) {
canvasImage[i] = new ImageView(this);
canvasImage[i].setTag("img_" + i);
boolean tabletSize = getResources().getBoolean(R.bool.isTablet);
if (tabletSize) {
int imgWidth = 130;
int imgHeight = 130;
RelativeLayout.LayoutParams paramss = new RelativeLayout.LayoutParams(imgWidth, imgHeight);
paramss.setMargins(posLeft, posTop, 0, 0);
canvasImage[i].setLayoutParams(paramss);
canvasImage[i].setScaleType(ScaleType.FIT_XY);
canvasImage[i].setTag(strImage[i]);
setImage(strImage[i], canvasImage[i]);
imglayout.addView(canvasImage[i]);
}
if( screenSize == Configuration.SCREENLAYOUT_SIZE_NORMAL){
int imgWidth = 100;
int imgHeight = 100;
RelativeLayout.LayoutParams paramss = new RelativeLayout.LayoutParams(imgWidth, imgHeight);
paramss.setMargins(posLeft, posTop, 0, 0);
canvasImage[i].setLayoutParams(paramss);
canvasImage[i].setTag(strImage[i]);
setImage(strImage[i], canvasImage[i]);
imglayout.addView(canvasImage[i]);
}
posLeft = posLeft + 15;
}
}
RelativeLayout xml file
<RelativeLayout
android:layout_below="#+id/btnhorscrolvw"
android:layout_width="match_parent"
android:layout_height="500dp"
android:id="#+id/canvas"
android:background="#ffff"
android:orientation="horizontal"
>
</RelativeLayout>

I think this will work.
float dX, dY;
#Override
public boolean onTouch(View view, MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
dX = view.getX() - event.getRawX();
dY = view.getY() - event.getRawY();
break;
case MotionEvent.ACTION_MOVE:
view.animate()
.x(event.getRawX() + dX)
.y(event.getRawY() + dY)
.setDuration(0)
.start();
break;
default:
return false;
}
return true;
}

You need to use scalx and scaley factor of imageview for implementing pinch zooming
imageview.setScaleX(scalefactor);
imageview.setScaleY(scalefacto);
Android you can adjust the margin left and margin top to for draging the imageview

I want to draw line while following finger

public boolean onTouchEvent(MotionEvent event) {
//Log.e(Codistan_Tag, "Touch Event: " + MotionEvent.actionToString(event.getAction()));
if(isImageReady) {
if(isSelectionDragEnabled)
mPanListener.onTouchEvent(event);
if (isZoomEnabled) {
if(event.getAction() == MotionEvent.ACTION_DOWN){
anchor_scale = mScaleFactor;
}
mScaleDetector.onTouchEvent(event);
mPanListener.onTouchEvent(event);
}
else {
switch (event.getAction()) {
case MotionEvent.ACTION_POINTER_3_DOWN:
break;
case MotionEvent.ACTION_POINTER_2_DOWN:
break;
case MotionEvent.ACTION_POINTER_1_UP:
break;
case MotionEvent.ACTION_DOWN:
if (isSelectionToolEnabled)
isDrawFinished = false;
orig_x = event.getX();
orig_y = event.getY();
//Log.e(Codistan_Tag, "-------ORIGIN-------s: " + String.valueOf(orig_x) + " " + String.valueOf(orig_y));
orig_x = (orig_x - (dest.left));
orig_y = (orig_y - (dest.top));
if(java.lang.Math.round(mScaleFactor) > 2) {
orig_x += (scale_cur_x * (riz_scale));
orig_y += (scale_cur_y * (riz_scale));
} else {
orig_x += (scale_cur_x);
orig_y += (scale_cur_y);
}
orig_x /= java.lang.Math.round(mScaleFactor);
orig_y /= java.lang.Math.round(mScaleFactor);
orig_x *= scale;
orig_y *= scale;
//mSelectionTaskManager.setOrigin((int) orig_x, (int) orig_y);
if(isSelectionToolEnabled)
MovementStack.add(new Pair((int)orig_x, (int)orig_y));
Log.e(Codistan_Tag, "Codistan Origins: " + String.valueOf(orig_x) + ", " + String.valueOf(orig_y));
break;
case MotionEvent.ACTION_MOVE:
max_dist = dist * scale;
if (event.getAction() != 1) {
move_x = event.getX();
move_y = event.getY();
//Log.e(Codistan_Tag, "Move: " + String.valueOf(move_x) + ", " + String.valueOf(move_y));
move_x = (move_x - dest.left);
move_y = (move_y - dest.top);
if(java.lang.Math.round(mScaleFactor) > 2) {
move_x += (scale_cur_x * riz_scale);
move_y += (scale_cur_y * riz_scale);
} else {
move_x += (scale_cur_x);
move_y += (scale_cur_y);
}
move_x /= java.lang.Math.round(mScaleFactor);
move_y /= java.lang.Math.round(mScaleFactor);
move_x *= scale;
move_y *= scale;
Log.e(Codistan_Tag, "Codistan Move: " + String.valueOf(move_x) + ", " + String.valueOf(move_y));
if (move_x >= 0 && move_y >= 0) {
if (!isSelectionToolEnabled && isDistortionEnabled) {
warpPhotoFromC(image, height, width, max_dist/mScaleFactor, orig_x, orig_y, move_x, move_y);
first++;
distortedBmp.setPixels(image, 0, width, 0, 0, width, height);
fg = false;
} else {
//Cut Tool Enabled
distortedBmp.setPixels(image, 0, width, 0, 0, width, height);
MovementStack.add(new Pair((int) move_x, (int) move_y));
}
}
}
orig_x = move_x;
orig_y = move_y;
break;
case MotionEvent.ACTION_UP:
if (isSelectionToolEnabled)
isDrawFinished = true;
break;
}
}
v.invalidate();
}
return true;
}
basically m taking the screen shot and applying cropping on it i m selecting the cropping area using finger to draw a portion to crop . when i left moving my finger then the line appear but i want the line to follow my finger

Create a customView over which you can draw the line.As it appears that this view should appear above your image then better extend it with Framelayout with same .And place it above image.
FingerLine.class
public class FingerLine extends FrameLayout {
private final Paint mPaint;
private float startX;
private float startY;
private float endX;
private float endY;
public FingerLine(Context context) {
this(context, null);
}
public FingerLine(Context context, AttributeSet attrs) {
super(context, attrs);
mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
mPaint.setStyle(Style.STROKE);
mPaint.setColor(Color.RED);
}
#Override protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
canvas.drawLine(startX, startY, endX, endY, mPaint);
}
#Override
public boolean onTouchEvent(#NonNull MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
startX = event.getX();
startY = event.getY();
invalidate();
break;
case MotionEvent.ACTION_MOVE:
endX = event.getX();
endY = event.getY();
invalidate();
break;
case MotionEvent.ACTION_UP:
endX = event.getX();
endY = event.getY();
invalidate();
break;
}
return true;
}
}
Note:Don't forget to call invalidate() because it will be responsible to call onDraw

canvas.drawLine not visible

I am trying to draw the lines of a sudoku grid using drawLine() but each line gets progressively more faint, to the point they are not visible about half way down the screen. screenshot of emulator
canvas.drawLine(0, (i + 1) * tileHeight,getWidth(), (i + 1) * tileHeight, gridPaint ); //horizontal lines
I know they are there because for a brief second when the screen is rotated, the lines are displayed as expected but then they disappear again.
I've tried various things to fix this but i still have no idea whats causing this
private static final String TAG = "Soduku";
private final Game game; //game logic
private float tileWidth;
private float tileHeight;
private int selX; //x index of selection
private int selY; //y index of selection
private Rect selRect = new Rect();
private Paint gridPaint = new Paint();
public PuzzleView(Context context) {
super(context);
this.game = (Game)context;
setFocusable(true);
setFocusableInTouchMode(true);
gridPaint.setColor(getResources().getColor(R.color.black));
}
#Override
protected void onSizeChanged(int w, int h, int oldW, int oldH) {
tileWidth = w / 9f;
tileHeight = h / 9f;
getRect(selX, selY, selRect);
Log.d(TAG, "onSizeChaned: width " + tileWidth + ", height " + tileHeight);
super.onSizeChanged(w, h, oldW, oldH);
}
private void getRect(int x, int y, Rect rect) {
rect.set((int) (x * tileWidth), (int) (y * tileHeight), (int) (x * Math.pow((double) tileWidth, 2)),
(int) (y * Math.pow((double) tileHeight, 2)));
}
#Override
protected void onDraw(Canvas canvas) {
invalidate();
Log.d("onDraw", "tileHeight - " + ((Float) tileHeight).toString());
for(int i = 0; i < 9; i++) {
canvas.drawLine(0, (i + 1) * tileHeight,getWidth(), (i + 1) * tileHeight, gridPaint ); //horizontal lines
canvas.drawLine((i + 1) * tileWidth, 0, (i + 1) * tileWidth, getHeight(), gridPaint); //vertical lines
}
}
#Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
Log.d(TAG, "onKeyDown: keyCode " + keyCode + ", keyEvent " + event);
switch(keyCode) {
case KeyEvent.KEYCODE_DPAD_UP:
select(selX, selY - 1);
break;
case KeyEvent.KEYCODE_DPAD_DOWN:
select(selX, selY + 1);
break;
case KeyEvent.KEYCODE_DPAD_LEFT:
select(selX - 1, selY);
break;
case KeyEvent.KEYCODE_DPAD_RIGHT:
select(selX + 1, selY);
break;
case KeyEvent.KEYCODE_0:
case KeyEvent.KEYCODE_SPACE: setSelectedTile(0); break;
case KeyEvent.KEYCODE_1: setSelectedTile(1); break;
case KeyEvent.KEYCODE_2: setSelectedTile(2); break;
case KeyEvent.KEYCODE_3: setSelectedTile(3); break;
case KeyEvent.KEYCODE_4: setSelectedTile(4); break;
case KeyEvent.KEYCODE_5: setSelectedTile(5); break;
case KeyEvent.KEYCODE_6: setSelectedTile(6); break;
case KeyEvent.KEYCODE_7: setSelectedTile(7); break;
case KeyEvent.KEYCODE_8: setSelectedTile(8); break;
case KeyEvent.KEYCODE_9: setSelectedTile(9); break;
case KeyEvent.KEYCODE_ENTER:
case KeyEvent.KEYCODE_DPAD_CENTER:
game.showKeypadOrError(selX, selY);
break;
default:
return super.onKeyDown(keyCode, event);
}
return true;
}
//locate the selected square
private void select(int x, int y) {
invalidate(selRect);
selX = Math.min(Math.max(x,0), 8);
selY = Math.min(Math.max(y,0), 8);
getRect(selX, selY, selRect);
invalidate(selRect);
}
#Override
public boolean onTouchEvent(MotionEvent event) {
if(event.getAction() != MotionEvent.ACTION_DOWN) {
return super.onTouchEvent(event);
}
select((int)(event.getX() / tileWidth), (int)(event.getY() / tileHeight));
game.showKeypadOrError(selX, selY);
Log.d(TAG, "onTouchEvent: x" + selX + ", y" + selY);
return true;
}
public void setSelectedTile(int tile) {
if(game.setTileIfValid(selX, selY, tile)) {
invalidate();
} else {
//number not valid for selected tile
Log.d(TAG, "setSelectedTile: invalid - " + tile);
startAnimation(AnimationUtils.loadAnimation(game, R.anim.shake));
}
}

Line is not drawing on Imageview in android

I want to draw a line on Imageview.for example when we select a particular text the text get colored under a line.this is my code.I am not able to see the line.and how to increase the width of this line
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_next);
imageView=(ImageView)findViewById(R.id.imageView1);
bitmap = getIntent().getExtras().getParcelable("name");
Display currentDisplay = getWindowManager().getDefaultDisplay();
float dw = currentDisplay.getWidth();
float dh = currentDisplay.getHeight();
//bitmap1 = Bitmap.createBitmap((int) dw, (int) dh,Bitmap.Config.ARGB_8888);
bitmap = bitmap.copy(Bitmap.Config.ARGB_8888, true);
canvas = new Canvas(bitmap);
paint = new Paint();
paint.setColor(Color.WHITE);
imageView.setImageBitmap(bitmap);
//for co-ordinate of the selected part of the image
imageView.setOnTouchListener(new OnTouchListener(){
#Override
public boolean onTouch(View v, MotionEvent event) {
int action = event.getAction();
x1 = (int) event.getX();
y1 = (int) event.getY();
x2 = (int) event.getX();
y2 = (int) event.getY();
switch(action){
case MotionEvent.ACTION_DOWN:
System.out.println("x1-cordinate"+x1+"y1-cordinate"+y1);
//startPt = projectXY((ImageView)v, bitmapMaster, x, y);
xstart=x1;
ystart=y1;
break;
/* case MotionEvent.ACTION_MOVE:
textSource.setText("ACTION_MOVE- " + x + " : " + y);
drawOnRectProjectedBitMap((ImageView)v, bitmapMaster, x, y);
break;*/
case MotionEvent.ACTION_UP:
System.out.println("x2-cordinate"+x2+"y2-cordinate"+y2);
canvas.drawLine(xstart, ystart, x2, y2, paint);
imageView.invalidate();
//drawOnRectProjectedBitMap((ImageView)v, bitmapMaster, x, y);
finalizeDrawing();
break;
}
/*
* Return 'true' to indicate that the event have been consumed.
* If auto-generated 'false', your code can detect ACTION_DOWN only,
* cannot detect ACTION_MOVE and ACTION_UP.
*/
return true;
}});`

I think you want something like this answer.
It will show like below

`
Button btnLoadImage;
TextView textSource, textInfo;
ImageView imageResult;
final int RQS_IMAGE1 = 1;
Uri source;
Bitmap bitmapMaster;
Canvas canvasMaster;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
btnLoadImage = (Button)findViewById(R.id.loadimage);
textSource = (TextView)findViewById(R.id.sourceuri);
imageResult = (ImageView)findViewById(R.id.result);
btnLoadImage.setOnClickListener(new OnClickListener(){
#Override
public void onClick(View arg0) {
Intent intent = new Intent(Intent.ACTION_PICK,
android.provider.MediaStore.Images.Media.EXTERNAL_CONTENT_URI);
startActivityForResult(intent, RQS_IMAGE1);
}});
imageResult.setOnTouchListener(new OnTouchListener(){
#Override
public boolean onTouch(View v, MotionEvent event) {
int action = event.getAction();
int x = (int) event.getX();
int y = (int) event.getY();
switch(action){
case MotionEvent.ACTION_DOWN:
textSource.setText("ACTION_DOWN- " + x + " : " + y);
drawOnProjectedBitMap((ImageView)v, bitmapMaster, x, y);
break;
case MotionEvent.ACTION_MOVE:
textSource.setText("ACTION_MOVE- " + x + " : " + y);
drawOnProjectedBitMap((ImageView)v, bitmapMaster, x, y);
break;
case MotionEvent.ACTION_UP:
textSource.setText("ACTION_UP- " + x + " : " + y);
drawOnProjectedBitMap((ImageView)v, bitmapMaster, x, y);
break;
}
/*
* Return 'true' to indicate that the event have been consumed.
* If auto-generated 'false', your code can detect ACTION_DOWN only,
* cannot detect ACTION_MOVE and ACTION_UP.
*/
return true;
}});
}
/*
* Project position on ImageView to position on Bitmap
* draw on it
*/
private void drawOnProjectedBitMap(ImageView iv, Bitmap bm, int x, int y){
if(x<0 || y<0 || x > iv.getWidth() || y > iv.getHeight()){
//outside ImageView
return;
}else{
int projectedX = (int)((double)x * ((double)bm.getWidth()/(double)iv.getWidth()));
int projectedY = (int)((double)y * ((double)bm.getHeight()/(double)iv.getHeight()));
Paint paint = new Paint();
paint.setStyle(Paint.Style.FILL);
paint.setColor(Color.WHITE);
paint.setStrokeWidth(3);
canvasMaster.drawCircle(projectedX, projectedY, 5, paint);
imageResult.invalidate();
textSource.setText(x + ":" + y + "/" + iv.getWidth() + " : " + iv.getHeight() + "\n" +
projectedX + " : " + projectedY + "/" + bm.getWidth() + " : " + bm.getHeight()
);
}
}
#Override
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
super.onActivityResult(requestCode, resultCode, data);
Bitmap tempBitmap;
if(resultCode == RESULT_OK){
switch (requestCode){
case RQS_IMAGE1:
source = data.getData();
textSource.setText(source.toString());
try {
//tempBitmap is Immutable bitmap,
//cannot be passed to Canvas constructor
tempBitmap = BitmapFactory.decodeStream(
getContentResolver().openInputStream(source));
Config config;
if(tempBitmap.getConfig() != null){
config = tempBitmap.getConfig();
}else{
config = Config.ARGB_8888;
}
//bitmapMaster is Mutable bitmap
bitmapMaster = Bitmap.createBitmap(
tempBitmap.getWidth(),
tempBitmap.getHeight(),
config);
canvasMaster = new Canvas(bitmapMaster);
canvasMaster.drawBitmap(tempBitmap, 0, 0, null);
imageResult.setImageBitmap(bitmapMaster);
} catch (FileNotFoundException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
break;
}
}
}
}`free draw on bitmap followed this link and now I am able to draw the line above the ImageView

dragging an image

I'm trying to make a floating joystick for my android game but am unable to do so.
Here is my onTouch() function:
#Override
public boolean onTouchEvent(MotionEvent event) {
int action = event.getAction();
c = holder.lockCanvas();
switch (action & MotionEvent.ACTION_MASK) {
case MotionEvent.ACTION_DOWN:
float x = event.getX();
float y = event.getY();
Log.d("joystick", " " + x + " " + y);
ondraw(c, x, y);
break;
case MotionEvent.ACTION_MOVE:
d = holder.lockCanvas();
float xdrag = event.getX();
float ydrag = event.getY();
Log.d("joystick move", " " + xdrag + " " + ydrag);
ondraw(d, xdrag, ydrag);
break;
}
return false;
}
for some reason the image is not dragging. can someone tell the problem here and help me?
my ondraw is:
protected void ondraw(Canvas c, float x, float y) {
c.drawColor(Color.BLACK);
c.drawBitmap(bmpback, x - (bmpback.getWidth() / 2),
y - (bmpback.getHeight() / 2), null);
c.drawBitmap(bmpfront, x - (bmpfront.getWidth() / 2),
y - (bmpfront.getHeight() / 2), null);
holder.unlockCanvasAndPost(c);
}

to drag an image something as easy as this works
#Override
public boolean onTouchEvent(MotionEvent event) {
x = event.getX();
y = event.getY();
//Log.d("joy", "x = " + x + "y =" + y);
invalidate();
return true;
}
#Override
protected void onDraw(Canvas canvas) {
canvas.drawBitmap(joyback, x - joyback.getWidth() / 2,
y - joyback.getHeight() / 2, null);
super.onDraw(canvas);
}