如何隐藏一组UI组件的

我有一组部件（例如Label + TextArea）如何隐藏一组UI组件的

<Label text="Country"/> 
<TextArea value="{model>/country}"/>

现在，躲我被迫设置visible属性为每个组件组

<Label visible="false" text="Country" /> 
<TextArea visible="false" value="{model>/country}"/>

我想用它的特性的“容器”由事务所设置属性隐藏整个基团，例如visible

<Container visible="false"> 
    <Label text="Country" /> 
    <TextArea value="{model>/country}"/> 
</Container>

我有例如一个VerticalLayout其中包含Panel，其中包含SimpleForm。 SimpleForm包含4对情侣Label - TextArea，我想小组第一和第二的夫妇无添加额外的保证金或其他UI特性

来源

2015-10-14 padibro

东西一样标签和文本区域是“控制”而不是“组件”。 – hirse

有在UI5可用的各种容器控件。面板，flexbox，这VerticalLayout的，HorizontalLayout，SimpleForm等

<Panel visible="false"> 
    <content> 
    <Label text="Country" /> 
    <TextArea value="{model>/country}"/> 
    </content> 
</Panel>

作为备用&一个更好的办法，而不是家长控制包装内的控件，您可以创建，你保持控制可见性状态的模型。

var oModel = new sap.ui.model.json.JSONModel({group1Visibile : false}); 
<view-instance>.setModel(oModel,"controlStates"); 

<Label text="Country" visible ="{controlStates>/group1Visible}"/> 
<TextArea value="{model>/country}" visible ="{controlStates>/group1Visible}"/>

只是操纵模型的值将反映到所有的控件。

来源

2015-10-14 16:00:20 sakthi

面板，FlexBox，VerticalLayout，HorizontalLayout，SimpleForm等添加额外的UI风格（例如添加边距）。例如，我有一个VerticalLayout，其中包含一个Panel，其中包含一个SimpleForm。 SimpleForm包含4对夫妇Label-TextArea，我希望第1组和第2组没有添加额外的边距或其他UI属性 – padibro

您可以添加CSS类.sapUiNoContentPadding，.sapUiNoMargin以删除边距和填充。 https://openui5.hana.ondemand.com/explored.html?sap-ui-debug=true#/entity/sap.ui.core.ContainerPadding/samples – sakthi

另一种选择是使用JavaScript和样式类（对不起，JavaScript的观点，我不使用XML多）：

var oLabel = new sap.m.Label({ 
    text:"Text", 
    labelFor: oText}).addStyleClass("hideGroup"); 
var oText = new sap.m.Text({ 
    text: "Hello World!" 
}).addStyleClass("hideGroup"); 

var oButton = new sap.m.Button({ 
    text: "Press to Hide/Show Group", 
    press: function(){ 
     var els = document.getElementsByClassName("hideGroup"); 
     for(var i=0; i<els.length; ++i){ 
      var s = els[i].style; 
      s.visibility = s.visibility==='visible' ? 'hidden' : 'visible'; 
     } 
    } 
});

这里是一个工作JSBIN例如：LINK 这只是一个例如，您可以根据自己的需要进行调整。

欲了解更多信息，看看这个线程：LINK

来源

2015-10-15 08:54:38 keshet

如何隐藏一组UI组件的

回答

相关问题