2015-04-10 13 views
1

Я хотел бы изменить стандартный значок "пера" изUI5 StandardListItem DetailAndActive изменения Иконка

StandardListItem of type DetailAndActive

. Есть ли способ сделать это?

моего 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> 

Насколько я знаю, есть только свойство «значок» (который мне не нужно) и «activeIcon» (который я предлагаю, но которые также не показан на itemPress/таб). Я думал, что я мог бы изменить это с помощью CSS, но она установлена ​​в данном атрибуте (Icon шрифт, не могу URI перезаписи), а затем применяюсь:

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

Спасибо ..

[EDIT: ] Я принял правильный ответ, потому что он работает. НО, как вы можете прочитать в моем комментарии, я хотел бы сделать возможным принять управление с помощью метаданных скоплений, как описанный here:

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

Это работает до сих пор, что это я теперь разрешен добавлять кнопки контроль над ListItem в моем представлении XML, но он не отображается :-) Любые идеи, которые я пропустил здесь дополнительно?

ответ

1

Значок жестко закодирован в глубине управления. Я обнаружил, что могу расширять стандартListItem, чтобы получить желаемый результат.

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.?) Так, что это будет сделано изменения значительно, так что вам нужно будет повторить расширенный контроль.

[EDIT:] Извините, что я забыл об этом. Я только что построил быстрый образец с бета-библиотекой OpenUI5 V1.30. Теперь ключевой код выглядит следующим образом ...

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

+0

благодаря @Graham, я получил эту работу, чтобы использовать на мой взгляд XML! Мне это нужно очень часто. Я думал о добавлении _default aggregation_, который можно было добавить в элемент управления. Потому что, если я пытался добавить значок в ListItem раньше, у меня возникла ошибка: 'не могу добавить прямой дочерний элемент без агрегации по умолчанию, определенный для элемента управления StandardListItem'. Так что это должно быть возможно, но я не узнал, как это сделать. Я попытался установить агрегацию метаданных, а в конструкторе использовать метод 'addAggregation()', но не работал. –

+0

Обновленный ответ с версией, которая работает с последними библиотеками OpenUI5. –

+0

@GrahamRobbo также можно связать элементы из JSON? Я добавил, что также сам CustomList в самом коде привязки работает, но он не показывает пользовательский значок. http://jsbin.com/kijisanepa/edit?js,output – Matthias

 Смежные вопросы

  • Нет связанных вопросов^_^