changing the location of a component in different states - components

Question

Hello my good people of stackOverflow,
Recently, i was building a component where a certain dropDownList component with id = languageCombo, has to be relocated dynamically as the states change..here is the code for the two states: initial and chaingrp. i want the dropDownList component to change from one position X in the initial state to another position X = 500 in the tree_changeHandler function when the chaingrp state is called but the dropDownList component doesn't change. Could anyone point me to what the problem could be?
Thanks
<?xml version="1.0" encoding="utf-8"?>
<s:Group xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
xmlns:components="components.*"
xmlns:searchComponents="searchComponents.*"
minHeight="500" minWidth="500">
<fx:Metadata>
[Event(name="SearchClick", type="eventClass.SelectedTableEvent")]
</fx:Metadata>
<fx:Script>
<![CDATA[
import eventClass.SelectedTableEvent;
import mx.collections.ArrayCollection;
import mx.events.ListEvent;
import mx.events.TreeEvent;
import spark.events.IndexChangeEvent;
namespace simo="http://www.simo-project.org/simo";
[Bindable]
public var parentXmlCopy:XML;
[Bindable]
public var treeXml:XML;
[Bindable]
private var newXml:XML;
private var transferredname:String;
public var modelType:String;
public var selectedModelchainIndex:int;
public var selectedTaskIndex:int;
public function set variables(_xml:XML):void{
parentXmlCopy = _xml;
}
private function languageChange(event:Event):void{
trace("languageChange");
var cb:DropDownList=event.target as DropDownList;
var temp:Object=cb.selectedItem;
var chain:Array=[];
for (var i:int=0; i < cb.dataProvider.length; i++)
{
if(cb.dataProvider[i].label == temp.label)
{
chain.push(cb.dataProvider[i].locale);
resourceManager.localeChain=chain;
}
}
}
protected function tree_changeHandler(event:ListEvent):void
{
use namespace simo;
var selectedItem:XML;
transferredname = tree.selectedItem.localName();
switch (transferredname){
case "chain_group" : currentState = "chaingroup";
languageCombo.X = 500;
selectedItem = XML(tree.selectedItem);
trace(selectedItem);
this.chainGrpId.displayChainGrp(selectedItem);
break;
}
}
private function treeLabel(item:Object):String
{
return item.localName();
}
]]>
</fx:Script>
<s:states>
<s:State name="initial"/>
<s:State name="chaingroup"/>
</s:states>
<s:HGroup><!--overall outer Hgroup-->
<s:HGroup gap="8">
<s:HGroup gap="5">
<s:VGroup height="460" paddingLeft="10" paddingTop="5">
<s:HGroup gap="3">
<searchComponents:AutoComplete/>
<s:Button
id="searchBT"
height="24"
width="24"
skinClass="skins.searchBTskin"/>
</s:HGroup>
<s:List id="treeDP" height="120" width="180" labelField="#name"
change="treeDP_changeHandler(event)">
<s:dataProvider>
<s:XMLListCollection source="{parentXmlCopy.children()}" />
</s:dataProvider>
</s:List>
<s:Button id="delListBT" label="delList"/>
<s:HGroup gap="70">
<s:Button
id="backBT"
label="back"
height="24"
width="24"
/>
<s:Button
id="nextBT"
label="next"
height="24"
width="24"
/>
</s:HGroup>
<mx:Tree id="tree" dataProvider="{treeXml}" labelField="{treeXml.localName()}"
top="72" left="50" labelFunction="treeLabel"
maxHorizontalScrollPosition="20"
maxVerticalScrollPosition="10"
showRoot="true"
change="tree_changeHandler(event)"
height="225" width="180"/>
<s:Button id="delTreeBT" label="delTree"/>
</s:VGroup>
<s:Group includeIn="chaingroup/>
</s:HGroup>
</s:HGroup>
<s:HGroup paddingLeft="200" paddingTop="5"
x.modelOperation="-38" y.modelOperation="-22" width.modelOperation="737"
x.modelPrediction="-18" y.modelPrediction="-20">
<s:DropDownList id="languageCombo" width="150" change="languageChange(event)" includeIn="initial"
dataProvider="{new ArrayCollection([{locale:'fi_FI',label:'Suomi'}, {locale:'en_US', label:'English'}])}"
prompt="{resourceManager.getString('modelChainUI','lang')}"
x.chaingroup="900"
x.condition="900"
x.modelchain="900"
x.task="900"/>
</s:HGroup>
</s:HGroup><!--overall hgroup ends here!-->
<s:VGroup gap="5" paddingLeft="10"
x.chaingroup="144" y.chaingroup="-69" height.chaingroup="148">
<components:ChainGroup id="chainGrpId" includeIn="chaingroup"/>
</s:VGroup>

Answer 1

Your languageCombo is within HGroup. HGroup is a container with horizontal layout. Horizontal layout doesn't consider any x and y coordinates of children (because of it is horizontal layout).
Maybe it better to use simple Group (taking in mind your HGroup has only one child — so horizontal layout hasn't sense)?