[SAP ABAP] ALV Part 2

Zebra
To create zebra coloring where the background of one row is white and the next is gray and so on, we just need to add one more structure to the ALV called a layout structure.
At the beginning of creating a zebra pattern, we need to declare a variable of lvc_s_layotype, as follows:
DATA: ls_layout TYPE lvc_s_layo.
Of course, a layout structure has many more fields, for instance, a field named edit. If we add abap_true to this, then we can change data in rows. After this, we just need to fill in one field of this structure:
ls_layout-zebra = abap_true.
Add this structure to set_table_to_first_display as an export parameter:
CALL METHOD lr_alv->st_table_for_first_display
   EXPORTING
     is_layout       = ls_layout
   CHANGING
     it_outtab       = lt_spfli
     it_fieldcatalog = lt_fcat.
Coloring
To color an entire column, we can use the Emphasize option of the field catalog. To add a value, we need to follow the pattern, C123, where the following applies:
  • C: Constant
  • 1: Color numbers
  • 2: Inverse yes/no
  • 3: Intensified on/off
A list of possible colors of columns or rows is provided here:
Value of the first variable
Color
1
Gray or Blue
2
Light gray
3
Yellow
4
Blue or Green
5
Green
6
Red
7
Orange

You need to add the following piece of code to the field catalog field to obtain the yellow color of the column:
ls_fcat-emphasize = 'C300'.
Coloring a row is a bit more complicated. To enable coloring rows, you should add an additional field to your data table.
First, we need to declare the structure in the same way as spfli, with an additional rowcolor field and table based on this structure:
DATA:
   BEGIN OF ls_colouring_rows.
         INCLUDE STRUCTURE splfi.
 DATA: rowcolor(4) TYPE c.
 DATA END OF ls_colouring_rows.

 DATA: lt_color LIKE TABLE OF ls_colouring_rows.
Now we need to add the information about the name of the column where the information about the color is stored. To do this, we need to add the layout structure name of this field. For example, look at the following code snippet:
ls_layout-info_fname = 'ROWCOLOR'.
We just need to add data about the color into the table and the color will be defined, as in the preceding method. In our example, we color all rows where carrid = 'AA' to green:
LOOP AT lt_color ASSIGNING FIELD-SYMBOL(<fs_color>) WHERE carrid = 'AA'.
   <fs_color>-rowcolor = 'C500'.
 ENDLOOP.
For coloring purposes, I changed the results table to lt_color. Of course, the table in the set_table_for_first_display method also needs to be changed.  
If we want to, we can color only one cell in the ALV. In the example shown in an image named Results of coloring, I colored the destination cell orange only for flights to JFK.
First, we need to declare the structure with colors in a table. Right now, our declaration of the table type will look as follows:
DATA:
   BEGIN OF ls_colouring_rows.
         INCLUDE STRUCTURE splfi.
 DATA rowcolor(4) TYPE c.
 DATA cellcolors TYPE lvc_s_scol.
 DATA END OF ls_colouring_rows.
We also need to declare structure consistently in accordance with the type of row added to the master table:
DATA: ls_ccolor TYPE lvc_s_scol.
We also need to inform the runtime, that we will pass the coloring information. This can be done by providing the table name in the ctab_fname attribute, similar to the following screenshot:
ls_ccolor-ctab_fname = 'CELLCOLORS'.
The user needs to make a loop in the result table in order to add the needed value and change the colors:
LOOP AT lt_color ASSIGNING FIELD-SYMBOL(<fs_cellcolor>) WHERE airpto = 'JFK'.
   ls_coolor-fname = 'AIRPTO'.
   ls_ccolor-col = '7'.
   ls_ccolor-int = '1'.
   APPEND ls_ccolor TO <fs_cellcolor>-cellcolors.
 ENDLOOP.
