Hi Rachel,
the panel will be used to populate a modal pop-up window.
It's currently not absolute or constrained.
The content is dynamic and so I never know exactly what the width of the
CheckBox labels or "lbl" text will be - therefore I don't want absolute
values used for the width. The Panel should pretty much be able to handle
what is thrown at it.
I could simply listen for a scroll event and add/subtract 16 pixels to the
width of the box depending on whether my content scrolls or not, but I was
just guessing that this kind of resizing was a such a common task that there
would be some in-built way of handling it. If not I'll just have to make
myself a component to do the job.
If you're interested, the code is below :]
Cheers.
ps The content won't change whilst the box is already visible, and therefore
I don't have to worry about my content "jumping about".
//--------------------------CODE
FOLLOWS----------------------------------------------------------------------------------
//CLASS: PredefinedEntitiesFromReport.mxml
//This class displays a vertical list of names (entities) with checkboxes by
their side. The user selects the names of the people they want to include in
the report and then proceeds. There are buttons for "select all" and "select
none" - ie - it is the same setup as you would use to select/unselect
multiple emails with an app like GMail.
<?xml version="1.0"?>
<mx:Panel xmlns:mx="http://www.adobe.com/2006/mxml"; title="Existing Report
Entities Found"
maxHeight="200" horizontalScrollPolicy="off"
creationComplete="init();"
paddingBottom="10" paddingLeft="10" paddingRight="10"
paddingTop="10" height="100%">
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.collections.ICollectionView;
import mx.controls.CheckBox;
private static var ALL:String = 'all';
private static var NONE:String = 'none';
private var _entities:ICollectionView;
private function init():void{
lbl.text = "There are entities already related to this
report. Please select those you wish to import:";
onSelect(PredefinedEntitiesFromReport.ALL);
}
[Bindable]
public function get entities():ICollectionView{
return _entities;
}
public function set
entities(entities:ICollectionView):void{
_entities = entities;
}
private function onSelect(select:String):void{
var i:uint;
var len:uint = checkBox.length;
var sel:Boolean = (select=='all') ? true : false;
for(i=0; i<len;i++){
CheckBox(checkBox[i]).selected = sel;
}
}
private function onClick():void{
var i:uint;
var len:uint = checkBox.length;
var arr:Array = new Array();
for(i=0; i<len;i++){
if(CheckBox(checkBox[i]).selected){
arr.push(_entities[i]);
}
}
trace("arr: " + arr + " (" + arr.length + ")");
trace(arr[0].name);
trace(arr[1].name);
trace(arr[2].name);
}
]]>
</mx:Script>
<mx:Text id="lbl" selectable="false" width="100%" />
<mx:Repeater id="rp" dataProvider="{entities}" width="100%">
<mx:CheckBox id="checkBox"
label="{rp.currentItem.name.toString()}"
/>
</mx:Repeater>
<mx:HRule width="100%" />
<mx:ControlBar horizontalAlign="right" width="100%">
<mx:HBox width="100%">
<mx:Label text="Select: " paddingTop="2"/>
<mx:LinkButton label="all" color="blue" click="onSelect(
PredefinedEntitiesFromReport.ALL)" />
<mx:LinkButton label="none" color="blue" click="onSelect(
PredefinedEntitiesFromReport.NONE)" />
<mx:Spacer width="100%" />
<mx:Button label="Proceed" click="onClick()" />
</mx:HBox>
</mx:ControlBar>
</mx:Panel>
On 2/1/07, Rachel Maxim <[EMAIL PROTECTED]> wrote:
This may or may not be the answer you are looking for... but is the
content of your panel laid out using constraints or absolute values? If you
do it with constraints, then your content should get resized when the
scrollbar appears. Then again, this may be the inverse of what you are
trying to do, and it may cause labels or text to get truncated.
Is there a reason that you cannot make the panel wide enough to accomodate
your content and scroll bar both, then if the scroll bar doesn't show up
then it will just be a little more padding to the right.
It seems like if you were to resize the panel dynamically with a scroll
event then it might "jump around" which may not be the desired effect.
If you can post code I'd be happy to take a look, I've done a lot of
tweaking layouts with lots of scrollbars lately!
HTH
Rachel
On 2/1/07, nwebb <[EMAIL PROTECTED]> wrote:
>
> Hi,
>
> I'm sure this is excruciatingly simple but i couldn't find an answer (I
> must be searching with the wrong keywords).
>
> I have a Panel.
> Inside it is a Text component, and a Repeater underneath that
> (...repeating a CheckBox) .
> All works fine.
>
> I want to set the "maxHeight" of the Panel to 200px, so that if I get
> too many Checkboxes appearing, my content will scroll vertically.
>
> When I set maxHeight, I get *both* horizontal and vertical scrollbars
> appearing - the horizontal scrollbar only appears because the width of the
> vertical scrollbar eats in to the Panel width - therefore I get horizontal
> scrolling of about 16 pixels.
>
> If I set horizontalScrollbarPolicy to false then my content is still
> clipped.
> I'm sure I can muster a workaround easily enough (e.g. manually resize
> Panel based on ScrollEvent etc), but I thought there surely must be
> something in-built and neater, already in place to deal with this kind of
> scenario?
>
> Any help much appreciated.
>
