SET_STYLE¶

목적

"SET_STYLE"은 UI Object의 Style을 적용시키거나 삭제하는 기능을 제공

주요 단계¶

1. UI Object에 Style 적용¶

1.1. Application에서 UI Object와 Event를 생성한 후, UI Object에 styleClass를 적용¶

<사진 1> UI Object 생성

1.2. Event를 생성한 후 "SET_STYLE"을 구성¶

1.3. ABAP Source Code (EV_SET_STYLE)¶

METHOD EV_SET_STYLE.

  " SET STYLE EVENT.
  CALL METHOD /U4A/CL_UTILITIES=>SET_STYLE
    EXPORTING
      IO_VIEW    = ME->/U4A/IF_SERVER~AR_VIEW   " [U4A] UI Element Super Class
      ID         = 'TEXT2'                      " UI 오브젝트 ID
* ISDEL      =                              " 스타일 클래스명 삭제 여부(X)
      SYTLECLASS = 'sapUiLargeMarginTopBottom'. " 스타일 클래스명

ENDMETHOD.

1.4. Web에서 SET_STYLE 실행¶

o Web에서 SET_STYLE Event 실행 시 UI Object의 Style이 적용됨

o 기존에 적용된 Style은 그대로 유지

<사진 2> Style 적용 전 화면

<사진 3> Style 적용 후 화면

2. UI Object Style 삭제¶

2.1. SET_STYLE은 적용된 Style을 삭제 가능¶

o ISDEL 값을 'X'로 설정하고 삭제하려는 styleClass를 입력

2.2. 첨부 ABAP SOURCE (EV_DELETE_STYLE)¶

METHOD EV_DELETE_STYLE.

  " DELETE STYLE EVENT.
  CALL METHOD /U4A/CL_UTILITIES=>SET_STYLE
    EXPORTING
      IO_VIEW    = ME->/U4A/IF_SERVER~AR_VIEW   " [U4A] UI Element Super Class
      ID         = 'TEXT2'                      " UI 오브젝트 ID
      ISDEL      = 'X'                          " 스타일 클래스명 삭제 여부(X)
      SYTLECLASS = 'sapUiLargeMarginBegin'.     " 스타일 클래스명

ENDMETHOD.

2.3. Web에서 SET_STYLE Event 실행 시 UI Object의 Style이 삭제된 것을 확인 가능¶

<사진 4> Style 삭제 적용 전 화면

<사진 5> Style 삭제 적용 결과 화면