ui5-文档-1-前言

ricoo ricoo     2023-02-01     719

关键词:

主要是将SAP UI5官网文档做下了解,相关内容请查阅:https://sapui5.hana.ondemand.com/#/topic

设置您的开发环境并阅读我们的教程。它们使用交互式格式中的实际示例向您介绍SAPUI5的所有主要开发范例。

先决条件和设置:您应该熟悉JavaScript。设置开发环境:获取SAPUI5并将其放置在一个位置,该位置可以在resources文件夹中访问(SAP Web IDE不需要)。有关更多信息,请参见开发环境。在放置应用程序内容的地方设置一个文件夹。我们将这个文件夹称为“app文件夹”。

学习路径:

技术分享图片

Hello World:https://sapui5.hana.ondemand.com/#/topic/592f36fd077b45349a67dcb3efb46ab1.html

Walkthrough:https://sapui5.hana.ondemand.com/#/topic/3da5f4be63264db99f2e5b04c5e853db.html

Troubleshooting:https://sapui5.hana.ondemand.com/#/topic/5661952e72df471b932eddc10350c081.html

Data Binding:https://sapui5.hana.ondemand.com/#/topic/e5310932a71f42daa41f3a6143efca9c.html

OData V4:https://sapui5.hana.ondemand.com/#/topic/bcdbde6911bd4fc68fd435cf8e306ed0.html

Navigation and Routing:https://sapui5.hana.ondemand.com/#/topic/1b6dcd39a6a74f528b27ddb22f15af0d.html

Testing:https://sapui5.hana.ondemand.com/#/topic/291c9121e6044ab381e0b51716f97f52.html

Mock Server:https://sapui5.hana.ondemand.com/#/topic/3a9728ec31f94ca18a7d543ce419d85d.html

Worklist App:https://sapui5.hana.ondemand.com/#/topic/6a6a621c978145ad9eef2b221d2cf21d.html

Sap Fiori2.0 App:https://sapui5.hana.ondemand.com/#/topic/c4de2df385174e58a689d9847c7553bd.html

Rule Builder Control:https://sapui5.hana.ondemand.com/#/topic/67fcb301d0504fd4a24915edf4058c51.html

3D Viewer:https://sapui5.hana.ondemand.com/#/topic/8deac9d302504962a01149c3cc913ee0.html

ICE Cream Machine:https://sapui5.hana.ondemand.com/#/topic/e5b7f8a93e4b432198869b3ae75981b0.html

提示:在SAP站点上发布的使用SAPUI5信息开发Web应用程序的openSAP课程向您介绍了SAPUI5的主要概念。每个单元的JavaScript练习将为您提供开发自己的响应性Web应用程序所需的技术背景。我们将从最基本的东西和大量的实际编码开始。在这几周的课程中,您将更多地了解强大的开发概念,并真正掌握SAPUI5。

 

下载教程步骤的代码:

要从演示工具包下载代码,请遵循以下步骤:

  1. 选择要处理的教程步骤的编码部分中的链接,或者在演示工具包的样例部分中找到代码(通过“教程”筛选以获得可用教程的列表)。

  2. 在标题栏的右边选择带有此示例工具提示的显示源代码的图标,以显示此示例中包含的所有文件。

  3. 选择Download按钮。将zip文件下载到本地计算机。

  4. 按照下面的描述调整项目配置文件以匹配您的开发环境。

  5. 通过调用开发环境中的HTML页面来测试项目,并确保应用程序显示的特性与步骤预览中显示的完全相同。

 

使代码适应您的开发环境:

您可能需要根据本地开发环境调整部分代码,才能使应用程序正常工作。请仔细检查以下设置:

  ? 项目路径和部署

  所有教程都假定应用程序已经部署,并且可以在web服务器上的某个路径下访问。如果没有Web服务器,您将无法运行该应用程序,因为浏览器由于安全限制,不允许您在本地加载所需的资源。

  ? SAPUI5资源

  您可以下载运行时并将其部署到(本地)Web服务器上,也可以参考位于https://sapui5.hana.ondemand.com/resources/sap-ui-core.js的CDN版本。一些开发环境(如SAP Web IDE)还提供了用于测试目的的本地运行时。如果您从演示工具包中的示例下载代码,则必须调整项目中包含的所有HTML页面引导部分中的资源路径。在教程代码中,我们假设可以从服务器的/resources路径访问SAPUI5。

  ?访问远程服务

  由于跨源资源共享(CORS)策略,浏览器通常阻止访问远程资源。如果希望调用实际服务或远程资源,则必须配置开发环境或远程服务器以接受这些请求。这很大程度上取决于开发环境,下面将对其进行更详细的描述。

 

故障排除

  如果遇到问题,请查看“基本知识”Essentials下的“故障排除”Troubleshooting部分,或参考故障排除教程 Troubleshooting tutorial

如果无法修复此问题,请尝试下载预览或当前步骤的解决方案。这应该可以再次修复您的项目,只是不要忘记再次检查资源路径和项目配置文件。

 

相关信息

App Templates: Kick Start Your App Development

Demo Apps

ui5-文档-4.36-deviceadaptation(代码片段)

现在,我们根据运行应用程序的设备配置控件的可见性和属性。通过使用sap.ui。设备API和定义一个设备模型,我们将使应用程序在许多设备上看起来很棒。Preview Onphonedevices,thepaneliscollapsedtosavescreenspaceandabuttonishiddenCodingYoucanvi... 查看详情

ui5-文档-4.20-aggregationbinding(代码片段)

现在我们已经为我们的应用建立了一个良好的结构,是时候添加更多的功能了。通过添加一些JSON格式的发票数据,我们开始探索数据绑定的更多特性,这些发票数据显示在面板下面的列表中。 Preview Alistofinvoicesisdisplayedbe... 查看详情

