Simple Tabstrip Control

Tab strip control is a screen element which contains more than one tab. Each of these tabs is a sub screen. The tab strip control contains one main screen and n number of sub screen. This n number denotes the number of tabs. Tab strip is like follows.

When we click other tab then we can find different screen fields.

Each tab contains a tab title and page area. In the page area we can store the screen elements. This page area is actually the sub screen. Hence a tab strip is a combination of the main screen and all those sub screens. If there are many tabs and all of those tabs contain big tab titles then in one tab strip control area is not sufficient to display all those tabs. In this condition a scroll bar appears and then we can scroll to all of those tabs. Apart from that there will be a button which will display the list of all tabs.

The tab title acts as a button in tab strip control. We can set the function code of any tab as we do for push button. We also can set a title and icon for that tab. We generally create all of these by the screen painter toolbar. We can customize the screen area of the main screen, tab strip screen and also the sub screens. We also can modify the position of these as per requirement.

Now we have created here a tab strip which contains three tabs. The main screen contains the tab strip and material number input field. It also contains two push buttons ‘DISPALY’ and ‘CLEAR’. The functionality of this tab strip is to display the material details in tab1, material unit in tab2 and material sales data in tab3 based on the material input at the main screen when user clicks on the display button. The program will clear all of the screen fields if the clear button is clicked. Since we have only one main screen we only need one ok_code to capture the user command.

Step – 1:

At first we are creating the include programs as follows.

INCLUDE mz_test_top                             .  " global Data
INCLUDE mz_test_o01                             .  " PBO-Modules
INCLUDE mz_test_i01                             .  " PAI-Modules
INCLUDE mz_test_f01                             .  " FORM-Routines

Now at top include we need to declare all the possible set of variables as follows.

*-------Declaring DB tables to mention the screen fields---------------*
TABLES: mara, makt, marm, mvke.

*-----Declaring an work area for Material details----------------------*
DATA: BEGIN OF wa_mara,
        matnr TYPE mara-matnr,
        ersda TYPE mara-ersda,
        ernam TYPE mara-ernam,
        mtart TYPE mara-mtart,
      END OF wa_mara.

*-----Declaring an work area for Material description------------------*
DATA: BEGIN OF wa_makt,
        matnr TYPE makt-matnr,
        maktx TYPE makt-maktx,
      END OF wa_makt.

*-----Declaring an work area for Material units------------------------*
DATA: BEGIN OF wa_marm,
        matnr TYPE marm-matnr,
        meinh TYPE marm-meinh,
        volum TYPE marm-volum,
        voleh TYPE marm-voleh,
      END OF wa_marm.

*-----Declaring an work area for Material sales data-------------------*
DATA: BEGIN OF wa_mvke,
        matnr TYPE mvke-matnr,
        vkorg TYPE mvke-vkorg,
        vtweg TYPE mvke-vtweg,
      END OF wa_mvke.

*-----Declaring ok_code to capture user command------------------------*
DATA: ok_code TYPE sy-ucomm.

*--------Declaring the Tabstrip----------------------------------------*
CONTROLS ts_mat TYPE TABSTRIP.

Here to declare the work area we have used the Pattern as follows.

Then after declaring the table name on the mentioned place press enter. Now select the required fields and press Copy button.

Enter the name of the work area which you want to declare and press enter.

In this way we can make any big structure with less amount of time.

Step – 2:

Next we are creating the screen 9001 which is the main screen. Here in the attributes the normal screen will be selected.

This screen will contain the OK_CODE for the user command.

Step – 3:

After that we shall declare the PBO and PAI for this screen 9001.

In PBO we have the following.

MODULE status_9001 OUTPUT.

  SET PF-STATUS 'PF_MAT'.
  SET TITLEBAR 'TI_MAT'.

ENDMODULE.                 " status_9001  OUTPUT

The PF status is as follows.

The title bar is as follows.

Step – 4:

Now we shall go to the layout and this will trigger the screen painter by which we shall make the main screen of tab strip. Here we have a tab strip ts_mat which we have created by the tab strip button in the palate. Initially the system shows two tabs tab1 and tab2.

Double click on the tab strip ts_mat and by editing the tab title value we can increase the tab as per requirement.

Now we double click on a particular tab (tab1) and the following attributes will come. Here we have set the function code TAB1, the title text Material details and reference field SUB1. This SUB1 will be the name of the sub screen which needs to be created by specifying different screen number. In this way we are creating the other tabs also.

Now we just create a sub screen by dragging the mouse pointer after selecting the sub screen from palate. The name of this will be SUB1.

After that we are creating two buttons for display and clear the screen fields.

After customizing and adjusting the screen elements the final screen appears as follows.

Step – 5:

Now we are creating the first sub screen SUB1 for material details. Here the screen type will be sub screen.

Since this is a sub screen no OK_CODE is there. It will take the main screen user command.

Step – 6:

After that we need to create the screen elements for this sub screen as follows. In this way we are creating the rest of sub screens.

Similarly we are creating rest of the sub screens with different screen elements.

Step – 7:

Now we need to call these sub screens including program name and screen number at PBO level and PAI level.

PROCESS BEFORE OUTPUT.

*--------Creating the PF status & Title in PBO-------------------------*
  MODULE status_9001.

*------Calling the sub screens with program name and screen number-----*
  CALL SUBSCREEN sub1 INCLUDING sy-repid '9002'.
  CALL SUBSCREEN sub2 INCLUDING sy-repid '9003'.
  CALL SUBSCREEN sub3 INCLUDING sy-repid '9004'.