Let's have a look at the following screenshot:
Results of coloring
If all of the colors were added at the same time, the result of this would be the preceding screenshot.
Event of an ALV, exemplified by a button click 
To create an event, we need to declare a method of handling events. The method in the example presented in the following code block is declared as a local class but can be declared as a global class too (more about the global and local class, can be found in Chapter 13Advanced Techniques in ABAP Objects).
The button we want to create in this example will provide a popup with Mastering ABAP as text.
To create class, we first need to create a definition and implementation of a method to handle the button click:
CLASS lcl_event_handler DEFINITION.
   PUBLIC SECTION.
     METHODS: handle_button_click FOR EVENT button_click OF cl_gui_alv_grid
       IMPORTING
         es_col_id es_row_no.
 ENDCLASS.                    
 CLASS lcl_event_handler IMPLEMENTATION.
   METHOD handle_button_click.

     CALL FUNCTION 'POPUP_TO_DISPLAY_TEXT'
       EXPORTING
         textline1 = 'MASTERING ABAP'.

   ENDMETHOD.                    
 ENDCLASS.  
It is also required to declare a variable with reference to the type of class declared in the preceding code snippet:
DATA: lr_event_handler TYPE REF TO lcl_event_handler.
To handle the method and register an event on the ALV, we need to create the object defined previously and register an event in the ALV instance, as follows:
CREATE OBJECT lr_event_handler.

