CODEWITHSUNDEEP
sapui5sap-fiori
userfrh
userfrh

Reputation: 57

How to make field next to each other?

Anyone can help to make the StepInput next to Number of copies:

Current layout

My Code:

  <core:FragmentDefinition xmlns="sap.m" xmlns:f="sap.ui.layout.form" xmlns:core="sap.ui.core">
    <Dialog title="{i18n>CopyStructure}" class="sapUiContentPadding" contentWidth="25em"
        afterClose=".onAfterCloseForCreateDuplicateHierarchyElement">
        <content>
            <HBox class="sapUiSmallMargin">
                <f:Form editable="true">
                    <f:layout>
                        <f:ResponsiveGridLayout labelSpanXL="4" labelSpanL="4" labelSpanM="4" labelSpanS="12" adjustLabelSpan="false" emptySpanXL="3" emptySpanL="3"
                            emptySpanM="3" emptySpanS="0" columnsXL="1" columnsL="1" columnsM="1" singleContainerFullSize="false"/>
                    </f:layout>
                    <f:formContainers>
                        <f:FormContainer>
                            <f:formElements>
                                <f:FormElement label="{i18n>NumberOfDuplicateCopies}">
                                    <f:fields>
                                        <StepInput value="{objectView>/numberOfDuplicateCopies}" width="5rem" min="0" max="99" change=".onChangeForNumberOfDuplicates"/>
                                    </f:fields>
                                </f:FormElement>
                            </f:formElements>
                        </f:FormContainer>
                    </f:formContainers>
                </f:Form>
                </HBox>
        </content>
        <beginButton>
            <Button text="{i18n>OK}" press=".onPressOkForCreateDuplicateHierarchyElement" enabled="false"/>
        </beginButton>
        <endButton>
            <Button text="{i18n>Cancel}" press=".onPressCancel"/>
        </endButton>
    </Dialog>
</core:FragmentDefinition>

I have tried to used HBOX/VBOX but it doesnt really works. Thanks!

Upvotes: 0

Views: 840

Answers (1)

Magentai
Magentai

Reputation: 33

The problem is in ResponsiveGridLayout. Try to set its parameters like this:

<f:ResponsiveGridLayout labelSpanXL="4" labelSpanL="4" labelSpanM="4" labelSpanS="4" adjustLabelSpan="false" emptySpanXL="0" emptySpanL="0"
    emptySpanM="0" emptySpanS="0" columnsXL="1" columnsL="1" columnsM="1" singleContainerFullSize="false"/>

Upvotes: 1

Related Questions