PROCESS AFTER INPUT.

*--------Declaring the buttons functionality in PAI--------------------*
  MODULE user_command_9001.

*------Calling the sub screens-----------------------------------------*
  CALL SUBSCREEN sub1.
  CALL SUBSCREEN sub2.
  CALL SUBSCREEN sub3.

Step – 8:

Now in PAI we have to define the button functionality at user command.

MODULE user_command_9001 INPUT.

*------Capturing the function code for different button----------------*
  CASE ok_code.
    WHEN 'TAB1'.    "When user clicks on TAB1 button
      PERFORM tab1.
    WHEN 'TAB2'.    "When user clicks on TAB1 button
      PERFORM tab2.
    WHEN 'TAB3'.    "When user clicks on TAB1 button
      PERFORM tab3.

    WHEN 'DISP'.    "When user clicks on Display button
      PERFORM get_material.
      PERFORM get_material_description.
      PERFORM get_material_unit.
      PERFORM get_material_sales_data.
    WHEN 'CLR'.     "When user clicks on Clear button
      PERFORM clear_screen.

    WHEN 'BACK' OR 'EXIT' OR 'CANCEL'.
      "When user clicks on Standard toolbar buttons
      LEAVE PROGRAM.
  ENDCASE.

ENDMODULE.                 " user_command_9001  INPUT

Here the tab titles are treated as buttons.

Step – 9:

Now we need to define all of those tab related subroutines to activate the tabs. Here the purpose is to active the tab with tab title as follows.

Step – 10:

Now we shall declare the subroutine for display button function as follows.

*&---------------------------------------------------------------------*
*&      Form  get_material
*&---------------------------------------------------------------------*
*       Get data from MARA
*----------------------------------------------------------------------*
FORM get_material .

  IF mara-matnr IS NOT INITIAL.
    SELECT SINGLE matnr ersda ernam mtart
      FROM mara INTO wa_mara
      WHERE matnr = mara-matnr.

    IF sy-subrc = 0.
      "Passing the data from work area to screen fields of TAB1
      mara-matnr = wa_mara-matnr.
      mara-ersda = wa_mara-ersda.
      mara-ernam = wa_mara-ernam.
      mara-mtart = wa_mara-mtart.
      CLEAR wa_mara.
    ENDIF.
  ENDIF.

ENDFORM.                    " get_material
*&---------------------------------------------------------------------*
*&      Form  get_material_description
*&---------------------------------------------------------------------*
*       Get data from MAKT
*----------------------------------------------------------------------*
FORM get_material_description .

  IF mara-matnr IS NOT INITIAL.
    SELECT SINGLE matnr maktx
      FROM makt INTO wa_makt
      WHERE matnr = mara-matnr
        AND spras = 'EN'.

    IF sy-subrc = 0.
      "Passing the data from work area to screen fields of TAB1
      makt-maktx = wa_makt-maktx.
      CLEAR wa_makt.
    ENDIF.
  ENDIF.

ENDFORM.                    " get_material_description
*&---------------------------------------------------------------------*
*&      Form  get_material_unit
*&---------------------------------------------------------------------*
*       Get data from MARM
*----------------------------------------------------------------------*
FORM get_material_unit .

  IF mara-matnr IS NOT INITIAL.
    SELECT SINGLE matnr meinh volum voleh
      FROM marm INTO wa_marm
      WHERE matnr = mara-matnr.

    IF sy-subrc = 0.
      "Passing the data from work area to screen fields of TAB2
      marm-matnr = wa_marm-matnr.
      marm-meinh = wa_marm-meinh.
      marm-volum = wa_marm-volum.
      marm-voleh = wa_marm-voleh.
      CLEAR wa_marm.
    ENDIF.
  ENDIF.

ENDFORM.                    " get_material_unit
*&---------------------------------------------------------------------*
*&      Form  get_material_sales_data
*&---------------------------------------------------------------------*
*       Get data from MVKE
*----------------------------------------------------------------------*
FORM get_material_sales_data .

  IF mara-matnr IS NOT INITIAL.
    SELECT SINGLE matnr vkorg vtweg
      FROM mvke INTO wa_mvke
      WHERE matnr = mara-matnr.

    IF sy-subrc = 0.
      "Passing the data from work area to screen fields of TAB3
      mvke-matnr = wa_mvke-matnr.
      mvke-vkorg = wa_mvke-vkorg.
      mvke-vtweg = wa_mvke-vtweg.
      CLEAR wa_mvke.
    ENDIF.
  ENDIF.

ENDFORM.                    " get_material_sales_data

Step – 11:

Now we shall create the clear function. Here the purpose will be to clear the screen fields whenever user clicks on the clear button.

*&---------------------------------------------------------------------*
*&      Form  clear_screen
*&---------------------------------------------------------------------*
*       Refresh the screen fields data
*----------------------------------------------------------------------*
FORM clear_screen .

  "Clearing all the screen fields & work area
  CLEAR:    mara,    makt,    marm,    mvke,
         wa_mara, wa_makt, wa_marm, wa_mvke.

ENDFORM.                    " clear_screen

Now here is the main screen output:

Now we declare a material number here and click on the Display button. The system is displaying the material details with description on the first tab.

Now we click on the Material unit and the second tab will display required data with its screen fields. Here the tab title is working like a button.

Similarly when we click the Material Sales data we get the following output.