SOFTBASE XFRAME DEVELOPMENT GUIDE SERIES xframe 개요및아키텍처가이드 서울특별시구로구구로 3 동한신 IT 타워 1215 호 Phone Fax

목차 1 장 : 개요... 3 본문서의목적... 3 주요내용... 3 관련자료... 3 2 장 : X-인터넷개요... 4 X-인터넷개요... 4 X-인터넷의정의... 6 X-인터넷과 RIA(Rich Internet Application) 와의관계... 6 X-인터넷의도입배경... 7 X-인터넷의도입목적및도입효과... 7 3 장 : xframe 개요... 9 xframe 솔루션개요... 9 xframe 솔루션구성및특장점... 10 4 장 : xframe 아키텍처...11 xframe 아키텍처개요... 11 xframe 개발환경아키텍처... 12 RDMBS 아키텍처... 13 xframe 실행환경아키텍처... 14 리소스 ( ) 접근아키텍처... 16 xframe Viewer 로딩아키텍처... 17 xframe 화면처리아키텍처... 18 xframe 운영환경아키텍처... 19 xframe 리소스디렉토리구성아키텍처... 20 화면및화면관련리소스배포절차... 21 화면및화면관련리소스동기화절차... 22 5 장 : 컴포넌트아키텍처...25 코드아키텍처... 25 그리드아키텍처... 26 그리드명칭... 27 탭아키텍처... 28 탭명칭... 29 탭아이템이벤트... 30-2 -

1 장 : 개요 이장에서는본문서의목적, 주요내용및관련자료에대해서기술합니다. 이장에서기술하는내용은아래와 같습니다. 본문서의목적 주요내용 관련자료 본문서의목적 본문서는 xframe 솔루션의사상적인기반인 X- 인터넷에대한개요, xframe 솔루션의개요및아키텍처에 대한정보를습득하는데있습니다. 또한 xframe 솔루션과관련된다른가이드문서의기반이되는정보를 포함하고있습니다. 주요내용 본문서에서는아래와같은내용을포함하고있습니다. X- 인터넷의개요 xframe 솔루션개요 xframe 솔루션아키텍처 관련자료 본문서와관련된자료는다음과같습니다. 솔루션홈페이지 : http://www.softbase.co.kr - 3 -

2 장 : X- 인터넷개요 이장에서는 xframe 솔루션의사상적인기반이되는 X- 인터넷에대해서기술합니다. 이장에서기술하는 내용은아래와같습니다. 본문서의목적 주요내용 관련자료 X- 인터넷개요 X- 인터넷 이란용어의기원은 2000 년 10 월에포레스터리서치 (Forester Research) 의 CEO 인 George F. Colony 가자사의웹페이지에기고한 MY VIEW: X INTERNET 이라는글입니다. X- 인터넷은아래의그림과같이특정기술을의미하지않습니다. 시대가변화함에따라달라지는사용자의 인식과패러다임에맞춰적절히순응해야필요가생겼는데, X- 인터넷은바로이런과정에서흘러나온하나의 개념일뿐입니다. [ 그림 1-1] X- 인터넷은더많은사람과컴퓨터를연결하는기술이다. ( 출처 : 포레스터리서치 ) - 4 -

컴퓨팅환경이아래의그림과같이변경되면서사용자의 UI 에대한부분은보다보편적이고, 다양한 UI 를 표현하여사용자에게보다편리한환경을제공하기위해서변경되고있습니다. [ 그림 1-2] 컴퓨팅시스템의변천과정 ( 출처 : 어도비 ) - 5 -

X- 인터넷의정의 X- 인터넷이란용어의아래와같이정의됩니다. X-Internet은 수행가능한인터넷 (executable Internet) 과 확장된인터넷 (extended Internet) 개념을통해서설명할수있습니다. 즉, X-Internet이란실행성 (executable) 과확장성 (extended) 이뛰어난웹다음의인터넷을지칭하는말로, 웹아키텍처와클라이언트 / 서버아키텍처의한계성을극복하고장점만을수용한새로운인터넷아키텍처를의미합니다. X- 인터넷과 RIA(Rich Internet Application) 와의관계 X- 인터넷과 RIA 라는용어와의관계는다음과같습니다. RIA(Rich Internet Application) 는매크로미디어의플래시 (Flash) 기술을발전시키면서생겨난용어입니다. ActiveX 기술을이용해화면에좀더미려하고섬세한 UI를표현하고, 액션스크립트 (ActionScript) 라는언어를제공해개발자가원하는형태로다이내믹한화면개발을가능하게했습니다. 여기에 DB 액세스까지지원하면서, 자신들의제품을 RIA라고칭한것입니다. X-인터넷은인터넷애플리케이션을다룬큰패러다임이고, RIA는보다클라이언트측면에초점이맞춰진것으로, 매크로미디어라는특정벤더에의해만들어진개념입니다. - 6 -

