• WDA基础二:界面,元素介绍


    1.ELEMENTS:

    BUTTON  按钮

    CAPTION  标题

    DROPDOWN_BY_IDX   带序号的下拉

    DROPDOWN_BY_KEY   带键值的下拉

    FILE_UPLOAD    上载文件工具(选择文件路径)

    GROUP          分组工具,无工具功能

    IMAGE          图片(需要将图片文件上传到该程序中才能使用)

    INPUT_FIELD     (文本输入框)

    LABEL           (说明文本)

    LINK_TO_ACTION  (突出显示,下划线)

    PAGE_HEADER     (页抬头标题)

    TABLE            表控制

    TABSTRIP          页签

    TEXT_EDIT         文本编辑(大文本框)

    TEXT_VIEW        文本显示(不可编辑)

    TOOLBAR          工具条

    TRAY              可折叠块

    TREE              树

    VIEW_CONTAINER_UIELEMENT 视图组建控制器(一般用来放ALV或其他组建)

     

    以上是一些常用的UI ELEMENT,在普通的WDA开发中会经常用到这些

     

    2.APPLICATION STRUC

    3.架构说明

    一般的程序框架如图:

    1. 组建控制器是定义的全局的组建,与视图相似,组建控制器是一个程序对外的部分,是整个程序最开始执行的环节 ,也是控制多个视图间数据交互的纽带,一般考虑到程序的扩展性会优先使用组件控制器,然后关联各视图。
    2. 组建接口是用来引入一些外部组建接口的。引入的组建接口可添加到相应的视图窗口中使用
    3. 视图是一个DYNPRO程序显示的部分,可有多个视图,视图见可跳转,每个视图中需要显示的字段结构表等信息需要单独定义在该视图的节点中(CONTEXT)注意:组建控制器中也可以添加节点,作为全局节点属性,如果将它与某视图中的节点进行MAPPING,则可以再视图结束后,程序没结束的时候保存节点属性。一般界面跳转如此做
    4. 窗口与视图相似,只是每个程序每次显示只能有一个单独的窗口,可定义多个窗口,窗口间跳转,与视图跳转相似,都是在Inbound Plugs(入站)和Outbound Plugs(出站)里做对应的绑定。
    5. 应用程序,单独的执行程序。

    4.普通样例展示

    5.样例布局展示

     6.布局说明

    一般是以TRAY为折叠区域划分设计屏幕,(此处为两个,1是查询条件,2是查询结果)

    在某个区域中,可用GROUP来分组。(看个人习惯)

    区域的Layout一般选择MatrixLayout (MatrixHeadData 行开头 MatrixData 紧接着 HEAD,没有新的HEAD,会一直往后排。新的HEAD,另起一行)

    常用属性:

    enabled        是否灰显,EDITABLE

    readOnly     只显示

    suggestValues  这个是值建议,就像淘宝输入 手机 会有手机壳,手机膜。。。

    value               绑定的VALUE

    visible             可见

    width              占的宽度,或者比例 一般200,250,150,TRAY 一般95%之类

    EVENTS          事件,每种ELEMENT对应事件不同,有field的输入,按钮的事件。。。

    cellDesign        单元格格式

    colSpan           字段占列数,比如文本框,我们可以设置占5格等(前提是容器TRAY,CONTAINER的COL设置的够)

    hAlign             格式

    以上是些常用的属性。

     

    7.视图的整体介绍

    Properties:VIEW的属性,一般引入一些控件,alv,select-option等

    Layout:视图布局,显示的样式,字段排版

    Inbound Plugs:转入的连接(内向链接),一般视图跳转需要带些参数什么的,需要在这里定义plugs和参数相关信息

    Outbound Plugs:转出的连接(外向链接),对Inbound对应,传出的连接和参数

    Context:节点。视图使用的表,结构,全部放在这里。一般0-1/1-1/0-n三种。前两种相当于工作区,结构,后一种是内表。1-1时需要勾选Initialization Lead Selection

    Attributes:视图属性,可在本视图的各方法中使用

    Action一般是对应ELEMENT对应的EVENT产生的

    Methods:方法

     

     

     

     

     

  • 相关阅读:
    048——VUE中使用animate.css动画库控制vue.js过渡效果
    047——VUE中css过渡动作实例
    046——VUE中组件之使用动态组件灵活设置页面布局
    045——VUE中组件之父组件使用scope定义子组件模板结构
    004PHP文件处理——目录操作:glob rewinddir opendir readdir
    003PHP文件处理——目录操作:rename scandir
    044——VUE中组件之使用内容分发slot构建bootstrap面板panel
    Linux输出信息并将信息记录到文件(tee命令)
    linux下使用SVN上传项目
    linux下将文件上传到svn服务器
  • 原文地址:https://www.cnblogs.com/sapSB/p/6732016.html
Copyright © 2020-2023  润新知