Move imageview smoothly - android

I am trying to build an app that has an imageview in it. The user can drag the imageview horizontally to some position on screen using below code:
#Override
public boolean onTouchEvent(MotionEvent event){
img.getLocationOnScreen(viewCoords);
newimgpos[0]=event.getX()-(viewCoords[0]-img.getX());
img.setX(newimgpos[0]);
}
Now, I want that when user lifts up his finger off the screen, the imageview be moved back to x=0. I can directly set the x coordinate of the imageview to be zero but it looks like a very abrupt change; I want the imageview to move smoothly to x =0. Can this be done? I tried using below logic:
for(int i= (int)newimgpos[0]; i>=0; i--){
img.setX(i);
}
It moves and I can see the actual movement; still it is not smooth enough.

You need to use Animation here. Check the following thread for more info: Android translate animation - permanently move View to new position using AnimationListener

Related

Android prevent views overlap on drag and drop

I am adding some ImageViews to a relative layout dynamically (on touch points)
Any ImageView has an OnTouchListener. In Action Move I move the ImageView(sth like Drag and Drop).
My problem is that ImageViews may overlap each other when they are moving. I want to prevent them from overlap in any way! (best is stop moving when collision happen)
Look at this image
All ImageViews are saved in a link list. I get the x & y of moving view and compare it with other views and if they had collision don't let them moving.
But I want that user can make them separate again. How can I do this work?
In brief when views collision happen I don't let them move any more but I want if the move was making them far from each other it happens.
Try this
Rect rc1 = new Rect();
imageView1.getDrawingRect(rc1);
Rect rc2 = new Rect();
imageView2.getDrawingRect(rc2);
if (Rect.intersects(rc1, rc2) {
// intersection is detected
// here is your method call
}

Android finding X and Y in tween animation

i have a drawable frame animation and i also implement tween animation on it. In drawable animation my sprites it walking without moving its location. and through tween animation it is moving from x 1% to x 100%.
the code of both animation is as
Animation movement = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.animationball);
anim.startAnimation(movement);
anim.setBackgroundResource(R.drawable.smurf);
AnimationDrawable walking = (AnimationDrawable) anim.getBackground();
walking.start();
it is working fine and my animation gives illusion that m sprite walking from left to right.
now i wanted to get X and Y location of this animated sprite at every pixel of its movement path.
i implements runnable on same activity class and the code of its run() method is as below
#SuppressLint("NewApi") #Override
public void run() {
tv.setText(""+ anim.getX());
}
then i start the thread in onCreate method as
Thread t = new Thread(this);
t.start();
in run() method tv is a TextView and i wanted to observe the locations through it. but it always showing 0.0
i am unable to understand it why it is not showing the x locations ?
With tween animation or AnimationDrawble and View Animation (Animation class), the animated view's "real" position is not changed even though the view is animated to a different location, for example, you can create a button and animate it to the right side of the screen, but when you click along on the button when it is moving, it will not get depressed, but if you press its initial position (even if the button is not there), the button will get depressed. If you want to also invalidate the view's position, use the new Property Animation, click HERE for more detail.

Get coordinates of imageview during animation android

I am trying make an animation of an imageView from left to right and get it back from right to left but I also want to get the position of the imageview while its animation from the following code. I want to use the coordinates from origin to display in my app. Please tell me how to do this. Following is the code I am using to animate and move position of imageview.
Animation anx = new TranslateAnimation(0,100,0, 0);
anx.setDuration(2000);
anx.setFillAfter(true);
myImage.startAnimation(anx);
Is there a function like getX() and getY() to get position.
Have u tried to set animation listener and starting a runnable when the animation starts to check the image getx , gety every milliseconds u want and stop it after the animation ends

Implement different clickable Area on an image-page through image map

A B C D
E F G H --figure.
I am working on Book App on Android. In my book App, there are many images-pages. In first image-page there are 26 alphabets(A-Z),4 alphabets in a raw(as shown in my picture).
My Problem is:
I want to developed a click-able area for each and every alphabets (A-Z) . when user click or touch on any of alphabet then a square box should be appear like "image A is clicked"(shown in above figure).
On every touch or click on alphabets images(A-Z) i will pass corresponding sound. Means i want to call different-different Listeners for different-different area on a single image-page.
i have no idea about how to implement click-able area on an image which click able area or coordinates doesn't vary emulator to emulator.
please provide me some sample code or an idea or reference link.
Thank in Advance
I remember answering a very similar question just a few days ago. In order to implement this as the image, you'll need to know what areas of the image mean what (i.e. if you get coordinates of of a touch event, which action these coordinates would correspond to). Provided you have this info, you can then register OnTouchListener with your ImageView:
imageView.setOnTouchListener(new OnTouchListener() {
public boolean onTouch (View v, MotionEvent event) {
int x = event.getX();
int y = event.getY();
//now deal with coordinates (x, y)
}
});
However in your case, I would suggest using a layout with 26 buttons and just use OnClickListener with each of them. You can easily set the buttons up in the shape you want and you can easily set individual background drawables to them to make it look as one whole image.

Android: Creating shaped button

How can I create a custom button like this?
It should be just clickable area not a real button.
I use a crapload of irregular shaped buttons on my app, and to change the "hot zone" or "clickable area" of the button, I just use the Bitmap.getPixel() method to check for alpha on the image used. If the method returns 0, then don't perform click event.
Example:
(1) Create your button as usual, whichever way you would like.
(2) Define a Bitmap and assign to it the same image drawable used for the button.
(3) Get the X and Y coordinates of the touch or click action.
(4) Pass the coordinates to the .getPixel(x,y) method.
Sample Code:
// ** Declare your Bitmap somewhere **
final Bitmap TheBitmap;
TheBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.TheImage);
// ** My onTouch code **
public boolean onTouch(View v, MotionEvent event) {
int eventPadTouch = event.getAction();
switch (eventPadTouch) {
case MotionEvent.ACTION_DOWN:
if (iX>=0 & iY>=0 & iX<TheBitmap.getWidth() & iY<TheBitmap.getHeight()) { // ** Makes sure that X and Y are not less than 0, and no more than the height and width of the image.
if (TheBitmap.getPixel(iX,iY)!=0) {
// * A non-alpha area was clicked, do something
}
}
return true;
}
return false;
}
The event.getX() and event.getY() simply give you the coordinates of where you touched the button.
** The above sample is to guide you in the correct direction. There are some checks to add to the code to assure no errors occur.
ceate using your own canvas or make a image using photoshop like this and then using Bitmap.createScaledBitmap scale it according to dimension of your button and hence you will get this button.
using canvas you have to write more code just do this it will work fine
Simply just create an image like that and you can use either ImageView or Button w/o text, and implement an OnClickListener. It just works!
save that as a png and and put it in your drawables folder. Then in your xml use something like this
<Button
android:height="wrap_content"
android:width="wrap_content"
android:background="#drawable/your_png"
/>
I am not 100% positive that the corner cut out is going to work properly. That corner area that is gone may end up being clickable. If that is the case and if you don't want it to be then you'll have to slice your picture in half somewhere create two buttons that you can set next to each other to make up that shape and use the same click listener for both. From the users perspective it will still seem like one button.

Categories

Resources