X- 인터넷의도입배경 X- 인터넷의도입배경은 [ 그림 2] 컴퓨팅시스템의변천과정 ( 출처 : 어도비 ) 와같이기존 UI 개발환경의 문제점에서시작됩니다. C/S 환경과 WEB 환경의문제점은아래와같습니다. 환경 C/S 환경 WEB 환경 문제점 별도의어플리케이션배포및설치작업진행 어플리케이션개발을위한 4GL 기술전문가필요 모든업무기능및구성에필요한기능들을자체개발 Web 환경에비해비교적낮은 UI 구성 비표준기술사용으로인한기술의범용성이낮음 여러페이지에걸친업무처리, 정적인화면구성 단순한사용자인터페이스, 상대적으로느린화면로딩속도 과도한네트워크트래픽, 텍스트기반의문서 일장적인정보전달, 낮은사용자상호작용 X- 인터넷의도입목적및도입효과 X- 인터넷의도입목적은아래의그림과데이터의시각화및업무처리에대한연관성을극대화하여사용자에 게보다편리하게데이터를표현하고, 업무의생산성을향상시키는데있습니다. [ 그림 1-3] RIA 도입목적 ( 출처 : 포레스터리서치 2007.3.12 The Business Case For Rich Internet Applications) - 7 -

X- 인터넷관련솔루션을도입한결과아래의그림과같이대부분의경우에만족도를보이고있습니다. [ 그림 1-4] RIA 만족도 ( 출처 : 포레스터리서치 2007.3.12 The Business Case for Rich Internet Application) - 8 -

3 장 : xframe 개요 이장에서는 X- 인터넷솔루션인 xframe 솔루션의기본적인내용과주요특장점에대해서기술합니다. 이 장에서기술하는내용은아래와같습니다. 본문서의목적 X- 인터넷의개요 xframe 솔루션개요 X-Internet 기반의 UI 통합솔루션 xframe 은사용자업무패턴에맞는사용자인터페이스를지원하고다양한 업무에대한요건을효율적으로처리할수있고, 업무효율성을향상시키기위한다양한부가기능을제공하는 통합 UI 솔루션 입니다. 통합 UI 솔루션이란용어를사용하는이유는 xframe 솔루션이 개발 실행 운영 에필요한모든기능이 하나의솔루션으로가능하기때문입니다. - 9 -

xframe 솔루션구성및특장점 xframe 솔루션은 3 가지제품으로구성되며, 각각의제품에대한주요특장점은아래와같습니다. 단계제품주요특장점 개발환경 실행환경 운영환경 xframe-devstudio xframe-viewer xframe-admin 통합 UI 개발환경제공 개발자권한관리및개발자간협업기능 4GL 수준의화면개발기능 범용 Script 언어를이용한로직 / 이벤트처리개발환경제공 다양한 UI Control 제공 개발변경관리및변경내역상세비교기능 시스템자원관리기능및화면정보캐슁기능 업무화면통합기능및다양한업무처리지원 주변기기통합관리 유연한데이터연동및처리 / 연산기능 대량데이터에대한처리성능보장 사용자에게친숙하고편리한업무환경제공 장애관리, 장애통계, 원격로그수집 변경관리, 배포관리 운영속보메시지처리 - 10 -

4 장 : xframe 아키텍처 이장에서는 X- 인터넷솔루션인 xframe 솔루션에대한아키텍처를기술합니다. 이장에서기술하는내용은 아래와같습니다. xframe 아키텍처개요 xframe 개발환경아키텍처 xframe 실행환경아키텍처 xframe 운영환경아키텍처 xframe 아키텍처개요 xframe 솔루션의아키텍처는다음과같은아키텍처로구분된다. 구분 설명 개발환경아키텍처 실행환경아키텍처 운영환경아키텍처 개발환경아키텍처 실행환경아키텍처 운영환경아키텍처 - 11 -

