화면 가이드

UDC란 User-Defined Component의 약자이며, 개발자가 구현한 화면을 다른 화면에서 하나의 컴포넌트처럼 사용하는 기능이다.

UDC는 화면의 udc_api, udc_event, udc_prop 속성을 설정하여 개발한다.

UDC는 일반 UDC와 공통 UDC로 구분되며, 2가지 모두 UDC 화면은 포틀릿 호환 코드 방식으로 개발되야 한다.

일반 UDC는 UDC 화면을 특정 화면에서만 사용하기 위해 개발한 UDC이며, 공통 UDC는 프로젝트에서 공통적으로 사용하기 위해 만든 UDC이다.

공통 UDC는 화면의 “화면 UDC 등록” Context 메뉴를 통해서 “UDC” 영역에 정의된 UDC이다.

공통 UDC는 common_module 디렉토리 하위에 common_udc.lst 파일에 등록되며, UDC 화면 로딩 속도 개선을 위해 COMMONUDC_LOADTYPE 실행 파라미터에 의해서 메인화면 로딩 이후에 화면 소스가 비동기로 메모리에 로딩된다.

링크된 UDC 화면은 UDC를 사용하는 화면 생성시 비동기로 로딩된다.

UDC를 사용하는 화면의 on_load 이벤트 발생전에, 모든 자식 UDC 화면의 로딩 완료를 보장하기 위한 방법으로 아래와 같이 2가지가 있다.

방법 1. screen_loadevent 속성을 1:sync로 설정
방법 2. screen_loadevent 속성을 0:default로 설정 및 EVENTFIRE_SYNC_SCREENONLOAD/EVENTFIRE_SYNC_PORTLETONLOAD 실행 파라미터를 true로 설정

UDC로 개발된 화면을 사용하는 방법은 아래와 같이 2가지 방식이 있다.

방법 1. [일반/공통 UDC] 화면 트리에서 해당 화면을 Drag하여 화면의 “Design” 영역에 Drop 후, “UDC 화면 Tab 생성” Context 메뉴를 선택
방법 2. [공통 UDC] “UDC” 영역에 정의된 화면을 Drag하여 화면의 “Design” 영역에 Drop

위의 2가지 방식중 하나로 UDC를 생성하면, 탭 컴포넌트가 생성되고, 탭 아이템에 해당 UDC 화면이 포틀릿(Portlet) 방식으로 링크된다.

생성된 탭 컴포넌트는 아래와 같은 속성이 설정된다.

UDC 화면의 udc_prop 속성에 정의된 속성에 대해서 UDC 화면 생성시 설정할 속성을 정의한다.

설정된 속성은 UDC 화면내에서 udcprop API를 통해서 값을 구할 수 있다.

UDC 화면의 udc_event 속성에 정의된 속성에 대해서 이벤트 처리 함수를 지정하여 사용한다.

해당 이벤트 처리 함수는 UDC 화면내에서 udcevent API 호출을 통해서 동기/비동기 방식으로 이벤트 처리 함수가 호출된다.

탭 컴포넌트 name 속성이 “tab_udc”라고 설정한 경우에, “Source” 영역에서 다음과 같이 API를 자동완성 및 호출하여 사용한다.

템플릿 위치: /HTML5/SCREEN/UDC/udc_basic

템플릿 파일

function screen_on_load()
{
}

UDC 구조 가이드