SET HANDLER lr_event_handler->handle_button_click FOR lr_alv.
The mechanism for creating an event is pretty much the same for all events; the only difference is the creation of appropriate methods for different events.
We need to create a button on the ALV. To do this, we create the following field on the table structure:
DATA button(5) TYPE c.
We then add a button field to the ALV field catalog:
ls_fcat-fieldname = 'BUTTON'.
ls_fcat-scrtext_s = 'Button'.
ls_fcat-outputlen = 6.
APPEND ls_fcat TO lt_fcat.
CLEAR ls_fcat.
As in the previous example (the details are on GitHub at https://github.com/PacktPublishing/Mastering-SAP-ABAP), to change the cell to a button, we need to add cell style to the layout structure:
ls_layout-stylefname = 'CELLSTYLES'.
In our ALV, the push button has been created in the second position:
The button on ALV
After clicking on the button, a popup will appear, as follows:
Popup
Let's move on to our next topic about icons in the ALV.
Icons in the ALV
To show an icon, we need to add one parameter to the field catalog and the values of this field need to be the values assigned to the icon. All icons can be seen in the ICON table.
For example, we can show an icon based on the values in the charter. When 
 appears, a flight will be in the charter, and this will not be the case when 
 appears.
At the beginning of the icon-creation process, we need to add a field to the resulting table structure:
DATA icon TYPE icon_int.
Next, we need to make changes to the field catalog. This parameter indicates that this field is an icon and will be shown as one. It will also change the name of the field from FLTYPE to ICON:
ls_fcat-fieldname = 'ICON'.
ls_fcat-scrtext_s = 'Charter?'.
ls_fcat-auto_value = 'X'.
ls_fcat-icon = 'X'.
APPEND ls_fcat TO lt_fcat.
CLEAR ls_fcat.
As the last step of creating an icon, we need to add an icon value to the corresponding field, as follows: 
LOOP AT lt_color ASSIGNING FIELD-SYMBOL(<ls_icon>).
    IF <ls_icon>-fltype = 'X'.
      <ls_icon>-icon = '@B_OKAY@'.
    ELSEIF <ls_icon>-fltype IS INITIAL.
      <ls_icon>-icon = '@B_CANC@'.
    ENDIF.
ENDLOOP.
The result of this operation is demonstrated in the following screenshot:
Icons in the ALV
Let's have a look at another such example in the following screenshot:
Result of all changes made in the ALV
Of course, we can mix all of the previous changes and the result of doing so is presented in the preceding screenshot.
Text fields and translations
To create text, we need to select the text field (
) from the elements on the left in Screen Painter and drag and drop it onto the screen.
We need to add a name and some text. The name is the name of the field and the text is the text shown on the screen. We do not need to manually adjust the size of the text field as this will be adjusted automatically:
Text in Screen Painter
To create a translation of a field, we need to click on Goto and select Translation from the list. After locking on to the target language for which there are translations, the text will automatically be displayed in the selected language:
Selecting a language
On the pop-up window, in the Target language field, select the desired language and click OK.
On the next window, we can add translations and select text-to-translation. In this case, the text will be divided into two categories. The first is text on the screen and the second is for headers:
Translation screen
To create text for the Screen Painter, for example, expand the list <SRT4> Screen Painter Texts (PROG) and double-click on selected rows.
Translation
Click on
 and check whether any proposals exist. If not, you can accept this translation as system-wide after clicking 
. Next, go back to the previous screen and save the translations.
Input/output field
To create an input field/output field, we need to click on the  
 icon and select an area for it. After creating a field, we need to add a name. The naming of fields is really important. This is because if we create a field with the same name as something else in a program, values from the program will automatically be transmitted to screen and vice versa.
In the input/output field, we can also specify some parameters. The most important fields are listed here:
  • On the Dict tab, there's the following:
    • Format drop-down menu: The user can select the field format from the list. They can select from many possibilities such as CHAR or DEC.
    • From dict checkbox: If the dict checkbox is checked, data (such as format, conversion exit, and more from the DDIC) will be automatically recovered.
    • Conv.Exit: This is a conversion exit which is automatically applied for values in a given field. 
    • Search help.
    • Case-sensitive checkbox: If checked, this field will be case sensitive. By default, fields are converted into capital letters. 
  • On the Program tab, there's the following:
    • Checkbox input field: If this checkbox is checked, we can put some data into this field. If not, the field only consists of output.
    • Input dropdown: We can select this if filling out this field is possible, recommended, or even required.
    • Output field checkbox: If this checkbox is checked, we can show some data from the program in this field. If not, the field is only an input field:
Options of the input/output field
We need to double-click on the elements of the list shown in the preceding screenshot in order to get a window in which these values can be put in order.
Radiobuttons and checkbox
Radiobuttons and checkboxes are created by clicking the
 button for a checkbox or
 for a radiobutton and selecting an area for a field. Next, we need to input a name for this field. In the same way as in the input/output field, if we name this field identically as in the program, data will be transferred.
On radiobuttons and checkboxes, we cannot select field formats, for example. This is specific to the input/output field.
To create a group of radio buttons, we need to mark the radio buttons that are to be in one group and right-click them, selecting Radio button group followed by define.
Button
The button is created by clicking the 
 button in the list and selecting an area for this field.
We need to create a name for the button, but in this case, this is not crucial. In the button attribute, we need to specify the function code. This is specified after clicking a button on the PAI module. The user command is then moved, at which point we can make programming actions.
In our example, the button function code will be RES:
.
Options in the button
All of the fields necessary for button creation are shown in the preceding screenshot.
Dynamic display possibilities for individual elements and groups
To create a dynamic display, we need to add the name of a group to the attributes of a field.
In our example, we can hide or display two radiobuttons based on a checkbox. By default,  these two radiobuttons are not present, but if we check the checkbox, this makes them appear. We also need to add a dummy action to the checkbox to process the PBO and change the screen.
After doing this, the screen should look as follows:
Screen after making changes
We need to create global fields with the same name as the screen:
    gv_carrid        TYPE s_carr_id,
    gv_connid        TYPE s_conn_id,
    gv_type          TYPE c,
    gv_domestic      TYPE c,
    gv_international TYPE c,
    gv_dyn_where     TYPE string VALUE '1 = 1'.
Now, all values from fields are available in the program. Next, we need to write a piece of code:
WHEN 'RES'.

IF lv_dyn_where IS INITIAL.
   lv_dyn_where = '1 = 1'.
ENDIF.

IF gv_carrid IS NOT INITIAL.
 lv_dyn_where = |{ lv_dyn_where } and carrid = '{ gv_carrid }'|.
ENDIF.

IF gv_connid IS NOT INITIAL.
 lv_dyn_where = |{ lv_dyn_where } and connid = '{ gv_connid }'|.
ENDIF.

IF gv_domestic IS NOT INITIAL.
 lv_dyn_where = |{ lv_dyn_where } and countryfr EQ s~countryto|.
ENDIF.

IF gv_international IS NOT INITIAL.
 lv_dyn_where = |{ lv_dyn_where } and countryfr NE s~countryto|.
ENDIF.

SELECT carrid, connid,
        countryfr, cityfrom, airpfrom,
        countryto, cityto, airpto,
        fltime, deptime, arrtime, distance,
        distid, fltype, period
FROM spfli AS s
WHERE (lv_dyn_where)
INTO CORRESPONDING FIELDS OF TABLE @lt_color.

 CLEAR lv_dyn_where.
After clicking on reselect, data is reselected based on the value input to the fields on the screen.

Comments

Popular posts from this blog

[SAP ABAP] Data declaration

[SAP ABAP] BAPI

[SAP HR] Payroll Schema