xframe 개발환경아키텍처 xframe 솔루션은개발환경에대한아키텍처는아래의그림과같습니다. 필드 유틸리티콘트롤 Script Language API Template Data 콤보박스체코박스 엑셀연동콘트롤통신콘트롤 내장콘트롤 API Screen API Factory API 화면연동정보 API Meta Data Module xdataset Resource Data 트리그리드 통신콘트롤 Attribute Map API Menu Data 트리그리드그리드내장콤포넌트 메모달력콘트롤달력콘트롤외부컴포넌트 xdataset API I/O Map API API Code Data Image Data Resource 화면 Script Data 화면 XML Data xframe-devstudio RDBMS 1 2 내장컴포넌트외부컴포넌트 xframe-viewer에내장된컴포넌트를말한다. 내장컴포넌트들은 xframe-devstudio의기본컴포넌트로표시된다. xframe-viewer에내장되지않고, 별도의로존재하는컴포넌트를말한다. 외부컴포넌트는 UI 콘트롤과같이 UI를가지는컴포넌트들과기능을수행하는컴포넌트들로구성된다. 외부컴포넌트들은 xframe-devstudio에서 ActiveX Control Import 기능을이용하여사용한다. 3 API 4 Resource 4 RDBMS 화면개발시참조하여사용할수있는함수이다. Script Language API는 JavaScript 또는 VBScript 언어에서기본적으로제공해주는함수이다. 화면개발시참조하는리소스들이다. 리소스중에 Template, Meta과제외한자원들은실행환경별도의로추출되어 Personal Template는개발자시스템에별도의로관리되며, RDBMS에는저장되지않는다. xframe-devstudio는개발시리소스정보와화면정보를 RDBMS에저장하여보관한다. 개발완료후, Resource와화면정보는각각의 ID로로추출되어 Web 서버에 Deploy하여, 실제사용자들이사용하게된다. - 12 -

RDMBS 아키텍처 xframe-devstudio 에서개발된모든자원은 RDBMS 에프로젝트단위로관리되어저장되며, RDBMS 는아래의 그림과같은아키텍처를가진다. RDBMS Project A 화면정보이미지정보코드정보 개인 / 공용템플릿메타정보개발자정보 메뉴정보 xdataset 정보 Module 정보 화면관련자원 부가자원 Project B Project n 1 프로젝트 xframe-devstudio 를이용해서개발되는모든자원은프로젝트기반으로관리된다. 2 화면관련 자원 화면관련자원들은업무화면과관련되어있는자원들이다. 3 부가자원 화면개발과관련된부가정보들이다. - 13 -

xframe 실행환경아키텍처 xframe 솔루션은실행환경에대한아키텍처는아래의그림과같습니다. Module 목록 xdataset 목록 UI 콘트롤속성 UI 콘트롤이벤트정의 일반스크립트합수 UI 콘트롤이벤트구현 I/O Map 정보 화면 Scope 변수 Module xdataset Attribute Map 정보화면연동정보 Resource 참조정보 외부컴포넌트 Menu Code Image xdataset 정보화면 XML File 화면스크립트 File 외부들 리소스들 논리적인하나의 xframe 화면 xframe-viewer Java Script Engine VB Script Engine Script Engine XML Parser IME Internet Browser (Internet Explorer, FireFox, Crome, Opera, ) Softbase Browser - 14 -

1 2 3 4 외부컴포넌트들리소스들논리적인하나의화면시스템들 xframe 솔루션에추가적인기능을기능을제공하는외부컴포넌트들이다. 이들은사용자시스템에버전관리절차를통해서설치된다. 화면에서참조하여사용하는들이다. 이들은웹서버에 Deploy되면, 화면에서참조시에 Web 서버에서실시간으로다운로드된다. 화면로딩속도를향상시키기위해서사용자시스템에캐슁되어관리된다. 화면정보는물리적으로 2개의에기록된다. 화면 XML 을화면에대한전반적인정보를포함하고있다. 화면스크립트은화면에서사용하는스크립트를포함하고있다. xframe Viewer에서사용하는시스템들이다. 이들은사용자시스템에버전관리절차를통해서설치된다. Script Engine 은화면에서사용하는스크립트언어를실행하기위한들이다. XML Parser는각종 XML 을파싱하여처리하기위한들이다. IME는키보드를통해서사용자의문자입력을처리하는들이다. 5 실행 xframe-viewer를기동시키는실행들이다. xframe-viewer는 Internet Browser와 Softbase Browser에서실행된다. Softbase Browser는 xframe-viewer만은기동시키는전용브라우저이면, 일반 Web 페이지에접속기능은제공하지않습니다. - 15 -

