通过最简单的button控件,深入学习SAP UI5框架代码系列之零

Jerry曾经作为SAP成都研究院的Fiori应用开发人员,从事了将近3年的SAP CRM Fiori应用开发,在使用SAP UI5的过程中,遇到过形形色色的问题,不少都是通过调试SAP UI5框架代码自行解决的。平时也会有不少朋友向我咨询开发过程中遇到的和SAP UI5相关的问题,所谓授人以鱼不如授人以渔,如果一个SAP UI5开发人员对UI5框架代码有些许了解,在遇到问题时能够更有针对性更高效地去定位问题。然而SAP UI5框架代码浩如烟海,初学者往往鼓起勇气想一探究竟,但却不知道如何下手,最后迷失在UI5的源代码海洋里。

Jerry这个系列,通过SAP UI5最简单的Hello World应用中最简单的button控件出发,试图向大家展示SAP UI5框架代码中围绕该控件的相关实现。虽然使用Fiori Elements,开发人员大多数时候无需手动编写操作UI5控件的JavaScript代码,然而在遇到Fiori Elements不能按照自己的期望工作的时候,如果熟悉SAP UI5框架实现,就不至于完全不知所措。

这个系列的英文版在五年之前发布于SAP社区,收到了很好的反馈,也感谢SAP UI5开发团队的同事,Andreas Kunz,对我的系列做出了肯定,同时对文章中叙述不完善的地方做出了补充。

虽然五年前Jerry写作时给予的SAP UI5版本是1.31.0, 五年之后的今天(2020年10月)最新版本已经成为1.82.4, 但是这个系列除了介绍SAP UI5框架实现的部分细节之外,更重要的是向大家展示,Jerry自己是如何通过代码调试的方法,来自学SAP UI5框架代码的。

本系列针对SAP UI5框架的所有调试,都是基于源代码的Debug Sources版本的,即同时按住"Shift+Alt+Ctrl+P", 在弹出框里勾上"Use Debug Sources", 重新刷新应用以加载Debug Sources.

系列目录

(0) SAP UI5应用开发人员了解UI5框架代码的意义(本文)

(1) UI5 module懒加载机制

(2) UI5 控件渲染机制

(3) HTML原生事件 VS SAP UI5 Semantic事件

(4) UI5控件元数据实现细节

(5) UI5控件的实例数据实现细节

(6) UI5控件数据绑定的实现原理

(7) UI5控件数据绑定的三种模式:One Way,Two Way和OneTime实现原理比较

(8) UI5控件ID的生成逻辑

(9) UI5控件的多语言(国际化,Internationalization,i18n)支持的实现原理

(10) XML视图里的button控件

(11) button控件和它背后的DOM元素

敬请期待本系列的下一篇文章:UI5 module懒加载机制。希望我不会烂尾。

如果大家等不及这个系列的中文版,可以移步SAP社区,直接阅读我五年前写的英文版:

https://blogs.sap.com/2015/10/26/a-tutorial-how-i-do-self-study-on-a-given-fiori-control-and-ui5-framework-code-behind/

感谢阅读。

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20201027A0IBBG00?refer=cp_1026
  • 腾讯「云+社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 yunjia_community@tencent.com 删除。

扫码关注云+社区

领取腾讯云代金券