FPM OVP Application- Row Coloring in List UIBB

The below post helps in coloring the row(s) in list uibb of an ovp application.

well fro coloring we have to use the data element : WDUI_TABLE_CELL_DESIGN. Go to the domain value range.

Each color is being represented by a two digit number.

For the list we want to show the SCARR table records. Create a structure and add scarr table and also add one field by any name i.e here COL_REF which refer to the data element WDUI_TABLE_CELL_DESIGN.

Create a table type from the structure.

Create a class in Tx- SE24 and this is going to be the feeder class for the list uibb that we will create later. So add the below interfaces in this class.

Create an attribute GT_FLIGHT which will hold the scarr table records.

Activate all the methods. go to the GET_DEFINITION method.

Put the below code.

Go to the GET_DATA method.

Put the below code.

Now create a component configuration for the List UIBB.

Provide name as – ZSP_CC_FLIGHT_LIST_COLOR and click on New button.

Provide the class created above as the feeder class.

Under General Settings section, provide visible row count as 10 and scroll mode as paging.

Under List UIBB Schema, click on Column button and add the needed column to display in the list( don’t add COL_REF field as this is going to be a reference field to display the colors ).

Save the configuration.

Execute Tx- FPM_WB and click on the highlighted link to create an fpm application.

Provide application name and choose overview page and click on next button.

Save this.

This screen appears. Click on Edit Configuration(FLUID) link.

Provide a tittle and under overview page schema, add a list uibb.

provide the list uibb configuration name ZSP_CC_FLIGHT_LIST_COLOR and save it.

Test the application.

So here we have the list uibb.

Now the task is to color the row(s). So go to the feeder class – GET_DEFINITION method.

put the code: Each column should refer to the COL_REF field .

  METHOD if_fpm_guibb_list~get_definition.
    FIELD-SYMBOLS: <fs_field_desc> LIKE LINE OF et_field_description.
    eo_field_catalog ?= cl_abap_tabledescr=>describe_by_name( ‘ZUI_T_FLIGHT’ ).

    APPEND INITIAL LINE TO et_field_description ASSIGNING <fs_field_desc>.
    <fs_field_desc>–name = ‘CARRID’.
    <fs_field_desc>–cell_design_ref = ‘COL_REF’.
    APPEND INITIAL LINE TO et_field_description ASSIGNING <fs_field_desc>.
    <fs_field_desc>–name = ‘CARRNAME’.
    <fs_field_desc>–cell_design_ref = ‘COL_REF’.
    APPEND INITIAL LINE TO et_field_description ASSIGNING <fs_field_desc>.
    <fs_field_desc>–name = ‘CURRCODE’.
    <fs_field_desc>–cell_design_ref = ‘COL_REF’.
    APPEND INITIAL LINE TO et_field_description ASSIGNING <fs_field_desc>.
    <fs_field_desc>–name = ‘URL’.
    <fs_field_desc>–cell_design_ref = ‘COL_REF’.