리소스 ( ) 접근아키텍처 xframe-viewer 는화면정보 ( ) 와관련리소스정보 ( ) 을접근하는방법이아래와같이 3 가지의방식을 지원한다. Resource 데이터 Resource Resource 화면 XML 데이터 화면 XML 화면 XML 화면스크립트데이터 화면스크립트 화면스크립트 RDMBS WEB Server 로컬 xframe-viewer 1 RDBMS xframe-devstudio에서정보를저장하기위해서사용하는 RDBMS에접속하여리소스에접근한다. RDBMS에접속하기위한정보는 xframe-devstudio에서데이터베이스접속시사용하는정보를이용하여데이터베이스접속하여정보를로드한다. 이방식은 xframe-devstudio에서화면을수정할경우, 바로반영되어테스트를할수있으며, 개발시에만적용가능하다. 2 Web Server 리소스정보를 Web Server에존재하는에접근한다. 네트워크다운로드속도를보장하기위해서 Web Server에존재하는을 xframe 에서제공하는압축과암호화되어 Deploy될수있다. 화면로딩속도향상을위해서 xframe-viewer에서자체적으로로컬시스템에 Cache를저장하여, 변경된들만다운로드한다. 3 로컬 리소스정보를로컬시스템의시스템에저장된에접근한다. 이경우, xframe-viewer가시작하기전에버전관리절차를통해서리소스들이로컬시스템에다운로드되야한다. 화면로딩속도가다른방법에비해가장빠르다. - 16 -

xframe Viewer 로딩아키텍처 xframe Viewer 는아래의그림과같이로딩처리를진행한다. HTML 및 JavaScript xframe Viewer 파라미터처리 xframe 관련 Key Map 정보처리 Keymap.ini XFrameViewerLoaded Event Module 로드 xdataset 로드 Module 목록 xdataset 목록 Module xdataset 초기화면로드 초기화면 XML 초기화면스크립트 화면관련 1 2 3 4 xframe Viewer 파라미터처리 Key Map 정보처리 Module 로드 xdataset 로드 xframeviewer를품고있는 HTML 또는 JavaScript 에서 xframeviewer에게전달되는파라미터정보를처리한다. 파라미터에는화면정보를로드하는방법및경로정보가포함되어있다. xframeviewer와함께설치되는 Keymap.ini 에서키처리에대한정보를로드한다. 키처리정보에는탭키및기타공통키에대한정보가포함되어있다. 각각의업무화면에서공통적으로호출되어사용되는 Module 정보를 Module 목록정보를이용하여로드한다. 각각의업무화면에서공통적으로사용할수있는 xdataset 정보를 xdataset 목록정보를이용하여로드한다. 5 이벤트발생 6 초기화면로드 xframeviewer를품고있는 HTML 에서 xframeviewer의로드가완료되었다는이벤트를발생시킨다. 이이벤트를처리하는 HTML내스크립트에서 SetSharedData 함수를이용하여정보를설정할수있다. xframeviewer의파라미터중에 MAINFRAMESCREEN 에해당하는화면을로드한다. - 17 -

xframe 화면처리아키텍처 개별 xframe 화면은아래의그림과같은아키텍처로구성되어있다. 화면로딩및표시 외부컴포넌트정보 외부컴포넌트 Attribute Map 정보 Image Code 화면이벤트처리및로직수행 UI 콘트롤속성 Menu UI 콘트롤이벤트정의 일반스크립트합수 송수신데이터처리 I/O Map 정보 UI 콘트롤이벤트구현화면 Scope 변수 Module xdataset 정보 화면스크립트 File 데이터송수신처리 화면 XML File xdataset 1 2 3 4 화면로딩및표시화면이벤트처리및로직수행송수신데이터처리데이터송수신처리 화면로딩시해당화면 XML 내의 외부컴포넌트정보, Attribute Map 정보, UI 콘트롤속성 정보를분석하여외부리소스들을화면내에로딩하고표시한다. Attribute Map 정보 를이용하여 UI 콘트롤의초기속성을설정한다. 화면 XML 내에 UI 콘트롤이벤트정의에정의된이벤트가발생하면, 화면스크립트의해당함수가호출된다. 화면스크립트의함수는화면내변수및 Module 내에있는변수및함수를이용하여비즈니스로직을수행한다. 송수신데이터처리를업무서버로데이터를송수신하기전에송수신될데이터의정보를이용해서데이터를조립 / 처리하는과정이다. I/O Map 정보 에정의된데이터를 xdataset 정보 와 xdataset 정보를이용해서처리한다. 업무서버와 xframe-viewer내에내장된통신어댑터또는외부통신어댑터를이용해서데이터송수신을수행한다. - 18 -

