이미지 드래그해서 이동할때 이미지 이동 범위 지정문제

Question

뷰 안에 이미지를 띄웠습니다.

뷰 크기는 500px, 500px이며 이미지는 1000,1000 사이즈입니다.

이미지를 드래그하면 이미지가 이동하게하여 숨어져있던부분이 보이도록 구현했는데

이미지가 사이즈를 벗어나도 계속 움직여 이를 막아주고싶습니다.

 

말로 설명이 조금 어렵긴 한데,

500,500 사이즈의 뷰에 1000,1000 사이즈의 이미지가 들어가면 왼쪽상단 1/4만 표시되는데요

그상태에서 드래그해서 오른쪽으로 밀면 왼쪽에 아무것도 없는공간이 점점 커지는식이죠 ..

이런 아무것도 없는공간이 안나오게 하기 위해서는

이미지의 맨 왼쪽이(y값) 0일때 , 왼족으로 드래그가 안되게 하고싶은데

이미지가 뷰보다 커서 어떻게 해야할지 모르겠습니다.

 

혹시 도움좀주실수있으시면 답변부탁드립니다.

Answer 1

일단 터치 이벤트 부분의 소스를 말씀하셔야 답변이 될 것 같네요.

캔버스를 옮기는지, 뷰를 옮기는지, 아니면 매트릭스로 조절하는지 등등

그림을 옮기는 방법이 많기 때문에 각각의 방법에 따라 해당 기능 구현도 달라지게 됩니다.

Comments

소스가 복잡해 보셔도 도움이 될지 모르겠으나 어떻게 진행되냐면 ..
터치시 터치한 지점의 좌표를 저장하고, 무브하면 최초 터치지점의 좌표와 무브했을때 들어온 값의 거리를 재서 이미지를 그만큼 옮겨준 뒤 처음 터치위치 저장한 좌표를 그다음 무브 리스너를 통해 들어온값으로 대체합니다. 이런식으로 손가락이 이동한 거리만큼 이미지도 함께 이동시켜서 결과적으로 이미지가 움직이는것처럼 보이게 했는데요

뷰는 Surfaceview이고 그안에 비트맵이미지를 넣었습니다.

소스코드 필요하시다면 메일 알려주시면 보내드릴수있습니다.

도움 부탁드립니다

---

그 이미지가 '옮겨지는 과정' 에 대한 구체적인 내용이 필요합니다.

서피스면 아무래도 캔버스에 비트맵을 그리는 방식일건데,
이것도 캔버스를 이동 시키기도 하고,
비트맵 좌표를 수정하거나,
바운드 하거나,
매트릭스를 조절 하는 등 여러가지 방법이 있습니다.

소스는 전체가 필요한건 아니고요,
댓글로 터치 이벤트 (이미지 이동하는 부분)만 알려주시면 어느정도
답변이 될 것 같습니다.

---

죄송합니다. 주말간 메일을 확인하지 못해 늦었습니다.

비트맵 좌표 수정하는부분 소스는 다음과 같습니다.

꼭 이런방식으로 해야하는건 아니지만 다른방법은 생각이 안나 이렇게 구현했습니다.
//saveX는 최초에는 터치DOWN 발생시 해당 위치값을 가집니다.
//diffX,Y는 MOVE발생시 이동한곳의 좌표 - saveX를 하여
//얼마만큼 이동했는지의 값이 들어갑니다.
diffX = (event.getX() - saveX);
diffY = (event.getY() - saveY);
saveX = event.getX(); // 그리고 saveX,Y를 이동한 위치의 값으로 대체합니다
saveY = event.getY();
imgX = imgX + diffX;
imgY = imgY + diffY; //이미지의 위치를 기존이미지위치 + 이동폭을 해서 새로 그립니다.

//비트맵 부분
res = getResources();
tempBitmap = BitmapFactory.decodeResource(res, R.drawable.img30x30);
img = Bitmap.createScaledBitmap(tempBitmap, imgWidth, imgHeight, true);

//그리는부분
canvas.drawBitmap(img, imgX, imgY, p);


답변 기다리겠습니다

---

이미지의 위치를 기준으로 0,0 또는 캔버스 크기를 벗어날때 이동이 되지 않도록 하였습니다. 관심 가져주셔서 감사합니다.

---

우선 채택 감사드립니다.

직접 해결하셨다니 다행입니다.

많이 알지는 못하지만 질문하시면
아는 선에서 최대한 답변드릴 수 있도록 하겠습니다.

다시 한번 채택 감사드립니다.