SAPUI5アイコンの色を変更する

Question

モデルに応じてアイコンを使い、色を変更したいと思います。私はoSettingsModelにisOnline変更したときにアイコンは、色に変化するであろう

style: "color:{/oSettingsModel/isOnline}" 

その方法：私はこのような何かにアイコンの色を定義するにはどうすればよい

var wirelessHeadItem = new sap.ui.unified.ShellHeadItem({ 
    icon: "sap-icon://upload-to-cloud" 
}); 

。

Answer 1

このコントロールには、標準プロパティで色を指定する可能性がないため、custom data attributeとexpression bindingを使用して回避策を適用できます。 データ・色・緑またはデータ - を：

主なポイントは、カスタムデータ項目のwriteToDom属性を指定することができ、そして、あなたのCSSにあなたが必要なHTML属性値のスタイルを定義することができるということですカラー - 赤。

JS：

var wirelessHeadItem = new sap.ui.unified.ShellHeadItem({ 
    icon: "sap-icon://upload-to-cloud", 
    customData: [ 
     new sap.ui.core.CustomData({ 
      key: "color", 
      value: "{= ${/oSettingsModel/isOnline} ? 'green' : 'red' }", 
      writeToDom: true 
     }); 
    ] 
}); 

CSSは次のようになります。

div[data-color=green] { 
    color: green; 
} 
div[data-color=red] { 
    color: red; 
}