标签：
接上一篇，上一篇我尝试了部署一个UI5的项目到HCP上，成功访问了，发现去年折腾的时候创建了非常多的Application, 这次全部被我清除了。
这次准备尝试下SAP UI5的View， 研究下是如何工作的。
首先由于创建项目时勾选了创建一个空的view, 因此部分文件和代码已经创建完了：
在index.html中 以下代码已经被创建出来了：
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <meta http-equiv="X-UA-Compatible" content="IE=edge"> 5 <meta http-equiv=‘Content-Type‘ content=‘text/html;charset=UTF-8‘/> 6 7 8 <script src="resources/sap-ui-core.js" 9 id="sap-ui-bootstrap" 10 data-sap-ui-libs="sap.ui.commons" 11 data-sap-ui-theme="sap_bluecrystal"> 12 </script> 13 <!-- add sap.ui.table,sap.ui.ux3 and/or other libraries to ‘data-sap-ui-libs‘ if required --> 14 15 <script> 16 sap.ui.localResources("ui5_view"); 17 var view = sap.ui.view({id:"idMyView1", viewName:"ui5_view.MyView", type:sap.ui.core.mvc.ViewType.JS}); 18 view.placeAt("content"); 19 </script> 20 21 </head> 22 <body class="sapUiBody" role="application"> 23 <div id="content"></div> 24 </body> 25 </html>
其中 sap.ui.localResources("ui5_view") 我理解为加载同一目录下的ui5_view文件夹下的内容，
var view = sap.ui.view({id:"idMyView1", viewName:"ui5_view.MyView", type:sap.ui.core.mvc.ViewType.JS});
可以理解这段代码生成一个View， 但是在UI5的API中 并没有查到sap.ui.view这样的控件，非常不理解UI5是如何处理的(TODO)
回到MyView.view.js文件中，这就是项目生成的view，也就是上面引用到的view.
代码文件如下：
1 sap.ui.jsview("ui5_view.MyView", { 2 3 /** Specifies the Controller belonging to this View. 4 * In the case that it is not implemented, or that "null" is returned, this View does not have a Controller. 5 * @memberOf ui5_view.MyView 6 */ 7 getControllerName : function() { 8 return "ui5_view.MyView"; 9 }, 10 11 /** Is initially called once after the Controller has been instantiated. It is the place where the UI is constructed. 12 * Since the Controller is given to this method, its event handlers can be attached right away. 13 * @memberOf ui5_view.MyView 14 */ 15 createContent : function(oController) { 16 17 } 18 19 });
根据注释，createContent 在控件初始化的时候会被自动调用，可以用来返回HTML代码，我理解是这边可以定义很多UI5的控件，比如返回一个button.
1 createContent : function(oController) { 2 var oButton = new sap.ui.commons.Button( 3 "IdButton", 4 { 5 text: "MyButton", 6 enabled: true, 7 icon: "sap-icon://add", 8 press:function(){ 9 //event handler 10 } 11 }); 12 return oButton; 13 }
部署到HCP上后访问效果如下：
成功。
姑且以为：SAP UI5采用的MVC的模式， View负责控件的布局， 展示， Controller负责事件响应，Model负责数据的获取。
下次尝试Controller处理事件响应
标签：
原文地址：http://www.cnblogs.com/jerrylu/p/4415127.html
