Walkthrough-Step16 Dialogs and Fragments

Fragment是没有Controller的可重用轻量级UI元素,当遇到多个页面都需要重用的页面片段时,或者不同的情况下需要使用不同页面片段时(比如根据用户角色,不同的用户,有的是显示,有的是编辑 )Fregment就是首要选择。
一个Fregment可以由1到n个控件组成。在运行时,控件放置在View中的和放在Fregment是一样的,这意味着在呈现时,Fregment中的控件将被包含到View的DOM中。当然,也有一些控件不是为成为视图的一部分而设计的,例如对话框。
Dialog不属于某一具体的View,这意味着对话框必须在控制器代码中实例化,但是,由于我们希望坚持声明性方法,并创建可重用的构件,使之尽可能灵活,而且由于对话框不能指定为视图,我们将创建一个包含dialog的XML Fregment。毕竟,dialog可以在应用程序的多个视图中使用。

修改点:

  1. 在原Panel上加一个按钮<Button id="helloDialogButton" text="{i18n>openDialogButtonText}" press="onOpenDialog" class="sapUiSmallMarginEnd"/>
  2. 新建一个fragment xml view webapp/view/HelloDialog.fragment.xml
<core:FragmentDefinition
   xmlns="sap.m"
   xmlns:core="sap.ui.core" >
   <Dialog
      id="helloDialog"
      title="Hello {/recipient/name}">
   </Dialog>
</core:FragmentDefinition>
  1. 按钮事件:
			var oView = this.getView();
			if (!this.byId("helloDialog")) {
				Fragment.load({
					id: oView.getId(),
					name: "Step16_FregmentDialog.view.HelloDialog"
				}).then(function(oDialog) {
					oView.addDependent(oDialog);
					oDialog.open();
				});
			} else {
				this.byId("helloDialog").open();
			}

判断id为‘helloDialog’的Fragement是不是已经加载了,如果加载过,通过this.byId()方法Open,如果第一次打开,使用Fragment的API load一个指定了id和name属性的Fragment,当前View使用addDependent方法将Fragment和当前view绑定,然后Open。

上一篇:链表 160.找出两个链表的交点


下一篇:LeetCode 160-相交链表