Hello.
I 've created an app and distributed it to some friends to test it.
I 've had a specific complain: in one of the pages of the app there is an image widget which is scrollable and it contains about 100 images. The complain was that in some of the images some elememts are not so clearly visible.
So I thought that it would help to make the image inside the widget zoomable, preferably with actions like click, double click, pinch or unpinch.
The image should be made zoomable inside the widget’s borders.
Any help on how to achieve this?
Thank you in advance.
To make an image zoomable within the borders of the screen width at double click, use the action below:
Source - Image
Event - Input > Double click
Target - Image
Action - Actions > Animation > Maximize
To zoom out, use “Minimize”.
Alternatively, to make an image zoomable beyond the borders of the screen width at double click, use the action below:
Source - Image
Event - Input > Double click
Target - Image
Action - Actions > Animation > Set scale (under “Arguments”, use a scale constant value greater than 1 but not more than 5)
To zoom out, use “Set scale” again but with a scale constant value of 1.
Thanks a lot felyks for your help.
I 've used your second instructions but I 've used different input for maximizing and minimizing the images because by putting Double click in both actions nothing happened. I think the program got “confused” since it didn’t know what to do with Double click, maximize or minimize.
Hello again.
Just one last issue.
I 've set separate actions for maximizing and minimizing the images in my image widget. I 've set the event for maximizing to Input>Press and for minimizing Input>Double click.
Everything works fine for the first image I choose but when I scroll to another image nothing happens.
Any idea what’s wrong?
Thanks again.
That’s probably because you have the “Maximizable” option unchecked under Interaction tab. Ensure that you select the image and check the box below before proceeding.
It works when “Double click” is used for both actions or when “Press” and “Double click” are used for both actions (i.e Maximize and Minimize).
However, to use “Double click” for both actions of “Set scale” (i.e to enlarge scale and reduce scale), the box must be unchecked and a condition must be added for the action to reduce scale only when scale size equals enlarged scale size; as below,
Thanks a lot felyks for your help.
It worked nicelly!!!
You’re welcome.
Glad it worked!