2975 design templates with multiple items per row

[lilitkarapetyan]

Fixes #2975

🧰 Issue

🚀 Overview:

🔗 Link to preview

🤔 Reason:

🔨Work carried out:

• [x] Tests pass

🖥️ Screenshot

Confirmations

• [ ] I have chosen reviewers for my PR.
• [ ] I have assigned myself to this PR.
• [ ] I have chosen an appropriate label for the PR.
• [ ] I have completed the mandatory sections of this document.
• [ ] I have deleted any unused sections.
• [ ] I confirm that I have checked for required README updates and acted accordingly.

📝 Developer Notes:

[IanMayo]

@lilitkarapetyan - could you include a video of editing a template to put them in one row, and then the player seeing that template please?

[Tristina1788]

@lilitkarapetyan @IanMayo Now I can adjust for size field but I still don't see anywhere to config multiple fields on same row : https://app.screencast.com/89TPv8aLW4GcQ

[IanMayo]

@lilitkarapetyan @IanMayo Now I can adjust for size field but I still don't see anywhere to config multiple fields on same row : https://app.screencast.com/89TPv8aLW4GcQ

Yes @Tristina1788 , we're part way there :-D. Note: you should be able to verify the layout from the "template preview" tab of the template editor.

[IanMayo]

@lilitkarapetyan - can you check one thing please? When we are designing the template, and we switch to preview, and then back to edit - can you check the original attribute name is there?

[Tristina1788]

@lilitkarapetyan - can you check one thing please? When we are designing the template, and we switch to preview, and then back to edit - can you check the original attribute name is there?

Is that about params of element? Seem it's ok on my checking : https://app.screencast.com/9gWnCx4du8aJn

[Tristina1788]

@lilitkarapetyan @IanMayo Now I can see multiple fields are on the same row. But how to make any field is not same row? Seem now all fields are same rows until no left space.

[lilitkarapetyan]

@lilitkarapetyan @IanMayo Now I can see multiple fields are on the same row. But how to make any field is not same row? Seem now all fields are same rows until no left space.

You need to change the column size. ahh, the size of the input field does not increase completely. I will investigate now

[Tristina1788]

@lilitkarapetyan @IanMayo I still don't have the way to put the item down to new line as my expected . Currently the new item will be down to new line when the total size of items are 12.

@lilitkarapetyan Can you guide me the way to have the form below ( I draw form by paint, not from our form builder)

[lilitkarapetyan]

@lilitkarapetyan @IanMayo I still don't have the way to put the item down to new line as my expected . Currently the new item will be down to new line when the total size of items are 12.

@lilitkarapetyan Can you guide me the way to have the form below ( I draw form by paint, not from our form builder)

Wen you adjust the with of column from 1 to 12 (0% to 100%). if the items cannot fit in one row, the item on the right moves down to the next row.

[lilitkarapetyan]

this lib we are using doesn't have taht feature by default, I added it myself

[lilitkarapetyan]

This lib we are using doesn't have taht feature by default, I added it myself

[Tristina1788]

This lib we are using doesn't have taht feature by default, I added it myself

@lilitkarapetyan I think we need to improve for user can custom about the size of input field and input field in the new line when he want. @IanMayo How do you think

[IanMayo]

Let me understand how things work:

• the form designer specifies the field width, in 12ths.
• the fields get laid out with the specified width, wrapping to new line once the value goes past 12. Is that right @lilitkarapetyan

That seems ok for me @Tristina1788 .

[Tristina1788]

Let me understand how things work:

• the form designer specifies the field width, in 12ths.
• the fields get laid out with the specified width, wrapping to new line once the value goes past 12. Is that right @lilitkarapetyan

That seems ok for me @Tristina1788 .

@IanMayo I mean we can't custom it whatever we want. Example we can't create this below form. Is this ok?

[IanMayo]

Let me understand how things work:

• the form designer specifies the field width, in 12ths.
• the fields get laid out with the specified width, wrapping to new line once the value goes past 12. Is that right @lilitkarapetyan

That seems ok for me @Tristina1788 .

@IanMayo I mean we can't custom it whatever we want. Example we can't create this below form. Is this ok?

Aaah, I see. We can't create layout that has white-space to the right of the controls. The main problem for game designers is in creating a really compact form that still contains all of the fields. I don't believe there is the case where the designer wants to introduce white-space.

The inability to insert white space is not an issue for me. If that is the only remaining issue then I'm happy to go with this solution.

[Tristina1788]

Let me understand how things work:

• the form designer specifies the field width, in 12ths.
• the fields get laid out with the specified width, wrapping to new line once the value goes past 12. Is that right @lilitkarapetyan

That seems ok for me @Tristina1788 .

@IanMayo I mean we can't custom it whatever we want. Example we can't create this below form. Is this ok?

Aaah, I see. We can't create layout that has white-space to the right of the controls. The main problem for game designers is in creating a really compact form that still contains all of the fields. I don't believe there is the case where the designer wants to introduce white-space.

The inability to insert white space is not an issue for me. If that is the only remaining issue then I'm happy to go with this solution.

Yeah, so It's ok to close this PR.