Walkthrough-step4 XMLView

最新推荐文章于 2024-06-21 13:32:31 发布

xiayutian_c

最新推荐文章于 2024-06-21 13:32:31 发布

阅读量176

点赞数

分类专栏： SAPUI5 文章标签： Walkthroug

本文链接：https://blog.csdn.net/xiayutian_c/article/details/88820289

版权

SAPUI5 专栏收录该内容

23 篇文章 0 订阅

订阅专栏

SAPUI5支持多种视图类型(XML、HTML、JavaScript)，主要是以XMLview为主，官方的示例也以XML为主。所以先学XMLview肯定没错，理解了什么是XML标签什么是XML属性，还有命名空间之类的基础知道，编码会一目了然。
（最新版本很多不方便，CDN速度也时快时慢，还以为代码出了问题，所以下载了最新的JDK进行更新，更新办法参考如何在WEBIDE个人版中添加其它版本的资源库）

webapp/index.html

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>SAPUI5 Walkthrough</title>
	<script
		id="sap-ui-bootstrap"
		src="/resources/sap-ui-core.js"
		data-sap-ui-theme="sap_belize"
		data-sap-ui-libs="sap.m"
		data-sap-ui-compatVersion="edge"
		data-sap-ui-async="true"
		data-sap-ui-resourceroots='{
			"Step4_XMLViews": "./"
		}'>
	</script>
	<script>
		sap.ui.getCore().attachInit(function(){
			sap.ui.xmlview({
				viewName : "Step4_XMLViews.view.App"
			}).placeAt("content");
		});
	</script>
</head>
<body class="sapUiBody" id="content">
</body>
</html>

index.html中增加了一个 <script> 标签,在页面载入时执行，sap.ui.getCore().attchInit()注册一个函数，并在Framework完成初始化后执行，函数的内容就是：

sap.ui.xmlview({
				viewName : "Step4_XMLViews.view.App"
			}).placeAt("content");

sap.ui.xmlView 根据sID（省略了）实例化一个XMLView，这里的viewName属性可以是定义好的View(viewName + suffix “.view.xml”)也可以是一个View可配置对象(configuration object for a view)。
planAt()将实例化的xmlView放在DOM里id为content的位置。

webapp下创建一个view文件夹，view文件夹下创建一个App.view.xml文件。
webapp/view/App.view.xml

<mvc:View
   xmlns="sap.m"
   xmlns:mvc="sap.ui.core.mvc">
   <Text text="Hello World"/>
</mvc:View>

View的命名和路径有些要求：

所有的view都要放在view文件夹中
XML views的命名规则 *.view.xml
通常默认的命名空间是sap.m
注意大小写

也可以使用菜单菜单进行xmlview的创建，下图，
XMLview create
xmlview create wizard1
注意Namespace的填写
xmlview create wizard2
点击完成后，会自动生成一个空白的xml view，并且生成同名controller，这个会在Step5中详细介绍，SAP的MVC架构会更清晰。
xvmlview create 3

xiayutian_c

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
Walkthrough-step4 XMLView

SAPUI5支持多种视图类型(XML、HTML、JavaScript)，主要是以XMLview为主，官方的示例也以XML为主。所以先学XMLview肯定没错，理解了什么是XML标签什么是XML属性，还有命名空间之类的基础知道，编码会一目了然。（最新版本很多不方便，CDN速度也时快时慢，还以为代码出了问题，所以还是用回了本地的库）webapp/index.html<!DOCTYPE...
复制链接

扫一扫