1 Reply Latest reply on Aug 2, 2007 6:16 AM by MacFlex

    Clippping the children in a canvas very odd


      I have been playing with Flex Builder 2 and have come across some very odd behaviour. I have an application with a panel and two canvases, one canvas inside the other which allows me to move the inner canvas and hence its contents and it looks quite good.

      In the inner Canvas I add Sprites dynamically, well I actually have to add my custom Sprite's to a UIComponent and add the UIComponent to the canvas for them to be visible. The Sprites can be moved, using the mouse position in the canvas to set the x and y coordinates of the Sprite. However, the Sprite's are visible even outside of the canvas, and I can move them all over the web page; they are not clipped at all and somehow the canvas can detect the mouse anywhere on the screen.

      Amazingly; if I add a button to the canvas and set this to the same width, actually a little bigger, as the canvas, I can only move the Sprites within the Canvas and not all over the screen; they do seem to be clipped and the mouse is no longer detected outside of the visible canvas. The button seems to set a bounding box or forces the canvas to clip the Sprites at the edge.

      Does anyone know why this occurs? If anyone can give any advice on how to constrain the children of a canvas such that only the parts of the Sprite in the visible x and y coordinates of the Canvas are shown that would be great.
        • 1. Re: Clippping the children in a canvas very odd
          MacFlex Level 1

          I have in some ways been a bit dim, but am still confused a bit;

          I have resized the inner canvas so that it is larger than the outer canvas; hence the outer canvas acting as a view window to limit what is visible of the inner canvas and I can move the inner canvas around.

          This works fine, the sprites are contained correctly and my issues disappear, and I don't even have to add any buttons :)

          However, I am still confused as to why having a smaller canvas than the containing canvas has these weird issues about the inner canvas getting mouse events no mater whether the mouse is actually on the canvas or not. If anyone can explain that I would be much happier.