I've got a Gallery class showing a bunch of images in an Android app, but since only one image is ever displayed at a time, it is difficult for the user to see when they have reached the first or last image in the gallery. Is there a way to mimic iOS' "rubber band" effect, so that the user sees a bit of empty space when dragging the last image, and they release it, the image snaps back to the center of the view. Is this possible to do?
Look into easing equations
http://www.gizma.com/easing/
when releasing the screen while been dragging the last image, you can use them to smoothly animate the image back to the center of the screen.
As for the effect while dragging the last image, use a multiplication factor on the position of the image so the more your finger reaches the side of the screen, the less the image will follow its movement.
Related
I am trying to have two images overlayed in two imageViews and when i start a swiping gesture the upper image is cropped vertically at the starting point of my touch gesture and the cropping line follows my gesture on screen to the left or right. When I move my finger to the right the cropping line should follow it and reveal more of the upper image for example, until I lift my finger from the screen. The crop should stay there then.
The goal ist to be able to compare two images with a swiping gesture.
I hope what I am trying to achieve is halfway understandable and I would be happy about any kind of input regarding that topic ;)
Thank you in advance
I have a custom photo gallary app which shows images from a specific folder.
what is not clear to me is how to navigate between images smoothly following the finger movement, like this:
As seen by touching the display and moving to left, current image moves also corresponds to the finger movement and depending on where finger is up, current photo is stayed or replaced by the next photo (I hope image is clear enough!).
Could anybody please explain me how to make this effect?
I have tested ImageSwitcher but it is not how I want: in onTouch() method, I can detect the gesture (moving to left or right) and using a proper animation change images, but it is not possible to smoothly follow the finger movement.
Well, you might not want to try it because you have already done some work on your implementation, but :
The easiest way is to use a ViewPager that handles the scroll (and creates/deletes views when needed) and just override the default transformation with a PageTransformer.
I made an Image Viewer with TouchImageView that I forked to my needs. In particular, you can fit the image vertically in the screen, and then drag the image from left to right. This is nice for a panorama, for example, that you can drag and see it all.
Now I want to do exactly this with panoramas without touching the screen, that is, an automatic constant drag.
I tried to implement this through a TranslateAnimation, but failed miserably: TranslateAnimation "moves the view", and the image is slowly being replaced with a growing black strip instead of more image.
Of course I can move the image 1 pixel, wait 1/100s, move again and so on, but there should be an easier way (and consuming less resources).
Is there some option in TranslateAnimation that allows to do this? How would you do it?
Thanks!!
I am trying to implement the zoom and drag features for an image viewer. So far I created the custom ImageView and implemented the actual features for pinch zoom and drag using the transformation matrix of the view. Now I want to animate the transition from the last position to a legal one (the user can drag the image where he/she wants but when it is released it should bounce back). If I just make modifications on the transformation matrix it works but, as I said, I want animations.
My problem is that if the image is out of the screen and I animate the view back the image is cut and remains truncated even after the animation is finished. I should mention that the image is set using the setImageUri method.
Does anyone have any idea on this one?
I would like to be able to view a rather large image (floor plan) that can be fully viewed by moving around the picture. When I click on the image, I would also like to get the coordinates on that image.
I've followed this tutorial 1 which works correctly and so allows me to move around the image. After that I also added some functionality to get the position of where I touch the screen. However, when moving around the image, black borders surround it (see picture below), which causes me to get incorrect coordinates.
So would somebody know how I could a) fix/remove the black borders when moving the image or b) correct the coordinates I receive by e.g. removing the border offset?
1 http://www.zdnet.com/blog/burnette/how-to-use-multi-touch-in-android-2-part-2-building-the-touch-example/1763
When you move around the image, set the scroll to stop before it reaches the edges of the image. Use this link for further details.
As for your coordinates, check these other 2 links: link1, link2.
Hope these would help you.