1）启动ABAP工作台，在Web Dynpro组件编辑界面，创建Web Dynpro组件。
在下拉列表中选中“Web Dynpro Comp./Intf”选项，在相应的文本框中输入程序的名称如图2-8所示。
图 2-8
单击图2-8中的 
按钮，弹出如图2-9所示的对话框
图 2-9
单击图2-9中的 
按钮，弹出组件编辑对话框，编辑组件相关信息，如图2-10所示
图 2-10
单击图2-10中的
图 2-11 
按钮，并添加新视图，如图2-11所示。 为组件中的相关对象编写适当的 
注释），如图2-12所示
图 2-12
2）在ABAP工作台中的Web Dynpro组件编辑界面导入Flex编译文件。
在组件上单击鼠标右键，在弹出的菜单中单击“Create”→“Mime Object”→“Import”命令，导入文件（见图2-13），弹出如图2-14所示的对话框。
图 2-13
图 2-14
选中编译完成的Flex文件，单击 
按钮3）在ABAP工作台中的组件编辑界面编辑组件控制器属性在左侧程序的树形结构菜单上双击组件控制器，Attributes编辑如图2-15所示
图 2-15
4）在ABAP工作台中的视图编辑界面编辑视图V_MAIN。
在左侧程序的树形结构菜单上双击视图V_MAIN，选中“Context”选项卡，编辑结果如图2-16所示。
图 2-16
选中“Outbound Plugs”选项卡，编辑出站插头如图2-17所示
图 2-17
选中“Layout”选项卡，编辑查询条件信息，并添加视图容器UI元素如图2-18所示
图 2-18
编辑结果如图2-19所示
图 2-19
为“BTN_SEARCH”按钮编辑动作GET_TEST如图2-20所示
图 2-20
动作GET_TEST处理方法编辑如下
5）在ABAP工作台中的视图编辑界面编辑视图V_FLASH。
在左侧程序的树形结构菜单上双击视图V_FLASH，选中“Context”选项卡，编辑结果如图2-21所示。(www.daowen.com)
图 2-21
注：在Context中定义的变量要和在FlashIsland定义的变量一致，否则变量值无法传递。
选中“Inbound Plugs”选项卡，编辑入站插头如图2-22所示。
图 2-22
选中“Layout”选项卡，选中右侧的根节点“ROOTUIELEMENTCONTAINER”，单击鼠标右键，按照图2-23所示的路径转换UI元素类型。
选中变换属性为“FlashIsland”，弹出如图2-24所示的对话框。
图 2-23
图 2-24
变换后属性编辑如图2-25所示
图 2-25
选中右侧的根目录“ROOTUIELEMENTCONTAINER”，单击鼠标右键，按照图2-26所示的路径创建UI元素GACDATASOURCE、GACEVENT和GACPROPERTY。
图 2-26
选中创建的UI元素“GACEVENT [Events]”单击鼠标右键，按照图2-27所示的路径创建事件的参数。
编辑结果如图2-28所示。
图 2-27
图 2-28
注：GACDataSource用于绑定Context节点，与Flex文件中的columnTest相对应。GACProperties用于绑定Context节点中的属性，对应Flex文件中的变量。GACEVENT用于绑定视图中的Action，对应Flex文件中的事件onClickButton。实例中相关的属性设定见表2-1。
表 2-1
选中“Action”选项卡，新建动作GET_NUM如图2-29所示
图 2-29
编辑结果如图2-30所示
图 2-30
动作对应事件处理程序编辑如下
选中“Methods”选项卡，入站插头FROMMAIN处理程序如下
6）在ABAP工作台中的窗体编辑界面编辑视图间导航链接。
在左侧程序的树形结构菜单上双击窗体W_FLASHISLAND，选中“Window”选项卡编辑导航如图2-31所示。
图 2-31
7）在ABAP工作台中的Web Dynpro Application编辑界面创建Web Dynpro Application如图2-32所示。
图 2-32
免责声明：以上内容源自网络，版权归原作者所有，如有侵犯您的原创版权请告知，我们将尽快删除相关内容。
