Skip to Content

Archived discussions are read-only. Learn more about SAP Q&A

Redraw Canvas on resize of parent container

Hi All,

I want to redraw canvas on page resize.

I have created sap.ui.core.HTML control who's content is one Canvas element. on afterRendering event i have draw canvas. which is working fine. I have set width to 100%(canvas) in CSS.
Problem is when user resize browser or switch from portrait to land scape mode the canvas context get shrink or streach. I want to redraw canvas on page resize. I tried follwoing but it didnt work

var html1 = new sap.ui.core.HTML("html1", {


                "<canvas id='myCanvas' class='test'></canvas>",

             afterRendering: oController.renderCanvas                    //Perfectly draw canvas base on current page size


html1.attachEvent("onresize", html1, oController.someFunToReDrawCanvas,null); // did not get fired at all. Also tried with "resize" word

Please let me know where I have made mistake or is there any other way by which I can call redraw Canvas function of controller.

Message was edited by: Michael Appleby

Former Member
Former Member replied

Thanks Dennis.

I hunted my error. I was trying to register re-size event in view init event which wont work as view is not yet created. But when I register it on controller onAfterRendering event it work perfectly.

Following is the code, that I have added in controller.js onAfterRendering Event

sap.ui.core.ResizeHandler.register(this.getView(), oController.someFunToReDrawCanvas);

Thanks once again Dennis and Jason.

0 View this answer in context
Not what you were looking for? View more on this topic or Ask a question