SAPUI5 HTML content with zoom controller (Pinch-to-Zoom)

[benlim]

Hi Expert,

I'm using sap.ui.core.HTML content to render my output. How can I implement a zoom function like the example circled in red in my HTML content?

Is there any pinch to zoom functionality in SAPUI5?

Regards,

-Ben-

[Ivan-Mirisola]

Hi Yen,

AFAIK, SAPUI5 doesn't have that on any "component". You have the full screen mode - that you can use on a split screen app to maintain focus on the detail pane. However, using standard Javascript and CSS3 you could achieve zoom in/out for an image. There are several examples like this one around if you google for this. Scale() from JQuery could be used on HTML5, but I have never tested it myself. I understand that this is not specific to HTML content. However, images, text elements and other screen components are not drawn by the browser maintaining the proportion when they are specified on an HTML page. So, if you really need to achieve something the same way as the Workflow Editor or Cloud iFlow Editor, your HTML should be replaced with something more robust (that you could control when objects need to be resized.

One script I have found that looks promising is Zoomooz. Take a look and let us know it it works with SAPUI5 as well (maybe on a blog 😉 ).

Regards,
Ivan

[benlim]

Hi @Ivan Mirisola,

I'm trying using Jquery resizeable. I'm having this HTML content. HTML content

How am I able to achieve resizeable option. Resizeable HTML

Thanks.

Regards,

Ben

[former_member1064245]

I am trying to use the jquery zoom magnify plugin to view image in zoom size