使用自定义数据和布局属性以编程方式创建图标

Question

我正在尝试从 xml 视图以编程方式创建此图标<core:Icon      src="sap-icon://sys-help-2"      class="size1"      dataHelp:description="{i18n>path.to.description}"      width="100px"      color="#1C4C98" >      <core:layoutData>            <l:GridData span="L1 M1 S1" />      </core:layoutData></core:Icon>我可以想出简单的道具：  const icon = new sap.ui.core.Icon({    src: 'sap-icon://sys-help-2',    color: '#1C4C98',    width: '100px'  })  icon.addStyleClass('size1');但是对于dataHelp:description我<core:layoutData>不知道也找不到任何好的例子。有可能吗？

Answer 1

嵌套属性（也称为聚合）也可以使用new.

sap.ui.require([

    "sap/ui/core/Icon",

    "sap/ui/layout/GridData"

], function(Icon, GridData) {

    const oGridData = new GridData({ span: "L1 M1 S1" });

    const oIcon = new Icon({

        src: "sap-icon://sys-help-2",

        color: "#1C4C98",

        width: "100px",

        layoutData: oGridData

    });

    oIcon.data("description", this.getOwnerComponent().getModel("i18n").getResourceBundle().getText("path.to.description"));

});

可以添加自定义数据oControl.data("key", "value");