Achieve a scale function on the live version

Hello.

I would like to know if it may be possible to have a function of scale the elements or text, on the live version, like this:

I have found this https://github.com/nichollascarter/subjx as the closest example.

Thank you.
Ionut

For scaling, you can use Hype’s Drag feature.

Basically, set-up a new (relative) timeline and animate the scale of the main object to be scaled in it. Also, animate the position of the control points accordingly. Make sure to set keyframe interpolation as linear. Then, set the onDrag action for each control point to scrub the timeline.

This might not give you the best effect, but, that’s the only way I can think of doing thin natively within Hype. But, if you want demo level functionality, I’d say, use the script you provided.

4 Likes

Thank you very much for your answer, @Hrishikesh .
I will think about the Drag feature even now it is not clear for me how to create a timeline for each of the user intention to scale the element.

Unfortunately, I have not enough knowledge to integrate that script.

Thank you!

There would be a timeline containing an animation that has two keyframes - the first is the minimum value allowed for the drag and the second keyframe would be the maximum. Then you'd use an On Drag handler for the "handle" element to Control Timeline.

You'd repeat this for the vertical scale.

(I think there might be an issue with control timeline doing vertical and horizontal drags at the same time though, so if you want the corner scale handle to work you may wind up needing to do this in code)

Thank you very much!
Ionut

1 Like