Help me with layouts on the form

[Tokay]

Here is a test case. I need that the panels looks like in the sample but they must fill the form when the form change it size. When I try to set layout = 'fil' on the form, then the top component (UniScrollBox1) looks as expected but the bottom panel (UniContainerPanel1) totally disappeared from the form, and this panel is needed at the place. I try to set many different combinations of the layouts but could not find proper for my requirements. Sample is uploaded above.

 

[Sherzod]

32 minutes ago, Tokay said:

test case.7z 5.61 kB · 1 download

Please attach a complete project for the test...

[Tokay]

I have found more sweatable form layout for us. But question is still active: how to do right and bottom form borders?

 

test case.7z

[Tokay]

Yet another question: how is possible to set two pairs of components, SpTBXButtonEdit1 and UniBitBtn1; SpTBXButtonEdit2 and UniBitBtn2 into rows like in the ide disigner? I try to set RowSpan/ColSpan but have no success.

[Tokay]

Up

[alfr]

I should put SpTX*Edit1 and UniBtn1 in one uniPanel with ClientAlignmentControl and Layout to HBox

and put SpTX*Edit2 and UniBtn2 in one uniPanel with ClientAlignmentControl and Layout to HBox

(or with rows - do you mean vertically? If so use VBox instead of HBox)

[mhmda]

hi

[Tokay]

Thank you!

mhmda, Flex helps me. How about two bottom buttons? SpTBXButton1 and SpTBXButton2?

alfr, your solution has strange side effect. I've added two panel, and put components on it. components looks fine with HBox layout, but both panels are moved to the bottom of all other buttons and editors

[mhmda]

Test case?

[Tokay]

Here is it:

test case.7z

Actual:

Expected:

[Tokay]

Actual:

Expected:

[Sherzod]

8 hours ago, Tokay said:

Expected:

Edited 58 minutes ago by Tokay

Hello,

In your case, one possible solution:

1. UniContainerPanel1 -> Layout = hbox

2. UniContainerPanel1 -> LayoutAttribs -> Align = middle

3. UniContainerPanel1 -> LayoutAttribs -> Pack = end

4. UniContainerPanel1 -> LayoutConfig -> Padding = 10

5. UniContainerPanel1 -> LayoutConfig -> Width = 100%

6. UniContainerPanel1 -> ClientEvents -> UniEvents ->

function beforeInit(sender, config)
{
    sender.defaults = {
        margin: '10px 10px 0 10px'
    }
}

 

[Tokay]

Great! Works as expected, thank you!!!

Please help me with panels with HBox layout.

[Sherzod]

1 hour ago, Tokay said:

Please help me with panels with HBox layout.

?

[Tokay]

Actually two panels are moved to the bottom of all componets:

But were expected that the panels are remained in place where designed:

[Sherzod]

Do you mean createOrder?

[Sherzod]

33 minutes ago, Sherzod said:

Do you mean createOrder?

If yes, you can analyze this post:

 

[Tokay]

createOrder, Ok, thank you, that it! All work fine here now!

[Tokay]

Another question. How to add additional vertical distances between all controls on the container panel? All controls are drawn too close to each other.

[Sherzod]

41 minutes ago, Tokay said:

Another question. How to add additional vertical distances between all controls on the container panel? All controls are drawn too close to each other.

 

On 5/28/2021 at 4:06 PM, Sherzod said:

LayoutContainer -> ClientEvents -> UniEvents ->

function beforeInit(sender, config)
{
    sender.defaults = {
        margin: '10px 10px 0 10px'
    }
}

?

[Tokay]

That it, thank you!

[Tokay]

Hi! This tip doesn't works between two labels. Before label + edit/checkbox/other components works great, but two labels are drawn closer to each other. Maybe someone other tip could help me? Thank you.

[Sherzod]

7 minutes ago, Tokay said:

This tip doesn't works between two labels.

Hi,

vbox or hbox?

[Tokay]

table

[Sherzod]

21 minutes ago, Tokay said:

table

1 hour ago, Tokay said:

This tip doesn't works between two labels. Before label + edit/checkbox/other components works great, but two labels are drawn closer to each other.

Screenshots, testcase?