Android Tutorial Pinch Zoom and Move View tutorial

[Class] Pinch Zoom and Move View

I had the need for my purposes to do the Pinch Zoom in contemporary Move to a View, now I put my code available to anyone who might be in need, just to get ideas on what to do.

Is required the library Gesture and Reflection of Agraham.

Events:
- Click
- LongClick
- Change

Property:
- CanMove
- CanZoom
- LimitArea
- LimitBorder
- Zoom

[UPDATE 1.00]
I changed the code in Class.

[UPDATE 1.10]
Added the following methods:
SetIfCanMove() - sets whether the View may translare or not.
GetIfCanMove - returns if the View can translate.
SetZoom() - sets the zoom.
GetZoom - returns the current zoom.

[UPDATE 1.20]
Improved zoom function, now the zoom is localized based on the touches.
Renamed Class in PinchZoomAndMove.

[UPDATE 1.30]
Added the possibility to set the BringToFront.
Added the possibility to set the Tag for a multi-View.
Added the "Click" event for the View.

[UPDATE 1.40]
Added the LongClick event for the View.
Added methods SetIfCanMove() - sets whether the View may zoom or not.
Inserted also Library version in Zip Class.
Changed the type of data sent with the Click events and LongClick.

[UPDATE 1.41]
Now works in Obfuscated mode. Thanks Informatix!
Improvements to minors.

[UPDATE 1.43]
Now the events are generated in different activity from the Main.
Added the following methods:
SetLimitBorder() - if it is True, the View will not come out from the edges of its parent.
SetLimitArea() - if True, the edges of the View will remain within its parent.

[UPDATE 1.44]
Added the Change event for the View.

[UPDATE 1.45]
Converted the property into methods for ease of use, but this requires a small change to the code of the old methods.

For suggestions and bug reports please do not hesitate to post it here.

 

[Dominex]

It seems you broke something with this version because I didn't succeed in moving or resizing anything on my different devices (I used the class version).
The Droid images are fun.

This is very strange, I have not changed the important functions of the class. I tried it with my devices, works on all. Strange indeed.

The class you've tried it with one of your projects?

Thanks but the images are not mine, I found them on the net.

 

[Informatix]

This is very strange, I have not changed the important functions of the class. I tried it with my devices, works on all. Strange indeed.

The class you've tried it with one of your projects?

Thanks but the images are not mine, I found them on the net.

I downloaded your demo and tried it. On three different devices (with different OS), no success.

 

[Dominex]

I downloaded your demo and tried it. On three different devices (with different OS), no success.

Ok, first things first. I enclose the previous version, check if it works please.

 

[Informatix]

Ok, first things first. I enclose the previous version, check if it works please.

Same result.

EDIT:
I found the problem. It was due to the obfuscation mode. I run always in this mode and it is not compatible with subs named without a "_". So the TouchGestures handler was never called. You should rename your sub to be compliant with the obfuscation mode.

 

[Dominex]

Same result.

EDIT:
I found the problem. It was due to the obfuscation mode. I run always in this mode and it is not compatible with subs named without a "_". So the TouchGestures handler was never called. You should rename your sub to be compliant with the obfuscation mode.

Excellent! Your help has been invaluable, bravo.

Could you explain better how do I rename the sub.

For example "TouchGesture" => "Touch_Gesture"?

EDIT:
Ok, I solved it. Later upload the correct version with some minor modifications.

 

[Dominex]

[UPDATE 1.41]

- Now works in Obfuscated mode. Thanks Informatix!
- Improvements to minors.

 

[Dominex]

[UPDATE 1.43]
Now the events are generated in different activity from the Main.
Added the following methods:
SetLimitBorder() - if it is True, the View will not come out from the edges of its parent.
SetLimitArea() - if True, the edges of the View will remain within its parent.

 

[socialnetis]

I'm using a Canvas over a ImageView to draw some lines, and also I will like to use this pinch to zoom class over the imageview (so i can zoom and draw better lines).
The problem is that if I have this Class, I can't use the Activity_touch event to draw lines anymore, even if I call the setIfCanMove(false) and setIfCanZoom(False)

Any Idea of how can I use this?

 

[Dominex]

I'm using a Canvas over a ImageView to draw some lines, and also I will like to use this pinch to zoom class over the imageview (so i can zoom and draw better lines).
The problem is that if I have this Class, I can't use the Activity_touch event to draw lines anymore, even if I call the setIfCanMove(false) and setIfCanZoom(False)

Any Idea of how can I use this?

The touch event takes precedence of class, if you want to use the touch to draw on the view you should modify the class so that I do what you want when there is only one touch. You can definitely do, but you need a good library Gesture knowledge.

 

[Dominex]

Excellent tutorial.thanks for sharing.

Thanks.

 

[socialnetis]

The touch event takes precedence of class, if you want to use the touch to draw on the view you should modify the class so that I do what you want when there is only one touch. You can definitely do, but you need a good library Gesture knowledge.

Thanks, I had already merge my code with the class touch event, so far is doing good. Thanks for the help!

 

[Ionut Indigo]

Move/Zoom Multiple Images At Once

Hi!
Can there be more than one images (like layers) initialized in a Pinch Zoom and Move View, so that all the images can zoom and move at the same time?

 

[Dominex]

Hi!
Can there be more than one images (like layers) initialized in a Pinch Zoom and Move View, so that all the images can zoom and move at the same time?

Unfortunately you can not do at the moment, you should modify the class to do it.

 

[Ionut Indigo]

Thank you Dominex, still it's a shame, but there is still hope if B4A supports that.

 

[Informatix]

Thank you Dominex, still it's a shame, but there is still hope if B4A supports that.

There's a possible solution: a layer drawable (AnimationPlus v2) bound to a Gesture Detector (v2) to handle the pinch gesture.

 

[Dominex]

[UPDATE 1.44]
Added the Change event for the View.

Thank you Dominex, still it's a shame, but there is still hope if B4A supports that.

With this event you can work with multiple layers, look at the example.

 

[Inman]

Thanks for the excellent class. I have an issue with positioning the image.

I have an imageview positioned as shown in the screenshot

http://i.imgur.com/wF8kKdz.jpg

I want to SetLimitArea as True so that the image doesn't get dragged out of the screen. But when I SetLimitArea(True), the image goes to the top-left corner of the screen and not where I positioned.

Can I retain my position?

 

[Dominex]

Thanks for the excellent class. I have an issue with positioning the image.

I have an imageview positioned as shown in the screenshot

http://i.imgur.com/wF8kKdz.jpg

I want to SetLimitArea as True so that the image doesn't get dragged out of the screen. But when I SetLimitArea(True), the image goes to the top-left corner of the screen and not where I positioned.

Can I retain my position?

For your needs you should use SetLimitBorder instead SetLimitArea.

 

[Ionut Indigo]

Hey,
I'm having a small issue with settings all the image layers on top of each other. They start with a small distance between then, and after i touch and try to move them, they align on top of each other.
I've changed the imv(c) aligment to :

imv(c).Left = 0
imv(c).top = 0

Is there another place where i have to modify the starting position?

 

[Dominex]

Hey,
I'm having a small issue with settings all the image layers on top of each other. They start with a small distance between then, and after i touch and try to move them, they align on top of each other.
I've changed the imv(c) aligment to :

imv(c).Left = 0
imv(c).top = 0

Is there another place where i have to modify the starting position?

Can you post a code example of where this is happening?
The class is independent of the View to which applies,, so you can change the settings in the normal way.