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

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([&nbsp; &nbsp; "sap/ui/core/Icon",&nbsp; &nbsp; "sap/ui/layout/GridData"], function(Icon, GridData) {&nbsp; &nbsp; const oGridData = new GridData({ span: "L1 M1 S1" });&nbsp; &nbsp; const oIcon = new Icon({&nbsp; &nbsp; &nbsp; &nbsp; src: "sap-icon://sys-help-2",&nbsp; &nbsp; &nbsp; &nbsp; color: "#1C4C98",&nbsp; &nbsp; &nbsp; &nbsp; width: "100px",&nbsp; &nbsp; &nbsp; &nbsp; layoutData: oGridData&nbsp; &nbsp; });&nbsp; &nbsp; oIcon.data("description", this.getOwnerComponent().getModel("i18n").getResourceBundle().getText("path.to.description"));});可以添加自定义数据oControl.data("key", "value");