xframe 운영환경아키텍처 xframe 운영환경은사용자가 xframe 을사용하기위해접속하는서버시스템의환경을말하며, 아키텍처는 아래의그림과같다. xframe 서버시스템 버전관리모듈 배포관리모듈 외부코드정보연동모듈 주기작업모듈 xframe-admin WAS 서버 RDBMS 버전 / 배포관리 버전 / 배포관리 다운로드대상목록 버전관리콘트롤 CAB Module 목록 xdataset 목록 xframe 3 rd 파티 화면 Module xdataset 외부컴포넌트 시스템 Menu Code Image 설치들 리소스들 Web 서버 1 2 3 설치들리소스들 xframe Admin 사용자시스템에 xframe을사용하기위해서설치되는들이다. 설치되는들은버전관리콘트롤 CAB 이자동으로설치되며, 이콘트롤에의해서다른나머지들이사용자시스템에자동으로설치된다. 설치들은 xframe-admin을이용해서단위로서버로배포된다. xframe 화면과관련되어있는들이며, xframe-devstudio를이용해서로추출 ( 암호화및압축 ) 되어 xframe-admin을이용해서서버로배포된다. 화면정보, 화면스크립트이외에도화면에서참조하는다른리소스들이포함된다. 이들은 리소스 ( ) 접근아키텍처 의리소스접근방법에따라사용자시스템으로다운로드되어사용하거나, Web 서버에있는을사용자시스템에서접근하여사용된다. 설치들과리소스들에대한버전관리및배포관리기능을수행한다. xframe 서버가 2대이상인경우에도, 각각의서버에자동동기화되어배포한다. 예약배포, 백업본관리, 배포이력정보조회기능도제공한다. 4 RDBMS xframe-admin 이배포관리및기타정보를저장하기위한저장공간이다. - 19 -

xframe 리소스디렉토리구성아키텍처 xframe-devstudio 에서개발된자원들은모두디렉토리구조로관리되며, 실제운영서버에배포시에 물리적인시스템과의연관관계는아래의그림과같다. xframe-devstudio RDBMS Project A DIR_A SCREEN_A_1 / product WEB_ROOT screen DIR_A SCREEN_A_1.xml SCREEN_A_1.js 물리적인시스템 1 2 3 WEB ROOT Project Root 맵핑화면자원맵핑 xframe 화면정보가배포될서버시스템의웹서버의 Document Root 디렉토리이다. xframe-devstudio를이용해서개발된자원들은모두 HTTP 통신프로토콜을이용해서접근이가능해야한다. xframe-devstudio에서구성한프로젝트디렉토리는 Document Root 디렉토리의특정디렉토리와맵핑된다. 위의그림에서는 /product/web_root/screen 디렉토리가된다. xframe Viewer의 HTML 파리미터에다음과같이설정된다. 파라미터이름 : SCREENBASEURL" 파라미터값 : http://127.0.0.1/screen" xframe 소스예제 : factory.loadscreen("/dir_a/screen_a_1"); xframe-devstudio에서구성한디렉토리의구성및자원들은 Project Root 맵핑 에서지정된물리적인디렉토리와동일한구조를갖는다. 다만화면정보는각각 xml 과 js 로두개의로구성된다. - 20 -

