[Flex JS] Adobe substitute

[m_awais]

Hi,

I am trying to create the simple login form using Flex JS, like following
GUI created using adobe flex.
<http://apache-flex-development.2333347.n4.nabble.com/file/t1235/login.png> 

Flash builder has generated the following code for above UI.

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"; 
                           xmlns:s="library://ns.adobe.com/flex/spark" 
                           xmlns:mx="library://ns.adobe.com/flex/mx" 
minWidth="955"
minHeight="600">
        <fx:Declarations>
                
                
        </fx:Declarations>
        <s:Panel x="100" y="137" width="428" height="282" title="Login">
                <s:Label x="80" y="70" text="User Name"/>
                <s:Label x="88" y="114" text="Password"/>
                <s:TextInput x="171" y="64"/>
                <s:TextInput x="171" y="107"/>
                <s:Button x="165" y="162" label="Login"/>
                <s:Button x="246" y="162" label="Cancel"/>
        </s:Panel>
        
</s:Application>

I succeeded to create the following GUI in JS Flex

<http://apache-flex-development.2333347.n4.nabble.com/file/t1235/Capture.png> 

Code for above GUI is

<?xml verison="1.0" encoding ="UTF-8"?>

<js:Application xmlns:fx = "http://ns.adobe.com/mxml/2009";
                xmlns:js = "library://ns.apache.org/flexjs/express"
                xmlns:s="library://ns.adobe.com/flex/spark"
                xmlns:basic="library://ns.apache.org/flexjs/basic">

    
<js:initialView>
    <js:View>
        <js:Label id="name_label" text="User Name" x="500" y="205"/>
        <js:TextInput  id="name_field" x="600" y="200"/>

        <js:Label id="password_label" text="Password" x="500" y="255"/>
        <js:TextInput  id="password_field" x="600" y="250"/>

        <js:TextButton text="Login" click="checkCredential(event)" x="600"
y="300"/>
        <js:TextButton text="Clear" click="clearFields(event)" x="650"
y="300"/>
    </js:View>
</js:initialView>

</js:Application>

I want to enclose JS Flex GUI in a panel like first GUI which i shared. I
used Flex JS group and containers but unfortunately those tags were not
working for me. Another option was to create layouts using beads and strands
which i think is not fair for simple GUI. *Is there any substitute of adobe
<s:panel> in JS FLex?*

Thanks in advance.

Regards




--
Sent from: http://apache-flex-development.2333347.n4.nabble.com/