{"id":44,"date":"2008-04-01T08:48:04","date_gmt":"2008-04-01T08:48:04","guid":{"rendered":"http:\/\/todepoint.com\/blog\/?p=44"},"modified":"2008-04-01T08:48:04","modified_gmt":"2008-04-01T08:48:04","slug":"resizemanager-simple-scaling-engine","status":"publish","type":"post","link":"https:\/\/todepoint.com\/blog\/2008\/04\/01\/resizemanager-simple-scaling-engine\/","title":{"rendered":"ResizeManager – simple scaling engine for MovieClips"},"content":{"rendered":"

Flash objects (SWF) can fill the entire Html body, and scale along with browser window as you resize it (it’s done by setting width<\/strong> and height<\/strong> attributes to 100% in the embed tags). However unless scaleMode<\/a> is properly defined as well, the outcome may look surprisingly bad, the flash content may loose proportions and distort, images quality drops and texts loose readability.. oh man.<\/p>\n

Only specific contents should be scaled when the stage is resized, the same way apps handles resizing: an app will redistribute its panels without scaling them, will scale panel background but not the buttons and the controls in it. When the entire stage is simply scaled, the interface balance is disturbed.. and we don’t want that.<\/p>\n

So I decided to share: ResizeManager<\/strong> (download<\/a>) is a very simple scaling engine, a single AS2 class that can easily be modified or extended for your needs.
\nThe manger can control scaling<\/strong> and some basic align<\/strong> options of MovieClips you register to it, so you can scale a background MovieClip to cover the entire stage, and keep another MovieClip centered without scaling. It also adds default definitions for the Stage behavior (scaleMode: noScale, stageAlign: TL), though you can change those.
\nIn order to use it, simply import the class and create an instance of the ResizeManager:
\n
\nimport com.adifeiwel.custom_ui.ResizeManager;<\/p>\n

var rm = new ResizeManager();
\n<\/code><\/p>\n

Then, use method registerMC()<\/strong> to register each MovieClip you want to control (including MovieClips nested within MovieClips, make sure parent MC is x:0, y:0), the registerMC method expects the following parameters:
\n _parentName<\/strong>:MovieClip<\/code> (the name of the MoviClip)
\n _widthUpdate<\/strong>:Number<\/code> (scaling in percentage from Stage.width, 0 for no-scale)
\n _heightUpdate<\/strong>:Number<\/code> (scaling in percentage from Stage.height, 0 for no-scale)
\n _centerUpdate<\/strong>:Boolean<\/code> (align MovieClip to center of stage)
\n _middleUpdate<\/strong>:Boolean<\/code> (vertical-align MovieClip to middle of stage)<\/p>\n

for example (see it here<\/a>):
\n
\nrm.registerMC(portMC.mainBG, 100, 100, false, false);
\n\/\/ will scale to cover all Stage<\/p>\n

rm.registerMC(portMC.middleMC.middleBG, 100, 0, false, false);
\n\/\/ will scale to take 100% of Stage.width<\/p>\n

rm.registerMC(portMC.middleMC.middleContentMC, 0, 0, true, false);
\n\/\/ aligned to center<\/p>\n

rm.registerMC(portMC.transMC, 0, 0, true, true);
\n\/\/ aligned to center, vertical-align to middle.<\/p>\n

rm.registerMC(portMC.vClip, 0, 80, false, false);
\n\/\/ will scale to take 80% of Stage.height
\n<\/code><\/p>\n

enjoy : )<\/p>\n

Update:<\/strong> You can download the example FLA here<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"

Flash objects (SWF) can fill the entire Html body, and scale along with browser window as you resize it (it’s done by setting width and height attributes to 100% in the embed tags). However unless scaleMode is properly defined as well, the outcome may look...<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[4,10,16,29],"tags":[],"_links":{"self":[{"href":"https:\/\/todepoint.com\/blog\/wp-json\/wp\/v2\/posts\/44"}],"collection":[{"href":"https:\/\/todepoint.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/todepoint.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/todepoint.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/todepoint.com\/blog\/wp-json\/wp\/v2\/comments?post=44"}],"version-history":[{"count":0,"href":"https:\/\/todepoint.com\/blog\/wp-json\/wp\/v2\/posts\/44\/revisions"}],"wp:attachment":[{"href":"https:\/\/todepoint.com\/blog\/wp-json\/wp\/v2\/media?parent=44"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/todepoint.com\/blog\/wp-json\/wp\/v2\/categories?post=44"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/todepoint.com\/blog\/wp-json\/wp\/v2\/tags?post=44"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}