SAPUI5 WEBIDE使用

 

登陆WebIDE，新建项目

 

 

选择SAPUI5 Application, 点Next

 

 输入项目名，继续Next

 

 Finish

 

 

创建完成后，我们先看看WEBIDE自动帮我们新建的文件

 

 controller文件夹下，放着每个视图对应的js代码

View文件夹下，放着么个视图对应的xml（比如输入框、按钮等），和Dialog开发中的界面绘制类似。

先执行看看

 

 

 

 

 

再看看其中几个文件的内容

其中16行到21行，会调用Component.js文件， 该文件中，会读取manifest.json文件。manifest.json中，有我们的默认页面信息，因此会显示View1.view.xml页面

 

 

修改View1.view.xml，使用OpenWIth->Layout Editor打开该文件。

 

 页面分三个区域，最左边为SAPUI5控件列表，中间为页面，最右边为控件事件和属性。

 

 

 

从左边的Display中，找到Text控件，拖动到中间页面。然后在右边更改其text属性，填入“Hello World”

 

 

保存后执行，Hello World已经完成。 

 

 

双击打开View1.view.xml文件，多了如下的代码。 这个代码我们可以自己手工输入，也可以通过Layout Editor拖动（可视化开发）