1

我正在使用 sapui5 开发一个应用程序,但我遇到了简单形式的“下拉框”大小的问题。sap.m 包中的项目似乎会自动调整为简单表单内容的大小,而 sa.ui.commons 等包中的其他项目也不会调整。

如何调整下拉框的大小?我尝试将宽度和高度设置为“100%”,但这不起作用。

添加代码:

<c:FragmentDefinition
        xmlns:mvc="sap.ui.core.mvc"
        xmlns:l="sap.ui.layout"
        xmlns:f="sap.ui.layout.form"
        xmlns:c="sap.ui.core"
        xmlns:co="sap.ui.commons"
        xmlns:col="sap.ui.commons.layout"
        xmlns="sap.m">
            <l:Grid
            defaultSpan="L12 M12 S12"
            width="auto">
            <l:content>
                <f:SimpleForm

                    minWidth="800"
                    maxContainerCols="2"
                    editable="true"
                    layout="ResponsiveGridLayout"
                    title="General Info"
                    labelSpanL="3"
                    labelSpanM="3"
                    emptySpanL="4"
                    emptySpanM="4"
                    columnsL="2"
                    columnsM="2"
                    class="editableForm">
                    <f:content>
                        <Label text="Employee Name" />
                        <co:DropdownBox   width="200px" >
                            <c:ListItem text="Emp1"/>
                            <c:ListItem text="Emp2"/>
                        </co:DropdownBox> 
                        <Label text="Type of Travel" />
                        <Select >
                            <c:ListItem key="B" text="Business"/>
                            <c:ListItem key="O" text="Other"/>
                        </Select>

                    </f:content>
                </f:SimpleForm>
            </l:content>
        </l:Grid>
    </c:FragmentDefinition>
4

1 回答 1

0

commons就像您对控件所做的那样,省略控件的宽度怎么样m?这sap.ui.commons.DropdownBox与控件一样宽sap.m.Select

在旁注中,我不会将m控件与common控件混在一起。你可能会遇到 CSS 问题


编辑:请参阅此工作示例,两者sap.ui.commons.DropdownBox大小sap.m.Select相同:

sap.ui.controller("view1.initial", {
  onInit : function() { }
});

var app = new sap.m.App({});

var oView = sap.ui.xmlview({
  viewContent: jQuery("#view1").html()
});

app.addPage(oView);
app.placeAt("uiArea");
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>

    <title>SAPUI5 template</title>

    <script id="sap-ui-bootstrap"
        src="https://sapui5.hana.ondemand.com/resources/sap-ui-core.js"
        data-sap-ui-theme="sap_bluecrystal"
        data-sap-ui-xx-bindingSyntax="complex"
        data-sap-ui-libs="sap.m"></script>

    <script id="view1" type="ui5/xmlview">
        <mvc:View 
          controllerName="view1.initial"
          xmlns:mvc="sap.ui.core.mvc"
          xmlns:l="sap.ui.layout"
          xmlns:f="sap.ui.layout.form"
          xmlns:c="sap.ui.core"
          xmlns:co="sap.ui.commons"
          xmlns:col="sap.ui.commons.layout"
          xmlns="sap.m">
            <l:Grid
            defaultSpan="L12 M12 S12"
            width="auto">
                <l:content>
                    <f:SimpleForm

                        minWidth="800"
                        maxContainerCols="2"
                        editable="true"
                        layout="ResponsiveGridLayout"
                        title="General Info"
                        labelSpanL="3"
                        labelSpanM="3"
                        emptySpanL="4"
                        emptySpanM="4"
                        columnsL="2"
                        columnsM="2"
                        class="editableForm">
                        <f:content>
                            <Label text="Employee Name" />
                            <co:DropdownBox>
                                <c:ListItem text="Emp1"/>
                                <c:ListItem text="Emp2"/>
                            </co:DropdownBox> 
                            <Label text="Type of Travel" />
                            <Select>
                                <c:ListItem key="B" text="Business"/>
                                <c:ListItem key="O" text="Other"/>
                            </Select>

                        </f:content>
                    </f:SimpleForm>
                </l:content>
            </l:Grid>
        </mvc:View>
    </script>

</head>

<body class="sapUiBody" role="application">
    <div id="uiArea"></div>
</body>
</html>

于 2015-03-31T08:14:07.473 回答