Hi,
I'm using Sprites to draw fairly large graphs. To enable me to do this
interactively, I embed the nodes/edges in the graph within a UIComponent
defined in the mxml file. I also would like the UIComponent to be within a
panel, and therefore the contents of that compnent should not be visibly
outside that panel.

The problem is that I am unable to define the bounds for this UIComponent, and
so the graph occupies most of the screen area beyond the containing panel.
(height/width attributes for the UIComponent do not address this).

What is the appropriate way to have the graph shown in a canvas with limited
arae (with scrollbars if the contained graph is bigger than that area) so that
it does not overflow the desired display area?



In the code below, for example, I'd like the UIComponent (to which I add
Sprite Children) to have bounds so that it does not display all over the screen.

Thanks a lot.



<?xml version="1.0" encoding="utf-8"?>
<mx:Application name="My Test" initialize="init()"
xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical" verticalAlign="middle">

<mx:Script>
<![CDATA[
import flash.display.Sprite;
import mx.controls.ComboBox;
import mx.core.UIComponent;

public function init() : void
{
// create a sprite
// add it as a child to ref
}

public function newStuff ():void
{
// refresh ref with some new sprite children obtained from the combobox
}

]]>
</mx:Script>

<mx:Panel title="Testing" height="75%" width="75%" >
<mx:UIComponent id="ref" x="10" y="10" width="100" height="100"
initialize="init()"></mx:UIComponent>
<mx:ComboBox id = "cbox" x="21" y="90" dataProvider="{fnames}"
change="newStuff()"></mx:ComboBox>

</mx:Panel>

<mx:ArrayCollection id="fnames">
<mx:source>
<mx:Array>
<mx:Object label="test1" />
<mx:Object label="test2" />
<mx:Object label="test3" />
</mx:Array>
</mx:source>
</mx:ArrayCollection>

Set a mask.