화면및화면관련리소스배포절차 xframe-devstudio 를이용해서개발된화면및화면관련리소스들은아래의그림과같은절차를통해서 xframe 서버로배포된다. 개발서버시스템 개발자시스템 xframe 서버시스템 xframe-admin Resource Data ( Module, xdataset, Menu, Code, Image 등등 ) 화면 XML 화면스크립트 Module 목록 Module xdataset 목록 xdataset 화면 Script Data Menu Code Image 리소스들 화면 XML Data 리소스들 xframe-viewer RDBMS xframe-devstudio 사용자시스템 1 2 3 배포대상선택추출서버업로드 xframe-devstudio를이용해서서버로배포해야할대상을조회하고선택한다. 대상조회시변경날짜및리소스 ID를기준으로검색할수있다. xframe-devstudio를이용해서배포대상리소스들을로추출한다. 추출시암호화및압축을수행할수있다. xframe-admin을이용하여추출된들을 xframe 서버시스템으로업로드한다. 4 배포 xframe-admin 의배포관리기능을통해서예약배포 / 실시간배포가실행된다. 배포시배포이력과백업본이자동생성된다. 5 리소스 사용 사용자시스템의 xframe-viewer 가화면을로딩하기위해서 xframe 서버시스템의 리소스들을다운로드하고, 화면에표시하다. - 21 -

화면및화면관련리소스동기화절차 xadmin 을이용한배포서버간의동기화절차및시스템구성은아래와같다. xadmin Master 시스템 File System xframe-admin WAS 서버 FTP xadmin Slave 시스템 File System xframe-admin WAS 서버 HTTP 방식으로 File Upload WEB 서버시스템 File System WEB 서버 WEB 서버시스템 File System WEB 서버 HTTP GET xadmin UI 운영자시스템 xframe-viewer 사용자시스템 1 2 5 배포업로드배포서버간동기화다운로드 xadmin UI를이용하여업로드할대상을 HTTP Multipart Data로업로드하고, 등록 / 결제 / 이행절차를수행한다. xadmin은이행시에동기화대상정보시스템을 DBMS에서읽어들어 FTP 방식으로을배포한다. xframe-viewer는 L4 스위치의대표 IP에접근하여 WEB 서버시스템을통해서 HTTP GET 방식으로을다운로드한다. - 22 -

시스템구성방법 구성방법 1 : WEB/WAS 서버가각각의시스템에분리되어있으나, WEB 서버시스템의 File System 을 공유하는경우 xadmin Master 시스템 File System FTP xadmin Slave 시스템 File System xframe-admin xframe-admin WAS 서버 WAS 서버 HTTP 방식으로 File Upload WEB 서버시스템 File System WEB 서버시스템 WEB 서버 WEB 서버 HTTP GET xadmin UI 운영자시스템 xframe-viewer 사용자시스템 구성방법 2 : WEB/WAS 서버가하나의시스템에구성되는경우 xadmin Master 시스템 xframe-admin WAS 서버 FTP xadmin Master 시스템 xframe-admin WAS 서버 File System File System HTTP 방식으로 File Upload WEB 서버 WEB 서버 HTTP GET xadmin UI 운영자시스템 xframe-viewer 사용자시스템 - 23 -

구성방법 3 : WEB/WAS 서버가하나의시스템에구성되고 File 시스템을공유하는경우 xadmin Master 시스템 xframe-admin WAS 서버 xadmin Master 시스템 xframe-admin WAS 서버 File System HTTP 방식으로 File Upload WEB 서버 WEB 서버 HTTP GET xadmin UI 운영자시스템 xframe-viewer 사용자시스템 - 24 -

5 장 : 컴포넌트아키텍처 이장에서는 xframe 솔루션에서사용되는주요컴포넌트에대한아키텍처를기술합니다. 이장에서기술하는 내용은아래와같습니다. 코드아키텍처 그리드아키텍처 탭아키텍처 코드아키텍처 xframe 에서정의하는코드는아래의그림과같이구조를갖는다. CODE_ID CODE_NAME CODE_DELIMETER CODE_STYLE CODE_DATA Code_1 Code_2 Comment_1 Comment_2 Code_n Comment_n CODE_ID.pic 1 CODE ID 2 코드 3 Comment 각코드는고유의 ID를가지며, 이 ID를이용하여화면에서참조한다. 각코드는코드 ID를이용하여로저장되며, 확장자는.pic 로만들어진다. CODE ID에포함되는코드정보에서코드에해당하는데이터이다. 업무서버로데이터송신시실제로전송되는데이터이다. 코드에대한설명에해당하는항목이다. 업무서버로데이터송수신시사용되지않고, 화면에표시하기위한용도로사용된다. - 25 -

