如何设置不可见的项目而不是没有"可见"属性?

时间:2014-09-23 10:14:24

标签: sapui5

下面有一个按钮和一个网格。 在网格内部我有一些元素(输入,复选框,标签......) 如何设置不能同时将网格内的所有元素一起显示在一起?

<Grid xmlns="sap.ui.layout" id="idGrid">
            <content>

                <Label xmlns="sap.m"
                    id="idLabel"
                    design="Standard"
                    text="the label">
                </Label>

                <Input xmlns="sap.m"
                    id="idInput"
                    value="the input">
                </Input> 

            </content> 
</Grid>

1 个答案:

答案 0 :(得分:2)

将网格内容放入VerticalLayout。

&#13;
&#13;
sap.ui.controller("test.controller", {

   handleHide: function(oEvent) {
        var bt = oEvent.getSource();
        var vl = this.getView().byId("vlContent");
        if (vl.getVisible()) {
            vl.setVisible(false);
            bt.setText("Show");
        } else {
            vl.setVisible(true);
            bt.setText("Hide");
        }
    }
});

var oView = sap.ui.xmlview({
    viewContent: jQuery("#view1").html()
});
oView.placeAt("content");
&#13;
<script src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js" id="sap-ui-bootstrap" data-sap-ui-theme="sap_bluecrystal" data-sap-ui-libs="sap.m"></script>
<script id="view1" type="sapui5/xmlview">
    <mvc:View xmlns:l="sap.ui.layout" controllerName="test.controller" xmlns:mvc="sap.ui.core.mvc" xmlns="sap.m" xmlns:f="sap.ui.layout.form">
        <l:Grid defaultSpan="L12 M12 S12" width="auto" id="idGridDetail">
            <l:content>
                <l:VerticalLayout id="vlContent">


                    <f:SimpleForm id="SimpleFormDisplay111" minWidth="1024" maxContainerCols="2" editable="false" layout="ResponsiveGridLayout" title="" labelSpanL="3" labelSpanM="3" emptySpanL="4" emptySpanM="4" columnsL="1" columnsM="1">
                        <f:content>
                            <Label text="Se OC valido per Incas" />
                            <Text text="{/seOCValidoPerIncas}" />
                            <Label text="ocdc" id="idLabelCdc" />
                            <Text text="{/cdc}" id="idTextCdc" />
                            <Label text="Ultimo passaggio Incas" />
                            <Text text="{/ultimoPassaggioIncas}" />
                        </f:content>
                    </f:SimpleForm>

                    <Panel expandable="true" expanded="true" headerText="Passaggio da Rampa a Incas">
                        <content>
                            <Table xmlns="sap.m" id="idTable_RampaToIncas_testate" items="{
                                      path: '/passaggioRampaToIncas/testate'}">
                                <headerToolbar>
                                    <Toolbar>
                                        <Label text="Testate" design="Bold"></Label>
                                    </Toolbar>
                                </headerToolbar>
                                <items>
                                    <ColumnListItem>
                                        <cells>
                                            <Text text="{dataIns}" />
                                            <Text text="{sePassatoABridge}" />
                                            <Text text="{comando}" />
                                            <Text text="{comando_desc}" />
                                            <Text text="{tag}" />
                                            <Text text="{viaggio}" />
                                        </cells>
                                    </ColumnListItem>
                                </items>
                            </Table>

                            <Label text=""></Label>

                            <Table xmlns="sap.m" id="idTable_RampaToIncas_righe" items="{
                                      path: '/passaggioRampaToIncas/righe'}">
                                <headerToolbar>
                                    <Toolbar>
                                        <Label text="Righe" design="Bold"></Label>
                                    </Toolbar>
                                </headerToolbar>
                                <items>
                                    <ColumnListItem>
                                        <cells>
                                            <Text text="{dataIns}" />
                                            <Text text="{sePassatoABridge}" />
                                            <Text text="{comando}" />
                                            <Text text="{comando_desc}" />
                                            <Text text="{riga}" />
                                            <Text text="{articolo}" />
                                        </cells>
                                    </ColumnListItem>
                                </items>
                            </Table>

                            <Label text=""></Label>

                            <Table xmlns="sap.m" id="idTable_RampaToIncas_eventiAttivazione" items="{
                                      path: '/passaggioRampaToIncas/attivazione'}">
                                <headerToolbar>
                                    <Toolbar>
                                        <Label text="Eventi Attivazione" design="Bold"></Label>
                                    </Toolbar>
                                </headerToolbar>
                                <items>
                                    <ColumnListItem>
                                        <cells>
                                            <Text text="{dataIns}" />
                                        </cells>
                                    </ColumnListItem>
                                </items>
                            </Table>

                        </content>
                    </Panel>


                    <Panel expandable="true" expanded="true" headerText="Passaggio da Incas a Rampa">
                        <content>
                            <Table xmlns="sap.m" id="idTable_IncasToRampa_righe" items="{
                                      path: '/passaggioIncasToRampa/righe'}">
                                <headerToolbar>
                                    <Toolbar>
                                        <Label text="Righe" design="Bold"></Label>
                                    </Toolbar>
                                </headerToolbar>
                                <items>
                                    <ColumnListItem>
                                        <cells>
                                            <Text text="{dataIns}" />
                                            <Text text="{riga}" />
                                            <Text text="{articolo}" />
                                            <Text text="{qta_caricata}" />
                                            <Text text="{qta_prevista}" />
                                        </cells>
                                    </ColumnListItem>
                                </items>
                            </Table>

                        </content>
                    </Panel>


                </l:VerticalLayout>

            </l:content>
        </l:Grid>
        <Button text="Hide" press="handleHide" />
    </mvc:View>
</script>
<boy class="sapUiBody" id="content" />
&#13;
&#13;
&#13;