Bilbosax opened a new issue #1063: URL: https://github.com/apache/royale-asjs/issues/1063
So in my older Flex apps, I use Rectangles as backgrounds for my Groups so that I can have a background color. Now that I am trying to convert to Royale in the browser, I have to account for the fact that a browser window may be resized, so I listen for the resize event, and I adjust the size and position of some elements. In Flex, I had no problems changing the size of a Rectangle with Actionscript, but I have not been able to do it in Royale. The ONLY way that I have gotten Rectangle to work is if I declare its dimensions in MXML. Here is my code example: ``` <?xml version="1.0" encoding="utf-8"?> <j:Application xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.apache.org/royale/mx" xmlns:s="library://ns.apache.org/royale/spark" xmlns:j="library://ns.apache.org/royale/jewel" xmlns:js="library://ns.apache.org/royale/basic" xmlns:html="library://ns.apache.org/royale/html" xmlns:svg="library://ns.apache.org/royale/svg" xmlns:c="components.*" applicationComplete="appComplete(event)"> <fx:Script> <![CDATA[ import classes.AppVars; protected function appComplete(event:Event):void { //Set Initial State mainView.currentState = "props"; //Event Listeners mainView.addEventListener("sizeChanged", sizeChangedHandler) //Set Values AppVars.appWidth = this.width; AppVars.appHeight = this.height; headerGroup.width = AppVars.appWidth; headerGroup.height = AppVars.appHeight * .08; headerGroup.x = 0; headerGroup.y = 0; headerRect.width = AppVars.appWidth; headerRect.height = AppVars.appHeight * .08; headerRect.x = 0; headerRect.y = 0; dimensions.x = headerGroup.width - 100; dimensions.y = (headerGroup.height - dimensions.height)/2; props.width = AppVars.appWidth; props.height = AppVars.appHeight * .92; props.x = 0; props.y = AppVars.appHeight * .08; view.width = AppVars.appWidth; view.height = AppVars.appHeight * .92; view.x = 0; view.y = AppVars.appHeight * .08; } protected function sizeChangedHandler(event:Event):void { headerGroup.width = this.width; headerRect.width = this.width; props.width = this.width; props.height = this.height; view.width = this.width; view.height = this.height; } ]]> </fx:Script> <j:beads> <js:BrowserResizeHandler/> </j:beads> <j:initialView> <j:View localId="mainView" width="100%" height="100%"> <j:states> <js:State name="props" /> <js:State name="view" /> <js:State name="photos" /> </j:states> <j:beads> <js:SimpleStatesImpl/> </j:beads> <j:Group localId="headerGroup"> <svg:Rect localId="headerRect"> <svg:fill> <js:SolidColor color="#323233"/> </svg:fill> </svg:Rect> </j:Group> <c:props localId="props" visible.props="true" visible.view="false" visible.photos="false"/> <c:view localId="view" visible.props="false" visible.view="true" visible.photos="false"/> </j:View> </j:initialView> </j:Application> ``` As you can see, when the applicationComplete event fires, I try to set the dimensions of some of my components, and when "sizechanged" event is thrown, I try to resize some paramenters of my components. But they never work for <svg:Rect>. A Rectange is never displayed. The only way that I have been able to get the Rectangle to display is if I set the width and height parameters in MXML, then a Rectangle will display. Is this a bug, or am I doing something wrong? ---------------------------------------------------------------- This is an automated message from the Apache Git Service. To respond to the message, please log on to GitHub and use the URL above to go to the specific comment. For queries about this service, please contact Infrastructure at: [email protected]