ui5-文档-2-开发环境

这一部分将指导您安装、配置和设置SAPUI5开发环境的最常见和推荐用例。请注意:您可以在不同的平台上使用SAPUI5。各自平台的许可和维护条件也适用于SAPUI5。例如,如果在SAP云平台上使用SAPUI5工具,则适用SAP云平台的许可和维... 查看详情

ui5-文档-4.3-controls(代码片段)

现在是时候构建我们的第一个小UI了,将HTML主体中的“HelloWorld”文本替换为SAPUI5控件sap.m.Text。首先,我们将使用JavaScript控件接口来设置UI,然后将控件实例放入HTML体中。Preview The"HelloWorld"textisnowdisplayedbyaSAPUI5controlCodin... 查看详情

ui5-文档-4.35-responsiveness(代码片段)

在这一步中,我们将改进应用程序的响应能力。SAPUI5应用程序可以在手机、平板电脑和桌面设备上运行,我们可以对应用程序进行配置,以便为每个场景充分利用屏幕空间。幸运的是,SAPUI5控件类似于sap.m.Table已经提供了许多我... 查看详情

ui5-文档-4.21-datatypes(代码片段)

发票清单已经很好看了,但是没有指定价格的发票是什么?通常价格以技术格式存储,并带有‘。数据模型中的分隔符。例如,我们的菠萝发票上的计算价格是87.2,没有货币。我们将使用SAPUI5数据类型正确地格式化价格,使用一... 查看详情

ui5-文档-4.19-reusedialogs(代码片段)

在此步骤中,我们将扩展重用概念,并在组件级别调用对话框。在步骤16中,我们创建了一个对话框作为片段,以使其可跨视图或跨整个应用程序重用。但是我们将检索对话框实例和分别打开和关闭对话框实例的逻辑放置在HelloPa... 查看详情

livecharts文档-1前言

原文:LiveCharts文档-1前言LiveCharts文档-1前言最近做一个企业应用,客户端使用的是WPF,需要生成一个漂亮的统计图表,以前WinForm有Chart控件,但是微软貌似没有弄WPF的Chart控件,所以就开始找新的图表控件。先找到的自然是WPFToolki... 查看详情

ui5-学习篇-1-开发工具及环境搭建(代码片段)

最近研究SAP-UI5好几个月了,将相关学习经历及问题点做个记录。1.先了解学习资料相关站点  SAP官网:https://www.sap.com/china/index.html  SAP开发工具:https://tools.hana.ondemand.com/#sapui5  UI5 Documentation:https://openui5.hana.ondemand.co... 查看详情

open(sap)ui5学习入门系列之一:扫盲与热身(下)

1 UI5代码结构上一次我们一起用了20秒的时间完成一个UI5版的HelloWorld。应用打开后有一个按钮,按钮的文字是HelloWorld,点击这个按钮之后,按钮会慢慢的消失掉(Fadeout)。那我们这次就来看一看为了实现这么一个简单的功能,O... 查看详情

vscode中sapui5版本(代码片段)

ui5.yaml缺省配置如下ui5:path:-/resources-/test-resourcesurl:https://ui5.sap.com可以根据需要修改之ui5:path:-/resources-/test-resourcesurl:https://sapui5.hana.ondemand.comverssion:1.60.1 查看详情

vscode中sapui5版本(代码片段)

ui5.yaml缺省配置如下ui5:path:-/resources-/test-resourcesurl:https://ui5.sap.com可以根据需要修改之ui5:path:-/resources-/test-resourcesurl:https://sapui5.hana.ondemand.comverssion:1.60.1 查看详情

如何在 SAP UI5 代码中生成 UUID? [复制]

】如何在SAPUI5代码中生成UUID?[复制]【英文标题】:HowdoIgenerateaUUIDinSAPUI5code?[duplicate]【发布时间】:2020-09-2310:04:25【问题描述】:我知道如何在node.js中使用npm管理的库(如uuid)来做到这一点。但是在基于浏览器的SAPUI5JavaScript... 查看详情

如何从 ui5 应用程序注销并重定向到另一个 ui5 应用程序登录?

】如何从ui5应用程序注销并重定向到另一个ui5应用程序登录?【英文标题】:HowtoLogoutfromaui5appandgetredirectedtoanotherui5applogin?【发布时间】:2020-03-0319:43:01【问题描述】:我开发了各种UI5应用,如果我想注销其中一个,所有UI5应用... 查看详情

袋鼠云出品!数栈ui5.0全新体验升级,设计背后的故事

...工匠精神,探索前端道路,为社区积累并传播经验价值。前言数栈作为云原⽣⼀站式⼤数据开发平台,从2016年发布第⼀个版本开始,数栈就始终坚持着以技术为核⼼、安全为底线、提效为⽬标、中台为战略的思想,坚定不移地... 查看详情

SAP UI5 + Yarn = 不运行

】SAPUI5+Yarn=不运行【英文标题】:SAPUI5+Yarn=doesnotrun【发布时间】:2020-02-2108:15:27【问题描述】:信息:NPM也有同样的问题我想创建一个UI5项目,但UI5应该使用NPM或Yarn导入。我从演练第12步下载了示例:https://sapui5.hana.ondemand.com/#/... 查看详情

html所有ui5控件的常用功能(代码片段)

查看详情

html小技能:文档结构

文章目录前言IHyperTextMarkupLanguage1.1术语1.2HTML的作用IIHTML文档结构2.1根标签`<html></html>`2.2Head子标签2.3Body子标签2.4实体2.5列表标签2.6滚动标签2.7行标签2.8块标签2.9段落标签2.10图片标签2.11地图热点2.12超链接标签2.13发送邮... 查看详情