SALV Table 18 – ICONs and Tooltips

By | October 16, 2013 | SALV Table, SALV Tutorial | 50,231 | 4

ICONs are great ways to enhance the report output. Let me show you how you can sweeten the deal by adding the tooltip on the ICON.

Background

When you design a report and if you just put the text, it wont be eye-catching. Users wont be excited to run the report. It would add boredom to their monotonous activities. You can add ICONs on the output and make Users happy.

I developed a cockpit for one of the interfaces to report the status of the various stages of processing. If I would have only used the status like Not Processed, Still to be picked up, it would be not be much fun. Since I’m fan of SALV, I decided to give a try to use the SALV using ICONs. Along the way, I also added the tooltips so users can hover on it and it becomes live – interactive.

Design Time Consideration

To be able to add ICONs and Tooltips on SALV, you need to:

  • Column Value as the ICON value – In your output table, you would need to add the ICONs as the value. Like You can use ICON_GREEN_LIGHT for the traffic green light
  • Set the ICON column of SALV as ICON – Get the COLUMNs object from SALV, Get the particular column object, call the method SET_ICON to register the column as ICON
  • Set the Tooltips – Tooltip object is part of the Functional Settings. Get the Functional object first. From that get the tooltip object. Call method ADD_TOOLTIP to add the tooltip

You would only need to add tooltips with unique value. You can specify the same tooltip for different ICONs, but you need to only specify the tooltip for one ICON once. If you do it multiple times, you would get exception CX_SALV_EXISTING.

Code Lines

Here are the code lines:

SALV ICONS and Tooltips

 
REPORT  ZTEST_NP_SALV_ICON_TOOLTIP.
*
CLASS lcl_main DEFINITION.
  PUBLIC SECTION.
    DATA o_salv TYPE REF TO cl_salv_table .
    TYPES:
      BEGIN OF ty_output,
        status TYPE char10,
        field1 TYPE char30,
      END   OF ty_output.
    DATA: t_output TYPE STANDARD TABLE OF ty_output.
    METHODS:
      select_data,
      generate_alv.
ENDCLASS.                    "lcl_main DEFINITION
*
START-OF-SELECTION.
  DATA: o_main TYPE REF TO lcl_main.
  CREATE OBJECT o_main.
  o_main->select_data( ).
  o_main->generate_alv( ).
*
CLASS lcl_main IMPLEMENTATION.
  METHOD select_data.
    INCLUDE: <icon>.
    DATA: ls_output LIKE LINE OF t_output.
    DO 3 TIMES.
      ls_output-status = icon_green_light.
      ls_output-field1 = sy-abcde.
      APPEND ls_output TO t_output.
      ls_output-status = icon_yellow_light.
      APPEND ls_output TO t_output.
      ls_output-status = icon_red_light.
      APPEND ls_output TO t_output.
      ls_output-status = icon_led_green.
      APPEND ls_output TO t_output.
      ls_output-status = icon_led_red.
      APPEND ls_output TO t_output.
      ls_output-status =  icon_led_yellow.
      APPEND ls_output TO t_output.
    ENDDO.
  ENDMETHOD.                    "select_Data
  METHOD generate_alv.
    DATA: lo_functions            TYPE REF TO cl_salv_functions_list.
    DATA: lo_functional_settings  TYPE REF TO cl_salv_functional_settings.
    DATA: lo_tooltips             TYPE REF TO cl_salv_tooltips,
          lv_value                TYPE lvc_value.
    DATA: lo_columns              TYPE REF TO cl_salv_columns.
    DATA: lo_column               TYPE REF TO cl_salv_column_table.
 
    INCLUDE: <icon>.
*
* ALV Object
    TRY.
        cl_salv_table=>factory(
          IMPORTING
            r_salv_table = o_salv
          CHANGING
            t_table      = t_output ).
      CATCH cx_salv_msg.                                "#EC NO_HANDLER
    ENDTRY.
 
* Functions
    lo_functions = o_salv->get_functions( ).
    lo_functions->set_all( abap_true ).
 
