i have my hGroups as like
<s:HGroup width="100%" verticalAlign="baseline" id="Scale">
<s:Label width="80" text="Scale:" fontWeight="bold" textAlign="right"/>
<s:DropDownList id="scaleDropdown" minWidth="155" change="handleScaleDropdownChange(event)"/>
</s:HGroup>
<s:HGroup width="100%" verticalAlign="baseline" id="Precision">
<s:Label width="80" text="Precision:" fontWeight="bold" textAlign="right"/>
<s:DropDownList id="precisionDropdown" minWidth="155" change="handlePrecisionDropdownChange(event)"/>
</s:HGroup>
<s:HGroup width="100%" verticalAlign="baseline" id="Units">
<s:Label width="80" text="Units:" fontWeight="bold" textAlign="right"/>
<s:DropDownList id="unitDropdown" minWidth="155" change="handleUnitDropdownChange(event)"/>
</s:HGroup>
and i m trying to hide the hgroups on a condition when this bean tagInfoData have a value "notworking" otherwise it will shown..
should i need to write code in the creation complete as all this is in a pop up window of the button click event
i m using this
if(tagInfoData.selectionType.match("notworking"))
{
Scale.visible=true;
Precision.visible=true;
Units.visible=true;
}
else
{
Scale.visible=false;
Precision.visible=false;
Units.visible=true;
}
In each of the HGroups you want to hide, add visible="{myFunc(tagInfoData)}"
Then define:
internal function myFunc(tagInfoData:whateverTypeItIs):Boolean{
return ! tagInfoData.selectionType.match("notworking")
}
Make sure tagInfoData is defined as [Bindable]
Related
What should be added in order to the vertical scrollbar to be visible without to be clicked or touched ? Here is image of screen :
Here is code :
<s:Scroller width="100%" height="100%">
<s:VGroup width="100%" height="100%" paddingTop="5" verticalAlign="middle" horizontalAlign="center">
<s:TextInput id="chp1" width="50%"/>
<s:TextInput id="chp2" width="50%"/>
<s:Button label="Enregistrer" click="enregistrer(event)" styleName="btn"/>
<s:Label/>
<s:Button label="Lire" click="lire(event)" styleName="btn" />
<s:TextArea id="area"/>
<s:Label/>
<s:HGroup>
<s:Button label="Envoyer" click="send(event)" styleName="btn" />
<s:Button label="Retour" click="navigator.popView()" styleName="btn" />
</s:HGroup>
<s:TextArea id="resultHTTP"/>
<s:TextInput id="h_url" text="{url}" visible="false"/>
</s:VGroup>
</s:Scroller>
As you see the vertical scrollbar at the right of the screen is not visible. So how to make it visible anytime ?
Please try this, on your scroller:
verticalScrollPolicy = "on"
Update:
What about trying this:
interactionMode="mouse"
;)
I am building an ItemRenderer in order to display a list of jobs that a company may want to carry out on a building. A user then may click on a job to select it and use add/edit/delete buttons on the parent view.
How would I highlight the selected HGroup in my s:ItemRenderer to allow a user to see which job is currently selected?
<s:Scroller width="100%" height="70%">
<s:DataGroup width="100%" height="100%"
horizontalCenter="0" verticalCenter="0"
dataProvider="{Session.EXISTING_JOBS}"
>
<s:layout >
<s:VerticalLayout />
</s:layout>
<s:itemRenderer>
<fx:Component>
<s:ItemRenderer verticalCenter="0" horizontalCenter="0" width="100%">
<fx:Script>
<![CDATA[
protected function jobSelect_clickHandler(event:MouseEvent):void
{
// highlight the HGroup here
if(this.selected == true){
jobRow.setStyle('contentBackgroundColor',0x000000);
} else {
jobRow.setStyle('contentBackgroundColor',0xFFFFFF);
}
}
]]>
</fx:Script>
<s:states>
<s:State name="normal"/>
</s:states>
<s:HGroup id="jobRow"
width="100%" height="50"
verticalAlign="middle"
click="jobSelect_clickHandler(event)" >
<s:Label text="{data.id}"
width="15%" height="50"
verticalAlign="middle"
verticalCenter="0"/>
<s:Label text="{data.company}"
width="35%" height="50"
verticalAlign="middle"
verticalCenter="0"/>
<s:Label text="{data.building}"
width="35%" height="50"
verticalAlign="middle"
verticalCenter="0"/>
<s:Label text="{data.assets}"
width="15%" height="50"
verticalAlign="middle"
verticalCenter="0"/>
</s:HGroup>
</s:ItemRenderer>
</fx:Component>
</s:itemRenderer>
</s:DataGroup>
</s:Scroller>
Assuming that you're using the itemRenderer in a list; the List class already does this by default. You can change the value by setting the selectionColor style.
If you really want to change values on the HGroup, you can use the style contentBackgroundColor. You can tell whether your current renderer is the selected item or not by accessing the selected property of the itemRenderer instance.
protected function selectJob_clickHandler(event:MouseEvent):void
{
// highlight the HGroup here
if(this.selected == true){
hgroupID.setStyle('contentBackgroundColor',0x000000);
} else {
hgroupID.setStyle('contentBackgroundColor',0xFFFFFF);
}
}
Don't forget to add an ID to the HGroup:
<s:HGroup id="hgroupID"
width="100%" height="50"
verticalAlign="middle"
click="selectJob_clickHandler(event)" >
I have a Hgroup that contains of four panels. Sometimes it happens then when users open it the panls have a unknown width even bigger than the window resolution.
does anyone know what the problem is or how to solve it?
<s:Scroller width="100%" height="100%" >
<s:Group width="100%" height="100%">
<s:VGroup gap="10" width="100%">
<s:TextInput/>
<s:Line width="100%"><s:stroke><s:SolidColorStroke color="#696969"/></s:stroke></s:Line>
<s:HGroup gap="20" width="100%">
<s:Panel width="100%"/>
<s:Panel width="100%"/>
<s:Panel width="100%"/>
<s:Panel width="100%"/>
</s:HGroup>
<s:TextInput/>
</s:VGroup>
</s:Group>
</s:Scroller>
it seems that the User who was testing it was using an older version of the flash player! updating this. fixed the problem.
I want to add two icons on spark button.I am using button skin.
But the icons are not coming properly. Do anyone is having any idea?
The code is:
<s:HGroup width="100%">
<s:HGroup id="iconContainer" top="1" bottom="1" left="0" right="0"
horizontalAlign="{iconPosition}" verticalAlign="middle">
<mx:Image id="iconImage" source="{icon}" />
</s:HGroup>
<s:HGroup id="decoratorContainer"
width="100%">
<s:Label id="labelDisplay"
textAlign="center"
verticalAlign="middle"
maxDisplayedLines="1"
horizontalCenter="0" verticalCenter="1"
left="0" right="0" top="2" bottom="2">
</s:Label>
<mx:Image id="image" source="{decorator}" />
</s:HGroup>
</s:HGroup>
Give absolute width and height to 'iconImage' and 'image' OR override commitProperties by calling invalidateProperties once the image size is known by the works of {Binding}. Hope it helped.
I would like to right align an icon on a button or tabbarbutton and keep the text left aligned in Flex 4.0 Spark.
So far, I've come up with something like the following in my custom skin:
<s:HGroup>
<s:HGroup horizontalAlign="left">
<s:Label id="labelDisplay"
textAlign="left"
maxDisplayedLines="1"
top="10">
</s:Label>
</s:HGroup>
<s:HGroup horizontalAlign="right" bottom="5" right="0">
<s:BitmapImage source="#Embed('assets/images/icons/close.png')" />
</s:HGroup>
</s:HGroup>
But it seems silly to have an HGroup with 2 HGroup children just to get the horizontalAlign to the right.
Anyone know of a better way?
Thx,
=Dave
You could set the width of the label to be 100%.
<s:HGroup>
<s:Label id="labelDisplay" width="100%"/>
<s:BitmapImage source="#Embed('assets/images/icons/close.png')" />
</s:HGroup>
If your buttons are all an explicit width, you could also try something like this:
<s:HGroup>
<s:Label id="labelDisplay"/>
<mx:Spacer width="100%"/>
<s:BitmapImage source="#Embed('assets/images/icons/close.png')" />
</s:HGroup>