I have a GridView with images. On long click the screen gets dark (with black half transparent image that gets visible) and another image become visible that has the same resource of the image long clicked from the grid.
What i want is to be able to drag that image (which i have succeeded), but the image shows at the top corner (as i designed the layout in the XML) and I want it to show up where I clicked (To be precised, i want the center of the dragable picture to be where I perfumed the long click).
My image is fill_parent on FrameLayout and is set on matrix scale to control position...
this is the image part of the XML:
<ImageView
android:id="#+id/imgMainSelectedMovie"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scaleType="matrix"
android:visibility="invisible"
android:src="#drawable/escape" />
and this is the OnTouch() part:
public boolean onTouch(View v, MotionEvent ev) {
switch (ev.getAction()) {
case MotionEvent.ACTION_DOWN:
X = ev.getX();
Y = ev.getY();
if (longClicked) return true;
break;
case MotionEvent.ACTION_MOVE:
if (longClicked) {
if (!dragStarted) {
dragStarted = true;
myImageView.setX(X);
myImageView.setY(Y);
}
matrix.postTranslate((ev.getX() - X), (ev.getY() - Y));
X = ev.getX();
Y = ev.getY();
myImageView.setImageMatrix(matrix);
return true;
}
break;
case MotionEvent.ACTION_UP:
if (longClicked) {
dark.setVisibility(View.INVISIBLE);
myImageView.setVisibility(View.INVISIBLE);
longClicked = false;
return true;
}
}
return false;
}
thist is what I tried to solve the problem:
if (!dragStarted) {
dragStarted = true; //Changed to true when OnItemLongClick called
myImageView.setX(X);
myImageView.setY(Y);
}
But it only changes the "start point" of the image layout to the entered X and Y.
Problem solved :)
What I did is when onItemLongClick calls I took the X and Y measured from the ACTION_DOWN case in the onTouch, took the matrix current location and did postTranslate to the coordinates from the ACTION_DOWN minus the location of the image.
this is the solution part from the onItemLongCliick:
matrix.getValues(values);
matrixX = values[Matrix.MTRANS_X];
matrixY = values[Matrix.MTRANS_Y];
matrix.postTranslate(X-matrixX, Y-matrixY);
myImageView.setImageMatrix(matrix);
I'm wondering why they didn't put some kind of "setPlace" method for matrix...
Related
I want to animate a ShadowView to some coordinates (to destination view).
I'm using D&D and if user drops (DragEvent.ACTION_DROP) then the view in some area I want to animate the view (from the drop location) to some destination view.
I don't want to animate view from the source location but want to do from the DROP location.
I tried a lot of things but nothing works. How can I get access to the ShadowView? This also not working:
EventDragShadowBuilder.getView()
I think TranslateAnimation should work for this but I need access to the "shadow" view during the D&D.
Image:
First implement onTouchlistener on the view
llDragable.setOnTouchListener(this);
Make a view draggable
#Override
public boolean onTouch(View view, MotionEvent event) {
float dX = 0;
float dY = 0;
switch (view.getId()){
case R.id.dragableLayout :{
switch (event.getActionMasked()) {
case MotionEvent.ACTION_DOWN:
dX = view.getX() - event.getRawX();
dY = view.getY() - event.getRawY();
lastAction = MotionEvent.ACTION_DOWN;
break;
case MotionEvent.ACTION_MOVE:
view.setY(event.getRawY() + dY);
view.setX(event.getRawX() + dX);
lastAction = MotionEvent.ACTION_MOVE;
break;
case MotionEvent.ACTION_UP:
//Animate
animate();
if (lastAction == MotionEvent.ACTION_DOWN)
//Toast.makeText(DraggableView.this, "Clicked!", Toast.LENGTH_SHORT).show();
break;
default:
return false;
}
return true;
}
}
return false;
}
Then you can use object animator at case MotionEvent.ACTION_UP using object animation . You need to have the position of the destination.
private void animate() {
Path path = new Path();
path.moveTo(destinationX, destinationY);
path.lineTo(destinationX, destinationY);
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(mButton, View.X, View.Y, path);
objectAnimator.setDuration(duration);
objectAnimator.setInterpolator(new LinearInterpolator());
objectAnimator.start();
}
One possible thing could be
once the drag event has finished, you can move the "view" to the location of the drop and then you can start an animation to move the view from the dropped location to the destination.
Keep in mind here the drag shadow is not being animated but the view itself is being animated.
As a workaround, you can try to add a selector with transparent and black-gradient drawables, depended on appropriate state. In this case you will decide, when your "shadow" should be shown and when it should be gone.
Here is a question about "shadow" bordered layouts:
Android LinearLayout : Add border with shadow around a linearLayout
Don't sure, is it a good way... But it might work.
Good luck!
Create a duplicate view of the one you are dragging. Once drag ends, you get the location or drop off co-ordinates of the view. Once this happens, set the visibility of your "real" view to View.INVISIBLE. Then set the x and y of the temp invisible view to that of the drop-off point and make it visible. After that, create a translate animation that animates the temp view to the desired position, and don't forget to set the setFillEnabled and setFillAfter properties of the translate animation to true.
Ok, so I am making a simple app on a surfaceView where I have a bitmap of a ball that goes from the top of the screen to the bottom. Once it gets to the bottom it appears at the top again where it starts to fall back down again.
Next I tried to make it so that when I clicked the ball when it was falling down it would go back to the top of the screen. However, I am having a problem with this because I can't click it (because its only one pixel, I think). I set an onTouchListener to the getX() and getY() coordinates of the click, and if the x and y coordinatesof the click are equal to the x and y of the current position of the ball then the ball goes back to the top of the screen.
This doesnt work though. Because in order for me to be able to click the ball I would have to click the exact center pixle that the ball was on at that time. So my question is how do I say: If the click is close to, or approximately equal to the current position of the ball then go back to the top. I am a noob with this so if I am asking dumb questions I apologize, I'm trying my best to learn. And thank you very much for the help. I appreciate it.
It should work for you. Just override the onTouch method.
#Override
public boolean onTouch(View v, MotionEvent me)
{
try
{
Thread.sleep(50);
} catch (InterruptedException e)
{
e.printStackTrace();
}
switch (me.getAction())
{
case MotionEvent.ACTION_DOWN:
x = me.getX();
y = me.getY();
break;
case MotionEvent.ACTION_UP:
x = me.getX();
y = me.getY();
break;
case MotionEvent.ACTION_MOVE:
x = me.getX();
y = me.getY();
break;
case MotionEvent.ACTION_OUTSIDE:
x = 100;
y = 200;
break;
}
return true;
}
Here is my scenerio. Wherever you touch my screen, an circle is drawn, and when you lift your finger/stylus of the screen, the circle disappears. This is fine, but the problem now is if you touch, then move, the circle will not update to the new position of your finger/stylus. It will just stay at the original touch position regardless of movement until you lift your finger/stylus off the screen.
How am I able to get the circle(cursor) to redraw or move itself to the new position of your finger/stylus? Here is my code:
rLO.setOnTouchListener(new View.OnTouchListener() {
#Override
public boolean onTouch(View v, MotionEvent event) {
switch(event.getAction()){
case MotionEvent.ACTION_DOWN:
cursor.x = (int)event.getX() - (cursor.radius / 2);
cursor.y = (int)event.getY() - (cursor.radius / 2);
cursor.onDraw(cursor.e);
rLO.addView(cursor);
break;
case MotionEvent.ACTION_UP:
rLO.removeView(cursor);
break;
case MotionEvent.ACTION_MOVE:
}// end switch
return true;
}
});
Thanks in advance!
can any one help me how to drag and drop the text view on entire image view. i found from this drag n drop textview in android here the text view is static, in my app textview and image view's are dynamically change. `#Override
public boolean onTouchEvent(MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
// Remember our initial down event location.
startX = event.getRawX();
startY = event.getRawY();
break;
case MotionEvent.ACTION_MOVE:
float x = event.getRawX();
float y = event.getRawY();
// Calculate move update. This will happen many times
// during the course of a single movement gesture.
scrollByX = x - startX; //move update x increment
scrollByY = y - startY; //move update y increment
startX = x; //reset initial values to latest
startY = y;
invalidate(); //force a redraw
break;
}
return true; //done with this event so consume it
}
i wright this code, but it's not working properly.
You can always change the image and text of existing view programatically using setText sort of methods.
There are many drag and drop tutrials if you google it. strongly suggest you try them out.
Basically what you do is implement a OnTouchListener on the TextView like
textview.setOntouchListener(listen);
OnTouchListener onThumbTouch = new OnTouchListener()
{
#Override
public boolean onTouch(View v, MotionEvent event)
{
switch(v.getId())
{
case R.id.slider_thumb_id:
{
switch(event.getAction())
{
case MotionEvent.ACTION_MOVE:
{
}
case MotionEvent.ACTION_UP:
{
}
}
break;
}
}
return true;
}
};
Here from the event attribute you get the value of x and y and the touch event and
use that to alter the position of the textview. I did it by add add/subtracting the margin values.
EDIT:
This is what I did to update the position of my view
Look event.getRawY(); is going to give you the distance from the parent view. So if I get event.getRawY() = 50. I know I need the text view to be 50 pixels from the top.
LinearLayout.LayoutParams iconParams = (LinearLayout.LayoutParams)
v.getLayoutParams();
iconParams.topMargin = 50;
v.setLayoutParams(iconParams);
So now the view that i selected is 50 px from the top of the parent view.
Now I have an ImageView and its a circle which is at the slightly below than center position (But this should not matter).
I have written code onTouch of ImageView for ACTION_DOWN,ACTION_UP ,now consider as user have put finger on circle and move and move.... I want to active some code when user move finger and exceed the region of CIRCLE image(As soon as user exceed the region the code should be ececuted onlly once)
Here is my code
ImageView view1 = (ImageView) findViewById(R.id.fccircledetectionarea);
view1.setOnTouchListener(new OnTouchListener()
{
#Override
public boolean onTouch(View v, MotionEvent event)
{
ImageView imageView=(ImageView) findViewById(R.id.fccircledetectionarea);
switch(event.getAction())
{
case MotionEvent.ACTION_DOWN:
final float x=imageView.getTop();
Toast.makeText(PlayScreen.this, "Top Position:"+x, Toast.LENGTH_SHORT).show();
break;
case MotionEvent.ACTION_UP:
Toast.makeText(PlayScreen.this, "Over", Toast.LENGTH_SHORT).show();
break;
case MotionEvent.ACTION_MOVE:
Toast.makeText(PlayScreen.this, "Over", Toast.LENGTH_SHORT).show();
break;
}
return true;
}
});
I cannot archive my goal through ACTION_MOVE: as it start to work if user move finger within the circle
And my second query is that How to set alpha of this imageview I have used
view1.setAlpha(0);
But is not working and I have also made this imageview invisible but than my onTouch code is not working
Within your onTouch method record a boolean to check if the user is touching within the bounds of the circle.
boolean inCircle = java.lang.Math.sqrt(x*x + y*y) <= circleRadius
Where x is taken from event.getX() - circleCenterX and y is taken from event.getY() - circleCenterY (touch position's offset from center of the circle)