[CLOSED] layout problem

[hdsoso]

I want to do a layout,
there is a panel , in it have 4 button,
and the first is on the left, and the last 3 buttons on the right of the button, and make the 4 buttons Horization Align and vertical alignment
any suggestion?
such as https://examples2.ext.net/#/Layout/HBoxLayout/Basic/
click the "spaced" button,
but I do not know how to it

[Daniil]

Hi @hdsoso,

You find exactly the example you need. Though, I do not understand what else you need to modify. Please provide a mockup.

[hdsoso]

Hi @hdsoso,

You find exactly the example you need. Though, I do not understand what else you need to modify. Please provide a mockup.

what is the "Spaced" ? how to use it?

[Daniil]

You can see it in the Example's sources.

<ext:Panel 
    ID="pnlSpaced" 
    runat="server"
    Layout="HBoxLayout"
    BodyPadding="5">
    <Defaults>
        <ext:Parameter Name="margins" Value="0 5 0 0" Mode="Value" />
    </Defaults>
    <LayoutConfig>
        <ext:HBoxLayoutConfig  Align="Top" />
    </LayoutConfig>
    <Items>
        <ext:Button runat="server" Text="Button 1" />
        <ext:Panel runat="server" BaseCls="x-plain" Flex="1" />
        <ext:Button runat="server" Text="Button 2" />
        <ext:Button runat="server" Text="Button 3" />
        <ext:Button runat="server" Text="Button 4" Margins="0" />
    </Items>
</ext:Panel>

Though, I suggest to use:

<ext:Component runat="server" Flex="1" />

instead of

<ext:Panel runat="server" BaseCls="x-plain" Flex="1" />