如何在SAPUI5 的Shellbar 控件中实现自定义图标？答案

【问题标题】：How to implement custom icon in SAPUI5's Shellbar Control?如何在SAPUI5 的Shellbar 控件中实现自定义图标？
【发布时间】：2023-02-10 21:49:32
【问题描述】：

我实现了一项功能，以便我的 SAPUI5 应用程序的用户可以在不同的 SAPUI5 主题之间切换。现在我想在我的应用程序的现有 ShellBar 中放置一个按钮，以从那里触发该功能。

目前我有一个包含以下代码的片段，我想在ShellBar 中的一个简单按钮中使用它。我尝试了不同的东西，比如 f.ex。通过 shellbar 的 avaterPressed 属性调用它，但它看起来一团糟 - 如果有人能在这里帮助我，我会很高兴 - 谢谢！

<core:FragmentDefinition
    xmlns="sap.m"
    xmlns:core="sap.ui.core">
            <Menu itemSelected="onSelectTheme" >
                <MenuItem text="Choose Theme">
                    <items>
                        <MenuItem key="sap_fiori_3" text="Standard Light" />
                        <MenuItem key="sap_fiori_3_dark" text="Standard Dark" />
                        <MenuItem key="sap_hcw" text="High Contrast White" />
                        <MenuItem key="sap_hcb" text="High Contrast Black" />
                    </items>
                </MenuItem>
            </Menu>
</core:FragmentDefinition>

它应该看起来像下面示例中的“管理员”按钮（而不是“用户设置”，应该是我上面显示的片段中的文本“选择主题”：https://sapui5.hana.ondemand.com/sdk/test-resources/sap/tnt/demokit/toolpageapp/webapp/index.html?sap-ui-theme=sap_horizon#/

【问题讨论】：

标签： sapui5

【解决方案1】：

链接示例中的开发人员不使用 SAPUI5 控件 ShellBar，而是使用 ToolHeader，您也可以在控件 ToolPage 中实现它。

使用ToolHeader，您可以简单地在任何您喜欢的地方添加一个Button，并从 f.ex 中调用该片段。个人资料图片按钮（如下所示）。

<tnt:ToolHeader>
  <Avatar src="..." press="YOUR_FUNCTION_TO_OPEN_FRAGMENT"/>
</tnt:ToolHeader>

【讨论】：

感谢您的评论 - 它有效！但这意味着我必须摆脱 ShellBar 并使用 ToolHeader。

【解决方案2】：

如果您想继续使用 ShellBar，您可以在 Avatar 上实现按下事件，并根据需要使用 ActionSheet。

https://sapui5.hana.ondemand.com/#/entity/sap.m.ActionSheet/sample/sap.m.sample.ActionSheet

【讨论】：