[CLOSED] Layout Issue in form

[Sowjanya]

Hi,

I am hoping to see if any one can help me resolve this layout issue which I am struggling with for quite some time.

I am expecting a layout as attached.

I have arrived at the that layout except for the toolbar at the top.

I am using the follwing code that forms the 4 boxes.

I want to fit the toolbar on the top. How can I do that ?

<ext:Viewport ID="Viewport1" runat="server" Layout="HBoxLayout">
        <LayoutConfig>
            <ext:HBoxLayoutConfig Align="Stretch" />
        </LayoutConfig>
      
        <Items>

   

                          <ext:FormPanel ID="LeftPanel" runat="server" Border="false" Header="false" Frame="true" > 
                <LayoutConfig>
                    <ext:VBoxLayoutConfig Align="Stretch" />
                </LayoutConfig>
                <Items>

  <ext:GridPanel runat="server" ID="MainTable" Height="250" Padding="5" Frame="true" Title="Museum Component Information" MultiSelect="true" ButtonAlign="Right">
...

</ext:GridPanel>

<ext:FormPanel runat="server" ID="HostDetails" Title="Museum Host Details" BodyPadding="10"
                AutoScroll="True" Frame="true" flex="1" >
...

</ext:FormPanel>

    </Items>

 </ext:FormPanel>

   <ext:FormPanel ID="RightPanel" runat="server"  Layout="VBoxLayout" Flex="1" >

  <LayoutConfig>
                    <ext:VBoxLayoutConfig Align="Stretch"/>
                </LayoutConfig>
                <Items>

   <ext:GridPanel ID="ProjectPanel" Padding="5" Frame="true"                
                    runat="server"                    
                    AutoScroll="true"
                    Height="200" Title="Museum Projects"> 

</ext:GridPanlel>

<ext:FormPanel runat="server" ID="ProjectForm" Title="Museum Project Details" ButtonAlign="Center"
                    AutoScroll="True" BodyPadding="10" Split="true" Frame="true" Flex="1" >
...
</ext:FormPanlel>


          </Items>

          </ext:Viewport>

Thanks,
Veda