zoukankan      html  css  js  c++  java
  • SAP UI5学习笔记之(二)熟悉的HelloWorld

    今天就开始进入SAP UI5实战练习了。

    按照惯例,学习任何一门语言和技术,都是从HelloWorld开始,这次也不例外!

    SAP UI5之HelloWorld

    首先新建SAP UI5工程。

    在WEB IDE的Workspace上右键→New→Project from Template。

     在弹出的创建向导中选择SAPUI5 Application,版本最好选最新版本。点击Next下一步。

    填写工程名称Project Name和命名空间Namespace。为了和SAPUI5 SDK中的例子保持一致,我使用了如下命名。然后点击Next下一步。

    然后填写View Type和View Name。

    View Type有四种选择。XML、JSON、JavaScript、HTML。推荐使用XML。因为XML使用最为普遍。

    View Name为了和SAPUI5 SDK中的例子保持一致,使用App。 

    然后点击Finish就完成工程的创建了。

     实现HelloWorld

    在walkthrough工程下的webapp文件夹下,就是我们自己编写代码的位置,MVC的所有代码都放在这个文件夹里。

    在webapp文件夹下找到index.html文件,我们的HelloWorld就在这个文件里实现。

    在body的div里加入HelloWorld。保存文件。

    右键工程→Run→Run as Web Application。在弹出的对话框中选择index.html(前三个都是测试文件,不选),点击OK,即可运行。

     

     

    HelloWorld实现!

     

    但是,我们在画面上不是只加了HelloWorld吗?怎么还有Title和一些布局出现呢?

    是这样的,SAPUI5在我们创建程序的时候已经为我们搭建好了MVC架构。

    因为我们运行时选择的是index.html,在程序加载过程中最先加载的是inde.html。

    在index.html中,我们可以看到引导层中有data-sap-ui-oninit="module:sap/ui/core/ComponentSupport",

    执行这一句话就会加载Component.js文件。Component.js文件会加载manifest.json、App.view.xml、App.controller.js等文件。

    App.view.xml文件是MVC架构的Model,在view.xml中我们就能看到Title的代码了。

     在index.html中,我们将引导层的data-sap-ui-oninit="module:sap/ui/core/ComponentSupport"这句删掉,再次保存运行,就会发现只有HelloWorld了。

     

     

  • 相关阅读:
    mySQL如何在查询的结果前添加序号
    bootstrap 列表前添加序号 1.10版本
    sql 如何优先显示不为空的字段 并进行排序
    java面向对象总结
    线程总结(二)
    数据库索引介绍(转载)
    线程总结(一)
    GUI图形界面编程之事件处理机制
    Eclipse快捷键大全(转载)
    JDBC数据库编程总结
  • 原文地址:https://www.cnblogs.com/snaildreams/p/13361925.html
Copyright © 2011-2022 走看看