5 Replies Latest reply on Feb 12, 2010 2:52 PM by Evtim Georgiev (Adobe)

    Resizing a Flex 4 Component




      This is a duplicate post from stack overflow: http://stackoverflow.com/questions/2236245/dynamic-resizing-of-absolutely-drawn-flex-4-com ponent-drawing-code-generated-by


      I have some code generated by Flash Catalyst, and I need it to be resizable & rotatable.


      At the moment, I have no idea how to get this to happen.

      The basic idea is:

      • I have a windmill.
      • windmill contains windmillBlades.
      • windmillBlades rotate.
      • windmill resizes.
      • When the windmill resizes, the windmillBlades should scale dynamically with the windmill.


      The code below is a simplified outline of the structure of a demo app I prepared, ready to paste into your ide:




      Please check out the source and see if you can help because this is mission critical for me. :/




        • 1. Re: Resizing a Flex 4 Component
          timoxley Level 1

          Ok the code snippet got eaten. Just check out the link.

          • 2. Re: Resizing a Flex 4 Component
            kevinklin Adobe Employee



            It looks like you need to constrain the windmillBlades Group using left, right, top, bottom, or setting width and height to 100%. This way, when the windmill Group resizes, the windmillBlades will resize as well. Let me know if this helps!




            • 3. Re: Resizing a Flex 4 Component
              timoxley Level 1

              Sorry kevinklin, this doesn't help because the parent container is rectangular, when I rotate the blades, they warp to fit the container, which is REALLY bad! That was my first guess too.


              Any other ideas?

              • 4. Re: Resizing a Flex 4 Component
                timoxley Level 1

                I'm thinking my solution actually needs to employ some kind of scaleX and scaleY calculation.

                • 5. Re: Resizing a Flex 4 Component
                  Evtim Georgiev (Adobe)

                  hi timoxlev,


                  I took a look at your example. It seems to me that everything is positioned correctly in the initial state and you just want everything bigger, but you still want to keep all the sizes proportional. Maybe scaling uniformly the root node is all you need? This is how I modified your source and it seems to be working well for me:


                              private function button1_clickHandler(event:MouseEvent):void {
                                  if (!isResized) {
                                      windmill.scaleX = 2;
                                      windmill.scaleY = 2;
                                      isResized = true;
                                  } else {
                                      windmill.scaleX = 1;
                                      windmill.scaleY = 1;
                                      isResized = false;



                  1 person found this helpful