什么是 SAP OpenUI5 javascript 库| OpenUI5 及实例

503 阅读3分钟

在这篇文章中,我们将讨论OpenUI5的基础知识教程。

SAP OpenUI5简介

OpenUI5是开源的现代javascript框架,用于构建基于HTML5 规范的软件Web应用程序。

OpenUI5是一个响应式的互动框架,支持所有设备和所有流行的浏览器。

这个框架是由SAP开发的开源框架,类似于SAPUI5框架。

它支持内置的200多个组件。

要学习这个前端库,你需要基本的知识和了解javascript、HTML和CSS技术。

我们可以很容易地进行快速的应用开发,因为有几乎所有的UI部件可用,从button,Dropdowns 到复杂的gridtree

OpenUI5支持以下功能

  • 有200多个UI组件可用
  • 支持数据绑定的MVC
  • 支持远程API集成,并集成了对JSON、XML和ODATA等各种格式的支持
  • 支持内部化 - 本地化和全球化
  • 响应性,可在所有设备上使用,包括桌面应用程序、平板电脑和移动设备
  • 支持所有主要的浏览器
  • 可使用流行的小部件 布局和主题扩展功能 开源框架 混合应用开发和部署 一致和丰富的用户体验设计原则
  • 双向数据绑定 键盘互动

优势

  • 快速的应用开发
  • 在所有设备上都有一致的用户界面
  • 由于这是由SAP开发的,有大量的社区支持
  • 由于有大量的UI组件,生产力得到提高
  • 由于它是基于javascript/html5/css的,所以学习曲线较小。

它是可扩展的,有几个pluginstools ,可用于不同的IDE和编辑器。没有推荐特定的IDE。Eclipse是在OpenUI5中开发应用程序的主要IDE。

SAP UI开发工具可作为Sublime Text和Webstorm IDE和Eclipse的插件。SAP UI5和OpenUI5都提供了丰富的控件集。

SAP UI5是其产品套件中的一个产品。OpenUI5是在Apache许可证下发布的开放源代码。两者都是一样的,许可证是不同的。

你也可以使用SAP web IDE,这是一个云IDE,用于编写代码而不需要在你的本地环境中进行设置。

SAP OpenUI5 Hello World 示例

要编写应用程序,需要下载运行时库和SDK。运行任何应用程序(包括移动应用程序)都需要这两样东西。代码可以被部署到任何网络服务器上。对于这个示例应用程序,我们将使用CDN库。

   
<!DOCTYPE html>  
<html>  
<head>  
<meta http-equiv='X-UA-Compatible' content='IE=edge' />  
<title>SAPUI OpenUI5 Demo Applicaotn</title>  
    
  
   <script id="sap-ui-bootstrap"  
            src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"  
            data-sap-ui-theme="sap_bluecrystal"  
            data-sap-ui-libs="sap.ui.commons"  
       data-sap-ui-compatVersion='edge'>  
        </script>  
<script>  
            var oBtn;  
              
            oBtn = new sap.ui.commons.Button({  
                text : "Button Sample Demo",  
                press : function (oEvent) {  
                    alert(this.getText());  
                }  
            });  
            oBtn.placeAt("main");  
              
  
        </script>  
    
</head>  
<body class='sapUiBody'>  
    <div id='main'></div>  
  
</body>  
</html>  

上面的例子有一个按钮,点击这个按钮,就会显示警告内容。这是hello world的例子,展示了OpenUI5代码的原因。

SAP Fiori设计库

所有的openUI5控件都是基于Fiori librarySAP Fiori 是一种设计语言,在所有的组件/主题/设备上提供丰富一致的用户体验。fiori 提供不同的简单和复杂的控件,我们可以将其整合到前端应用程序中。

Fiori设计原则

  • 基于你的需求,你可以定制设计
  • 简单的使用和整合
  • 在所有设备上保持一致的用户体验
  • 流畅的用户体验