表中的图标与mergeDuplicates =“true”不兼容

时间:2015-02-02 16:33:32

标签: sapui5

我有一个表,我想在第一列中合并重复项:

<Column mergeDuplicates="true">
    <Text text="Society"/>
</Column>
<Column>
    <Text text="Ref2"/>
</Column>
 ...

我想在第一列中有一个复杂的元素:一个显示社会旗帜的图标。

<items>
    <ColumnListItem>
        <cells>
            <StandardListItem title="{model>society/description}"
             icon="{path: 'model>society/code', 
             formatter: 'ui5bp.Formatter.iconGeneral'}"/>
            <!--<Text text="{model>society/description}"/>-->
            <Text text="{model>ref2}"/>
        </cells>
    </ColumnListItem>
</items>

但是如果我将StandardListItem设置为简单文本,则mergeDuplicates =“true”不起作用。

复杂列项和mergeDuplicates属性是否不兼容?

现在StandardListItem有这个结果: enter image description here

如何创建一个正确的“MyCustomColumnListItem”来显示左侧的标志和右侧的描述,没有空格上下?

2 个答案:

答案 0 :(得分:1)

您的示例中的数据不是mergeDuplicate ready(从您显示的内容,没有任何内容将被合并),但我猜测并设置了一些可能类似的测试数据。您可以查看使用具有图标和文本的ObjectAttribute,如此片段所示。

&#13;
&#13;
sap.ui.xmlview("main", {
	viewContent: jQuery("#view-main").html()
})
.setModel(new sap.ui.model.json.JSONModel({
    records : [
        { icon : "http://www.flags.net/images/smallflags/ANTA0001.GIF", text : "Delete", comment : "delete" },
        { icon : "http://www.flags.net/images/smallflags/ANBA0001.GIF", text : "Delete", comment : "negative" },
        { icon : "http://www.flags.net/images/smallflags/ANDR0001.GIF", text : "Remove", comment : "sys-minus" }
    ]
}))
.placeAt("content");
&#13;
<script src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js" id="sap-ui-bootstrap" data-sap-ui-libs="sap.m" data-sap-ui-theme="sap_bluecrystal" data-sap-ui-xx-bindingSyntax="complex"></script>
<div id="content"></div>

<script id="view-main" type="ui5/xmlview">
	<mvc:View
		displayBlock="true"
		xmlns:mvc="sap.ui.core.mvc"
		xmlns="sap.m">
		<Table
            items="{/records}">
            <columns>
                <Column mergeDuplicates="true"><Label text="Icon" /></Column>
                <Column><Label text="Comment" /></Column>
            </columns>
            <items>
                <ColumnListItem>
                    <cells>
                        <ObjectStatus
                            text="{text}"
                            icon="{icon}" />
                        <Text text="{comment}" />
                    </cells>
                </ColumnListItem>
            </items>
        </Table>
	</mvc:View>
</script>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

不确定自定义控件或ListItem是否有效...
作为替代方案,您还可以使用两列,每列设置mergeDuplicates="true",并分别显示ImageText。那应该肯定有用

即:

<Table id="tbl" items="{model>/yourData}">
    <columns>
        <Column mergeDuplicates="true" mergeFunctionName="getSrc">
            <Text text="Society" />
        </Column>
        <Column mergeDuplicates="true" />
    </columns>
    <items>
        <ColumnListItem>
            <cells>
                <Image src="{model>society/flagImg}"/>
                <Text text="{model>society/description}" />
            </cells>
        </ColumnListItem>
    </items>
</Table>