그리드아키텍처 xframe 에서사용되는그리드컴포넌트는속성및이벤트정보는아래의그림과같다. GRID Component Grid Properties Grid Events Column_1 Column_Header_1 Header Properties Column_Header_n Header Properties Column_Data_1 Data Properties Data Events Column_n 1 2 3 Grid 속성및이벤트 Column 헤더속성 Column 데이터속성및이벤트 Grid 컴포넌트자체의속성정보및이벤트정보들이다. Grid 컴포넌트전체에영향을미치는속성들이다. 그리드의각칼럼의헤더에대한속성정보들이다. 그리드의헤더가여러행인경우에는각행의헤더별로속성을정의한다. 그리드의각칼럼의데이터부에대한속성정보및이벤트정보들이다.. - 26 -

그리드명칭 그리드의각각의명칭은다음과같이정의된다. Grid Item Grid Header Grid Row Grid Column 번호 구분 설명 1 Grid Header 그리드의각컬럼의헤더정보가표시되는영역이다. 2 Grid Row 그리드의한행의데이터를의미한다. 3 Grid Column 그리드의각열을의미한다. 4 Grid Item 그리드의특정행의특정칼럼을의미한다. 그리드에서제공하는 API 를이용하면각그리드아이템단위로동작을수행할수있 다. - 27 -

탭아키텍처 xframe 에서사용되는탭컴포넌트는속성및이벤트정보는아래의그림과같다. TAB Component Tab Properties Tab Events Tab_Item_1 Tab Item Properties Tab_Item_n 1 2 Tab 속성및이벤트 Tab Item 속성 Tab 컴포넌트자체의속성정보및이벤트정보들이다. Tab 컴포넌트전체에영향을미치는속성들이다. 탭의각아이템에대한속성정보들이다. 탭의아이템이여러개인경우에는각탭아이템별로속성을정의한다. - 28 -

탭명칭 탭의각각의명칭은다음과같이정의된다. Tab Item Tab Item Content Panel 1 Tab Item Tab 콘트롤은각각의여러개의탭아이템으로구성된다. 2 Tab Content Panel Tab 콘트롤의각각의탭아이템은아이템별로콘텐츠영역을가진다. 탭아이템콘텐츠영역에서는직접콘트롤이배치될수도있고, 다른화면을링크를 걸수있다. - 29 -

탭아이템이벤트 탭아이템생성이벤트흐름도 탭의아이템에화면을링크할경우, 아래와같은이벤트흐름이발생한다. Tab Control xframe Viewer 링크화면 Start Call addtab( ) Add Tab Item tab_on_itemcreate Fire Tab Item Create Event Create And Load Screen Link Screen To Tab Item Fire Screen Load Event screen_on_load Fire Screen Activate Event screen_on_activate tab_on_itemchange Fire Tab Item Change Event End 1 tab_on_itemcreate 이벤트 해당탭콘트롤의 on_itemcreate 이벤트핸들러가호출된다. 2 screen_on_load 이벤트 해당탭콘트롤에링크되어생성될화면을생성하고, 새롭게생성 된화면의 on_load 이벤트핸들러가호출된다. 3 screen_on_activate 이벤트 새롭게생성된화면의 on_activate 이벤트핸들러가호출된다. 4 tab_on_itemchange 이벤트 새롭게생성된탭아이템으로탭아이템이변경이벤트에대한 tab_on_itemchange 이벤트핸들러가호출된다. - 30 -

탭아이템삭제이벤트흐름도 탭아이템에화면이링크되어있을경우, 아래와같은이벤트흐름이발생한다. Tab Control xframe Viewer 링크화면 Start Call deletetab( ) tab_on_itemdelete Fire Tab Item Delete Event No Return Value == 1? Fire Screen Destroy Event screen_on_destroy No Return Value == 1? End (Tab Item isn t Deleted) Destroy Screen Delete Tab End (Tab Item is Deleted) 1 tab_on_itemdelete 이벤트 삭제대상탭아이템에대한 on_itemdelete 이벤트핸들러가호출된 다. 2 탭아이템삭제 여부검사 Tab_on_itemdelete 함수의리턴값을검사하여값이 1 인경우에탭 아이템삭제작업을진행한다. 리턴값이 0 인경우에는탭아이템을 삭제하지않는다. 3 screen_on_destroy 이벤트 해당탭아이템에링크된화면의 on_destroy 이벤트핸들러가호출된 다. 4 화면삭제여부 검사 screen_on_itemdelete 함수의리턴값을검사하여값이 1 인경우에화면삭젝작업을진행한다. 리턴값이 0 인경우에는화면을삭제하지않는다. 이경우, 화면이링크된탭의아이템도삭제되지않는다. - 31 -