SAP UI5 使用 Smart Control 的一个具体例子
SAP 一个 例子 具体 UI5 Control Smart 使用
2023-09-14 09:03:54 时间
我们在本地 Visual Studio Code 里, 按照下面两篇文章,完成了 SAP UI5 的应用开发,
最后能得到一个列表,效果如下:
本文我们使用 SAP UI5 提供的 Smart 控件来继续丰富这个应用。
从下面三个 namespace 引入 Smart 控件:
- xmlns:smartFilterBar=“sap.ui.comp.smartfilterbar”
- xmlns:smartList=“sap.ui.comp.smartlist”
- xmlns:smartTable=“sap.ui.comp.smarttable”
xml view 的实现源代码:
<mvc:View controllerName="tutorial.products.controller.Products" displayBlock="true"
xmlns="sap.m"
xmlns:smartFilterBar="sap.ui.comp.smartfilterbar"
xmlns:smartList="sap.ui.comp.smartlist"
xmlns:smartTable="sap.ui.comp.smarttable"
xmlns:mvc="sap.ui.core.mvc">
<Page id="Products">
<smartFilterBar:SmartFilterBar id="smartFilterBar" persistencyKey="UniqueAndStablePersistencyKey" entitySet="Products" considerSelectionVariants="true" />
<smartList:SmartList id="smartProductList" smartFilter="smartFilterBar" entitySet="Products" expandFields="Category" header="Products List" showRowCount="true" showFullScreenButton="true" enableAutoBinding="true">
<smartList:listItemTemplate>
<StandardListItem id="listTemplate" type="Navigation" press="handleListItemPress" title="{ProductName}" info="{= ${UnitPrice} + ' €' }" description="{Category/CategoryName}" />
</smartList:listItemTemplate>
</smartList:SmartList>
</Page>
</mvc:View>
npm run start 启动工
程,最后看到的 Smart List:
Smart Filter 控件提供的开箱即用的功能:
更多Jerry的原创文章,尽在:“汪子熙”:
相关文章
- 163. 通过一个实际例子,讲解 SAP UI5 Compatibility Version 的概念和运行时绑定解析器的选择逻辑
- 162. 通过一个具体的例子,深入了解 SAP UI5 控件数据双向绑定的工作原理和问题排查方法
- 用 SAP UI5 Select 控件(下拉列表),来驱动表格控件(Table)刷新的一个实战例子试读版
- 本地修改远端 SAP UI5 框架文件的一个小技巧
- SAP UI5 应用的调试标志位的本地存储逻辑 - local storage 使用的一个例子
- 响应式编程在 SAP 标准产品 UI 开发中的一个实践
- SAP CRM One Order里Complex Set的一个例子:Partner Set
- SAP CRM WebClient UI cross component跳转的一个具体例子
- Rxjs debounce 操作符在 SAP Spartacus 函数节流中的一个实际使用例子
- SAP Spartacus AutoFocus directive的一个例子
- SAP Spartacus里使用defer的一个例子
- SAP Spartacus当前产品主数据数据格式的一个例子
- 一个SAP成都研究院开发工程师的2020年度总结:未知生,焉知死
- SAP CRM AET Application Reference类型扩展字段的一个例子
- SAP AET 框架是如何判断一个 SAP CRM UI 能否被扩展
- SAP UI5 应用开发教程之八十一 - 采用 OPA5 进行 SAP UI5 集成测试(Integration Test)的一个例子试读版
- SAP人工智能服务Recast.AI的一个简单例子