WDA学习(3):Navigation

1.3 Navigation

          本实例演示在不同View视图组件间跳转导航。之间在BAPI Usage这个实例基础上做修改。

1.创建一个新的View视图组件NOFLIGHTVIEW。

选择Web Dynpro Comp. 下Z_TEST_WDA2->右键->Create->View。

 

2.设置Context页签,设置NOFLIGHTVIEW使用到上下文。

将主组件控制器的DESTINATION_FROM,DESTIMATION_TO上下文Context映射到NOFLIGHTVIEW的上下文。

在Context下再创建MSG子Attribute值

 

 

3.设置Layout页签,视图组件控件布局。

选择ROOTUIELEMENTCONTAINER->右键->Insert Element。

创建TEXT1文本控件;

创建BUTTON1按钮控件;

设置TEXT1文本控件text属性绑定Context上下文;

点击text属性后按钮,Binding exists。

 

 

 

设置按钮控件text属性;

设置按钮控件onAction属性;

 

4.设置视图组件的Inbound Plugs和Outbound Plugs页签

Plugs控制视图之间的跳转。

设置FLIGHTLISTVIEW视图组件。

 

 

 

设置NOFLIGHTVIEW视图组件。

 

 

 

5.修改FLIGHTLISTVIEW的方法ONACTIONGET_FLIGHTS

点击魔法棒,读取FLIGHT_LIST内容,不要过度使用魔法棒,否则自动生成太多代码。

 

 

 点击魔术棒,插入导航代码,了解导航代码写法。

 

 

 实例代码:

method ONACTIONGET_FLIGHTS .
  "变量保存COMPONENTCONTROLLER类对象
  DATA lo_COMPONENTCONTROLLER TYPE REF TO IG_COMPONENTCONTROLLER .
  "wd_this参数代表当前视图组件控制器,获取全局的组件控制器
  lo_COMPONENTCONTROLLER =   wd_this->get_componentcontroller_ctr( ).
  "调用对象方法
  lo_componentcontroller->execute_bapi_flight_getlist( ).

  "方式2:直接使用attributes中WD_COMP_CONTROLLER参数,执行方法
  "wd_comp_controller->execute_bapi_flight_getlist( ).

  "当flight_list中没有查询到记录,跳转到NOFLIGHTVIEW视图
  "上下文Context节点
  DATA lo_nd_flight_list TYPE REF TO if_wd_context_node.
  "上下文Element
  DATA lo_el_flight_list TYPE REF TO if_wd_context_element.
  "Context节点对应数据类型(workarea),通过wd_this->element_节点名
  "Context节点对应数据类型(table),通过wd_this->elements_节点名
  "在Context创建时已经默认定义types类型
*   types:
*    Element_flight_list type BAPISFLDAT,
*    Elements_flight_list type standard table of Element_flight_list.
  DATA ls_flight_list TYPE wd_this->Element_flight_list.
  DATA lt_flight_list TYPE wd_this->Elements_flight_list.

  "通过当前Attributes,wd_context表示当前View的上下文对象,代表CONTEXT根节点
  "通过get_child_node()方法获取子节点
  " constants: wdctx_flight_list type string value `FLIGHT_LIST`.
  lo_nd_flight_list = wd_context->get_child_node( name = wd_this->wdctx_flight_list ).
  "获取Element
  lo_el_flight_list = lo_nd_flight_list->get_element( ).

  "如果Element不存在,能够判断flight_list没有记录
  IF lo_el_flight_list IS INITIAL.
     "如果没有记录,跳转到noflightview
      wd_this->fire_no_flights_found_plg( ).
  ENDIF.
endmethod.

6.实现HANDLENO_FLIGHT_FOUND方法

这个方法是设置Inbound Plugs自动生成的,当FLIGHTLISTVIEW视图跳转到NOFLIGHTVIEW视图时,会调用这个方法。

 

使用魔法棒,获取DESTINATION_FROM.CITY值,还需要获取DESTINATION_TO.CITY的值,多次使用魔法棒可能会出现代码重复问题,所以还是需要手动修改(通过魔法棒了解Context获取方式,然后自己写吧)。

 

实例代码:

method HANDLENO_FLIGHT_FOUND .
    "Context节点
    DATA lo_node TYPE REF TO if_wd_context_node.
    "对应element
    DATA lo_element TYPE REF TO if_wd_context_element.
    "destination_from(workarea)
    DATA ls_destination_from TYPE wd_this->Element_destination_from.
    "destination_from-city
    DATA lv_from_city TYPE wd_this->Element_destination_from-city.
    DATA lv_to_city TYPE wd_this->Element_destination_to-city.
    "显示信息
    DATA lv_string TYPE string.

    "获取Context节点值步骤:
    "1.通过wd_context(本组件context)获取其下子节点;
    "2.通过获取到的节点,获取其Element;
    "3.通过Element获取值;

    "在创建Context时,自动生成静态变量wd_this->wdctx_节点名
    " constants:wdctx_destination_from type string value `DESTINATION_FROM`.
    "根据节点名,获取节点
    lo_node = wd_context->get_child_node( name = wd_this->wdctx_destination_from ).
    "通过Node,调用get_element获取Element
    lo_element = lo_node->get_element( ).
    "通过Element,调用get_attribute获取值
    lo_element->get_attribute(
      EXPORTING
        name =  `CITY`
      IMPORTING
        value = lv_from_city
    ).

    "获取destination_to的city值
    lo_node = wd_context->get_child_node( name = wd_this->wdctx_destination_to ).
    lo_element = lo_node->get_element( ).
    lo_element->get_attribute(
      EXPORTING
        name =  `CITY`
      IMPORTING
        value = lv_to_city
    ).

    lv_string = 'No flight avalible from' && lv_from_city && 'to' && lv_to_city.
    "获取上下文msg
    lo_element = wd_context->get_element( ).
    "设置值
    lo_element->set_attribute(
        name =  'MSG'
        value = lv_string
    ).
endmethod.

7.设置NOFLIGHTVIEW的back按钮动作

 

创建onAction,BACK返回到FLIGHTLISTVIEW视图

 

 

 自动生成ONACTIONBACK方法,并且实现跳转代码

 

 

 8.(Embed View into Window)嵌入视图到窗口

选择Window:Z_TEST_WDA2->右键->Embed View

 

 

 选择帮助,可以看到可以Embed的View

 

 

 选择FLIGHTLISTVIEW视图->NO_FLIGHTS_FOUND(Outbound)->Create Navigation Link

 

 

 同理,选择NOFLIGHTVIEW视图->BACK_TO_SEARCH (Outbound)->Create Navigation Link

 

 

 方式2:直接将NOFLIGHTVIEW的Inbound拖动到FLIGHTLISTVIEW的Outbound下,将FLIGHTLISTVIW下的Inbound拖动到NOFLIGHTVIEW的Outbound下。

 

9.激活Web Dynpro Component,然后运行Web Dynpro Application。

 

 

 

 

posted @ 2020-04-28 19:19  渔歌晚唱  阅读(414)  评论(0编辑  收藏  举报