1

我想更改标准的“笔”图标

DetailAndActive 类型的 StandardListItem

. 有没有办法这样做？

到目前为止我的 XML：

            <List
                id="master1List"
                items="{/path}"
                mode="{device>/listMode}"
                select="onSelect"
                itemPress="showDetail"
                growing="true"
                growingScrollToLoad="true">
                <items>
                    <StandardListItem 
                        type="DetailAndActive" 
                        activeIcon="sap-icon://message-information"
                        id="master1ListItem"
                        press="onSelect" 
                        title="{title}">
                    </StandardListItem>
                </items> 
</List>

据我所知，只有属性“icon”（我不需要）和“activeIcon”（我设置但也没有显示在 itemPress/tab 上）。我以为我可以通过 css 更改它，但它是在数据属性中设置的（图标字体，不是我可以覆盖的 uri），然后应用：

    .sapUiIcon:before {
  content: attr(data-sap-ui-icon-content);
...

谢谢..

[编辑：]我接受以下答案是正确的，因为它有效。但是正如您在我的评论中看到的那样，我想通过使用这里描述的聚合元数据来接受控件：

    metadata: {
    aggregations: {
        "Button" : {type : "sap.m.Button", multiple : false, visibility: "public"}
    },
    defaultAggregation: "Button"
},

到目前为止，这有效，以至于我现在可以在我的 XML 视图中向 ListItem 添加一个 Button 控件，但它没有被渲染:-) 还有什么我在这里想念的想法吗？

4

1 回答 1

1

该图标在控件深处进行了硬编码。我发现我可以扩展 StandardListItem 以获得你想要的结果。

sap.m.StandardListItem.extend('my.StandardListItem', {
    renderer: {},
    constructor: function(sId, mProperties) {
        sap.m.StandardListItem.prototype.constructor.apply(this, arguments);
    var sURI = sap.ui.core.IconPool.getIconURI("action");
    this._detailIcon =
        new sap.ui.core.Icon({
            src:sURI})
        .setParent(this, null, true)
        .addStyleClass("sapMLIBIconDet");            
    }
});

http://jsbin.com/tuqufe/1/edit?js,output有一个工作示例

坏消息是，在下一个版本（1.28.?）中，完成此操作的方式发生了显着变化，因此您将需要重做扩展控制。

[编辑：]对不起，我忘记了这个。我刚刚使用 OpenUI5 V1.30 beta 库构建了一个快速示例。现在关键代码看起来像这样......

sap.m.StandardListItem.extend('my.StandardListItem', {
    metadata: {
        properties: {
            "detailIcon": "string"
        }
    },
    renderer: {},
    setDetailIcon: function(icon) {
        this.DetailIconURI = sap.ui.core.IconPool.getIconURI(icon);
    }
});

在http://jsbin.com/bayeje/1/edit?js,output有一个示例

于 2015-04-11T00:29:51.027 回答