*... set the columns
    lo_columns = o_salv->get_columns( ).
    "lo_columns->set_optimize( abap_true ).
    TRY.
        lo_column ?= lo_columns->get_column( 'STATUS' ).
        lo_column->set_icon( if_salv_c_bool_sap=>true ).
        lo_column->set_long_text( 'Hover for Tooltip' ).
        lo_column->set_alignment( if_salv_c_alignment=>centered ).
        lo_column->set_output_length( 20 ).
      CATCH cx_salv_not_found.                          "#EC NO_HANDLER
    ENDTRY.
 
 
*...Tooltips
    lo_functional_settings = o_salv->get_functional_settings( ).
    lo_tooltips = lo_functional_settings->get_tooltips( ).
    TRY.
        lv_value = icon_green_light.
        lo_tooltips->add_tooltip(
          type    = cl_salv_tooltip=>c_type_icon
          value   = lv_value
          tooltip = 'Everything is Processed' ).            "#EC NOTEXT
      CATCH cx_salv_existing.                           "#EC NO_HANDLER
    ENDTRY.
    TRY.
        lv_value = icon_yellow_light.
        lo_tooltips->add_tooltip(
          type    = cl_salv_tooltip=>c_type_icon
          value   = lv_value
          tooltip = 'Partially processed' ).                "#EC NOTEXT
      CATCH cx_salv_existing.                           "#EC NO_HANDLER
    ENDTRY.
    TRY.
        lv_value = icon_red_light.
        lo_tooltips->add_tooltip(
          type    = cl_salv_tooltip=>c_type_icon
          value   = lv_value
          tooltip = 'Nothing Yet processed' ).              "#EC NOTEXT
      CATCH cx_salv_existing.                           "#EC NO_HANDLER
    ENDTRY.
 
*... display the table
    o_salv->display( ).
 
  ENDMETHOD.                    "generate_alv
 
ENDCLASS.                    "lcl_main IMPLEMENTATION
 

Output

I have tried to capture tooltip for the Green traffic light here. I have deliberately, didn’t add any tooltip for the single LED light ICONs.

Like It? Share!!

Don't miss an Update

Get notified of the new post, right into your inbox

Naimesh Patel{274 articles}

I'm SAP ABAP Consultant for more than a decade. I like to experiment with ABAP especially OO. I have been SDN Top Contributor.
Follow :

Explore all of his 274 articles.

Load comments

4 Comments

  • Mohinder

    Hi Naimesh,

    Cool stuff. How about customized images/symbols to be uploaded via factory?. As a requirement I need to print $ against a column. I tried by concatenating but didnt work out since field level properties (Dictonary), sorting/Addition will get affected. I tried by copying the method and enhancing it for use didnt work out either.

    Any sugesstion of either enhancing class to accomodate symbols, or would not be better to enhance ICON table.

    Thanks
    Mohinder

  • Hello Mohinder,

    Making numbers look more accountant friendly, i.e. adding $ sign and Brackets instead of the negative sign, can be achieved using the Conversion Routine.

    I would cover this topic in my next article.

    Thanks,
    Naimesh Patel

  • Just to close the loop – I have posted the new article Conversion Exit to Format Amount in ALV on the same subject.

  • Another alternate is to first use function module ICON_CREATE , where we directly pass the icon code, a text which should appear beside it, and the alt text for quick info,

    This FM returns the icon which we can display it in any alv coloumn. Generally i use this for the hyperlinks on my reports and modulepools.

    ICON_CREATE

     
     
    CALL FUNCTION 'ICON_CREATE'
        EXPORTING
          NAME                  = ICON_COMPARE
          TEXT                  =  'Before/After'
          INFO                  =  'Click to view before and after code'
          ADD_STDINF            = ' '
        IMPORTING
          RESULT                = W_ICON_FIELD
        EXCEPTIONS
          ICON_NOT_FOUND        = 1
          OUTPUTFIELD_TOO_SHORT = 2
          OTHERS                = 3.
      IF SY-SUBRC  0.
      ENDIF.
     
    Check the value in w_icon_field in debugging to see an icon concatenated with text and shows the quick info on mouse hover . 
     

Comments on this Post are now closed. If you have something important to share, you can always contact me.

You seem to be new here. Subscribe to stay connected.