5. OZ Application 주요 컴포넌트

OZ Application Contents description 1. Application Start Introduction

1-1 교재목적1-2 본교재의 구성1-3 사전지식

Overview2-1 Web-based Application Solution2-2 Introduction to oz 2-3 OZ Application Flow2-4 시스템 요구사항2-5 OZ 제품 설명

2. OZ Query Designer 2-1 MDB 등록하기2-2 쿼리디자이너 실행하기2-3 스토어 만들기2-4 db.properties 만들기2-5 데이터 셋 만들기2-6 쿼리디자이너 사용자 패러미터 추가 하기2-7 쿼리디자이너 조건문 설정하기2-8 쿼리디자이너 스크립트 사용하기

OZ Application Contents description 3. OZ Application 설정

3-1 OZ Application 실행하기3-2 리파지토리 설정하기3-3 폴더구조 설정하기3-4 네임 법칙3-5 주요 단축키3-6 기본값 편집기3-7 옵션

4. OZ Application4-1 변수 선언4-2 주요 스트링 함수4-3 화면 로딩 시 실행 되어지는 이벤트4-4 HelloWorld 만들기4-5 트리거 이벤트4-6 디버깅 하기4-7 보드 추가4-8 다이얼로그 생성4-9 화면 전환4-10 함수 만들기4-11 스타일 만들4-12 사용자 컴포넌트 만들기

OZ Application Contents description 5. OZ Application 주요 컴포넌트

5-1 Document5-2 패널5-3 그룹박스5-4 스플리터5-5 보드뷰5-6 콤보박스5-7 테이블5-8 그리드5-9 테이블 그리드 CRUD5-10 라벨5-11 픽쳐 박스5-12 텍스트 박스5-13 버튼5-14 체크 박스 , 라디오 버튼5-15 리스트 박스 , 체크 리스트 박스5-16 뉴메릭 업다운5-17 마스크 텍스트 박스5-18 리치 텍스트 박스5-19 데이트 타임 피커5-20 켈린더

5-21 수평 , 수직 네비게이션5-22 탭컨트롤5-23 타이머5-24 프로그래스바5-25 툴팁5-26 컨텍스트 메뉴5-27 메인 메뉴5-28 이미지 리스트5-29 트리뷰5-30 크로스탭5-31 차트5-32 리포트 컨트롤5-33 리포트 버튼5-34 HTML 뷰

OZ Application Contents description 6. OZ Applicaton Tip

6-1 Export6-2 Pattern6-3 Event Hook6-4 SetEvent6-5 FileSystemObject6-6 Dictionary6-7 FXDataSet6-8 OZ Application Global Function

7. OZ Server7-1 Properties Files

7-1-1 db.properties7-1-2 log.properties7-1-3 repository.properties

7-2 lecense7-3 Viewer 호출 태그7-4 Html 연동

Lesson 1.

Lesson 2.

Chapter 01

Application Start

Introduction

Overview

Lesson 1. Introduction

Introduction

본 교재의 목적본 교육 교재는 오즈 쿼리 디자이너 ( 이하 ‘쿼리 디자이너’라 칭함 ) 와 오즈 어플리케이션

디자이너( 이하‘리포트 디자이너’ ) 를 사용하여 오즈 어플리케이션을 작성하는 사용자들에게 다양한 UI

를작성하기 위한 기능 사용법을 숙지 시키고자 제작 되었습니다 .이 교육을 통하여 어플리케이션 개발자들은 ‘오즈’ 에 대한 전반적인 이해와 UI 작성 방법 , 서버의 리파지토리를 통한 UI 의 관리 방법에 대하여 자세히 배우게 될 것입니다 .

* 그 외 상세한 내용은 각 해당 매뉴얼을 참조하시기 바랍니다 .

Chapter 1Chapter 2Chapter 3Chapter 4Chapter 5

교육에 대한 소개와 OZ Overview

쿼리 디자이너와 어플리케이션 디자이너의 인터페이스쿼리 디자이너에서 데이터셋 작성하기

다양한 UI 폼 만들기리파지토리 매니저 사용법과 보고서 배포 방법

본 교재의 구성

Introduction

사전지식

효과적인교육을 위한

기본 요건

DB 에대한 이해

SQL 에대한 이해

자바에대한 이해

웹 프로그래밍에대한 이해

Web-based Application Solution

Data is? 가공 이전의 단순 정보들의 집합을 말합니다 . 흔히 데이터베이스 안에 들어 있는숫자 , 문자 ( 열 ), 화폐 , 날짜 등의 데이터를 의미하며 , SQL 문 등을 통해 사용자가원하는 형태로 가공하기 이전의 실제 값을 말합니다 . ( 원시데이터 )

Information is?일련의 절차를 거쳐 어떤 목적을 위해 현실 세계에서 의미를 갖도록 재편성된데이터로 경우에 따라 데이터의 형식이나 형태가 변형되기도 합니다 . ( 데이터를 어떠한 상황의 판단 혹은 의사결정의 수단이 되도록 처리 , 가공한결과입니다 .)

Application is?데이터 또는 이를 가공한 정보 (Information) 를 비즈니스 요구에 부합되도록 기업이나 단체 혹은 국제적인 표준화 절차를 거쳐 표현한 문서를 의미합니다 .

Basic Overview

Introduction to oz

OZ XStudio Solution

OZ Server(Daemon/Servlet/.Net)OZ Scheduler ServerOZ Push Server 4.0

OZ Viewer

운영환경 /도구

Web-based Solution ‘OZ’

OZ Enterprise ManagerOZ Repository Manager

관리도구

OZ Report DesignerOZ Query Designer

OZ Application Designer개발도구

사 용 자

OZ Viewer

HTMLsDatabase

OZ ServerTCP/IP

HTTP

OZ 의 DB Pool 이용

폼파일과 데이터모듈 전송

보고서명및 오즈패러미터

최초 1 회다운로드

OZ Application Flow

OZ Server Daemon Type

Web Server

EJB Beans

JSP Container

Firewall

사 용 자

HTMLs

Database

WAS 의DB Pool 이용

OZ Application Flow

OZ Server Servlet Type

Web Server

HTTP

WAS

OZ Server OZ Viewer

WebService

aspx Container

Firewall

사 용 자

HTMLs

Database

DB Pool 이용

OZ Application Flow

OZ Server .Net Type

IIS

HTTP

FrameWork

OZ Server OZ Viewer

시스템 요구사항

JAVA Runtime Environment( 이하 JRE) 1.1.x 이상이 가동되는 모든 platform.NET Framework 1.1 이상을 지원하는 모든 운영체제

Windows 98, NT/2000(Service pack2 이상 )/XP/2003Pentium III, 500MHz 이상 권장 , HDD 500MB Minimum 512MB, Suggested 512 MB Memory

뷰어의 탑재는 어느 웹 서버에서나 가능ActiveX Viewer 와 Applet Viewer 2 가지(Applet Viewer 의 경우에는 사용자 PC 에 MS JVM 3200 이상 필요 )

Windows NT/2000(Service pack2 이상 )/XP/2003Pentium III, 500MHz 이상 권장 , HDD 50MB Minimum 256MB, Suggested 512 MB Memory

Server

QueryDesigner

Application Designer

Viewer

쿼리

쿼리 디자이너 – 메뉴바

파일 편집 보기

창

실행

도움말

쿼리 디자이너 – 툴바

파일 관련 부분 새 페이지 , 열기 , 저장

편집 부분 자르기 , 복사 , 붙이기

쿼리문 실행실행 부분디자인 뷰 모드 전환 , 매뉴얼 모드 전환모드 전환

서버 관련 부분 리파지토리 열기 / 닫기 , 업로드 / 다운로드 , 체크인 / 체크아웃

OZ Application Designer 웹 UI 제작 툴입니다 .

OZ Report Designer 웹 리포트 제작 툴입니다 .

OZ Query Designer OZ Application 과 OZ Report 에 데이터를 처리해 주는 툴 입니다 .

OZ Repository Manager 형상 관리를 해주는 툴 입니다 . (ftp, Sourcesafe 와 유사 )

OZ Enterprise Manager 서버 관리를 해주는 툴 입니다 . ( 주로 서버 로그 확인 시 사용 )

OZ 제품 설명1. Product

Chapter 02

OZ Query Designer

2-1 MDB 등록하기2-2 쿼리디자이너 실행하기2-3 스토어 만들기2-4 db.properties 만들기2-5 데이터 셋 만들기2-6 쿼리디자이너 사용자 패러미터 추가 하기2-7 쿼리디자이너 조건문 설정하기2-8 쿼리디자이너 스크립트 사용하기

[ 관리도구 ] 안에 보시면 [ 데이터 원본 (ODBC)] 을 찾을 수 있는데 더블클릭하여 열어봅니다 .

[ 시스템 DSN] 탭으로 이동을 한 후 추가를 눌러 줍니다 .

2-1. MDB 등록하기2. 쿼리디자이너 ODI 만들기

[MicroSoft Access Driver(*.mdb)] 를 선택하여 [ 마침 ] 누릅니다 .

[ 데이터 원본 이름 ] 을 MDB 이름 하고 동일하게 입력해 줍니다 .


데이터베이스의 선택 항목을 클릭하여 자신이 등록 하고자 하는 MDB 를 선택하여 더블클릭해줍니다 .

[ 확인 ] 을 클릭하여 ODBC 설정을 마침니다 .


윈도우 시작 프로그램의 [ 프로그램 ] -> [OZ XStudio] -> [OZ Query Designer 4.0] 를 클릭하거나 윈도우 바탕 화면의 'OZ Query Designer 4.0' 아이콘을 클릭합니다 .

2-2. 쿼리디자이너 실행 하기2. 쿼리디자이너 ODI 만들기

오즈 쿼리 디자이너가 실행되면 다음과 같이 오즈 쿼리 디자이너 초기 화면이 나타납니다 .

좌측 데이터 트리창의 데이터베이스 모듈을 클릭해 마우스 우측키를 눌러 스토어 추가를 합니다 .

2-3. 쿼리디자이너 스토어 추가2. 쿼리디자이너 ODI 만들기

데이터 베이스 연결 정보 추가 창이 생성이 되어지면 데이터 정보 이름 입력란에 자신이 원하는 이름을 넣어주고 DB 앨리어스 체크박스를 체크하고 앨리어스 명 (ap)을 넣어준 다음 앨리어스 정보 파일 입력란에 db.properties 라고 직접 입력을 하고 확인을 클릭합니다 .

2-3. 쿼리디자이너 스토어 추가2. 쿼리디자이너 ODI 만들기

어플리케이션의 진행 전에 앞으로 어플리케이션에서 활용하게 될 ODI 를 만들어 보도록 합니다 .ODI 를 만들기에 앞서 로컬 DB 를 사용하기 위해서 MDB 를 설정해 주어야 합니다 .

우선 쿼리디자이너를 만들기 이전에 DB 정보 설정 파일을 로컬에 설정해 주어야 합니다 . 각각의 사이트 마다 DB 가 다르며 설정 방법 역시 다르게 되어 있습니다 .해당 교육에서는 MDB 를 사용 할 것이며 이에 대한 설정 파일 내용은 다음과 같습니다 .ap.vendor=odbcap.dsn=ap ap.user=ap.password=ap.maxconns=5ap.initconns=2ap.timeout=5

에디터나 메모장을 열어 해당 사항을 기입 후 db.properties 라 저장 합니다 .

2. 쿼리디자이너 ODI 만들기2-4. db.properties 만들기

해당 내용이 적힌 db.properties 파일을 자신의 로컬 피시에 오즈가 설치되어진 영역의 제품마다 각각 넣어줍니다 . 위의 앞에 사용되어진 ap 라는 것이 DB 의 앨리어스가 됩니다 . 사용자가 임의로 설정해 주는 부분 입니다 .ex)C:\Program Files\Forcs\OZ XStudio 4.0\OZ Application Designer 4.0C:\Program Files\Forcs\OZ XStudio 4.0\OZ Query Designer 4.0C:\Program Files\Forcs\OZ XStudio 4.0\OZ Report Designer 4.0

2-4. db.properties 만들기

2. 쿼리디자이너 ODI 만들기

해당 그림 처럼 스토어가 생성이 되어지고 스토어를 클릭후 마우스 우측 키를 눌러 데이터 셋 추가를 누릅니다 .

그림의 경우 셋을 생성하는데 있어 디자인 모드로서 제공하는 화면입니다 .

2-5. 쿼리디자이너 데이터 셋 추가2. 쿼리디자이너 ODI 만들기

sql 작성을 디자인 모드로 작성하기도 하지만 해당 샘플에서는 매뉴얼 모드로 작업을 시행하겠습니다 . 쿼리디자이너의 툴바의 해당 아이콘

을 클릭해줍니다 . 매뉴얼 모드로 변경되어지는 것을 보실 수 있습니다 . 이 창에 직접 sql 문을 작성해 줍니다 .Ex) select * from carInfo


SQL 작성후 F5 키 혹은 툴바의 해당 sql 문이 실행되어지는 모습을 확인 하실 수가 있습니다 .

이렇듯 쿼리의 실행을 시킴으로써 DB 로부터 값을 가져올 수 가 있습니다 . 하지만 어떤 UI 화면이든 모든 데이터를 가져오는 것이 아니라 반드시 조건을 주어주고 값을 가져오게 되어 있습니다 .

해당 아이콘을 클릭 합니다 .


그림에서 보듯 데이터 트리창의 사용자 지정 패러미터를 클릭 후 마우스 우측 키를 눌러 패러미터 설정 항목을 선택해 줍니다 .

2-6. 쿼리디자이너 사용자 패러미터 추가하기


해당 화면처럼 패러미터를 사용자가 입력을 해 주고 확인을 눌러줍니다 .

추가 되어진 것을 확인 하실 수 있습니다 .

2. 쿼리디자이너 ODI 만들기2-6. 쿼리디자이너 사용자 패러미터 추가하기

다시 셋 (SQL_) 를 클릭해 줍니다 . 만약 쿼리 결과가 아닌 쿼리문을 보고 싶다면 쿼리디자이너의 하단의 쿼리라는 것을 클릭해 줍니다 .

그림에 이제 조건문을 추가 해줍니다 .

2-7. 쿼리디자이너 조건문 설정하기


조건문을 작성해 준다음 ‘’ 싱글 쿼테이션 사이에 마우스 클릭을 해준 후 마우스 우측키를 눌러 패러미터 마법사를 클릭해 줍니다 .

사용자 패러미터에서 불러오기 라디오 버튼을 클릭해 준 후 자신이 원하는 패러미터를 선택 하여 확인을 눌러 줍니다 .



실행을 시킨 후 제대로 실행되어지는지 패러미터를 입력 후 확인 해 봅니다 .

실행을 시켜줍니다 .

서울 경기에 대한 내용이 나오면 제대로 실행 되어 지는 것 입니다 .



쿼리디자이너상에서 스크립트를 사용하여 표현 하실 수 있습니다 .

2-8. 쿼리디자이너 스크립트 사용

string sql;sql="";sql = sql+"select * from Carinfo\n";if(#OZParam.param1# != ""){

sql = sql+"where Region='"+#OZParam.param1#+"'\n";sql = sql+"or Region = '"+#OZParam.param2#+"'";

}setQueryString(sql);


Chapter 03

OZ Application Setting

3-1 OZ Application 실행하기3-2 리파지토리 설정하기3-3 폴더구조 설정하기3-4 네임 법칙3-5 주요 단축키3-6 기본값 편집기3-7 옵션

다음은 OZ Application Designer 를 실행하는 방법에 대해 설명합니다 . 윈도우 시작 프로그램의 [ 프로그램 ] [OZ XStudio] [OZ Application Designer 4.0] 을 클릭하거나 윈도우 바탕 화면의 'OZ Application Designer 4.0' 아이콘을 클릭합니다 .

3. OZ Application 설정3-1. Application 실행하기

OZ Application Designer 가 실행되면 아래와 같은 초기 화면이 나타납니다 .

좌측상단부분의 아이콘을 클릭하여 새파일을 생성

합니다 .

3. OZ Application 설정3-1. Application 실행하기

작업 폴더는 리파지토리 클라이언트가 리파지토리 서버로부터 파일을 업로드하거나 다운로드 하는 폴더로 프로젝트에 추가되는 ODI, OZC, OZF, OZS 파일의 기준이 되는 폴더입니다 . 프로젝트에 ODI, OZC, OZF, OZS 파일 등을 추가하고자 할 때 해당 파일의 경로는 작업 폴더를 기준으로하여 상대 경로로 인식됩니다 . 또한 리파지토리를 이용한 파일의 공유 과정에서도 작업 폴더는 매우 중요한 역할을 담당합니다 .

위의 빨간색 부분이 Default 로 제공 되어지는 오즈 서버의 작업 폴더 입니다 .

3-2. 리파지토리 설정하기

3. OZ Application 설정

로컬의 작업폴더의 경우 자신이 원하는 폴더를 생성 후 해당 폴더를 작업폴더로 설정해 주시면 됩니다 . 작업 폴더의 설정 방법은 그림에서 보이듯이 리파지토리 트리창에서 바탕화면부터 따라 내려가 해당 자신이 원하는 폴더를 선택하고 마우스 우측키를 눌러 작업 폴더로 설정하시면 됩니다 .

위와 같은 작업을 시행 함으로써 서버와 로컬의 폴더 구조를 동기화 시키는 역할을 수행하며 작업폴더 상위 폴더 경로는 신경 쓰지 않아도 되지만 작업폴더의 하위 폴더는 서버와 동일한 구조를 이루어야 합니다 .

3-2. 리파지토리 설정하기

3. OZ Application 설정

폴더의 구조는 작업 폴더 아래의 구조를 이루는 것입니다 .

먼저 작업 폴더아래에 프로젝트 명이 있고 하위폴더로 odi, oza, ozr, ozc, ozf, ozs, img 이러한 형식으로 이루어 집니다 .

우측 이미지로 교육 폴더가 프로젝트 명이고 그 아래로 각각의 폴더가 위치를 하게 됩니다 .

odi : 쿼리디자이너로 작성된 파일 폴더 oza : 어플리케이션으로 작성된 파일 폴더 ozr : 오즈 리포트로 작성된 파일들의 폴더 ozf : 오즈 어플리케이션에서 함수편집기로 생성된 함수 파일들의 폴더 ozs : 오즈 어플리케이션에서 스타일편집기로 생성된 스타일 파일들의 폴더 ozc : 오즈 어플리케이션에서 사용자 컴포넌트로 생성된 파일들의 폴더 img : 이미지가 들어가게 되어질 폴더 .

3-3. 폴더 구조 설정하기3. OZ Application 설정

오즈에서 제공하는 함수들과 속성들의 명칭은 일반적인 함수나 속성의 경우 머리 문자가 대문자 입니다 . Ex) GetDataSet();

글로벌 함수의 경우 가장 앞에 _ 가 붙으며 그 다음 대문자가 오게 되어 있습니다 . 글로벌 함수들의 경우 F1 도움말 클릭 후 Component 항목의 Document 와 GeneralScript항목의 Global 에서 확인하실 수 있습니다 .Ex) _MessageBox();

위와 같은 경우로 인해 사용자 함수를 작성 하실 경우는 반드시 머리 문자가 소문자가 오게 작성을 하셔야 합니다 .Ex) userFuncData();

컴포넌트의 명의 경우 다음과 같이 명세 합니다 .Ex) 텍스트 박스 : tbx_ 고유명칭라디오 버튼 : rdo_ 고유명칭컴보박스 : cbo_ 고유명칭라벨 : lbl_ 고유명칭픽쳐박스 : pbx_ 고유명칭데이터 타임피커 : dtp_ 고유명칭마스크 텍스트 박스 : mtx_ 고유명칭… ..

3-4. 네임 법칙3. OZ Application 설정

Ctrl+P : 로컬에서 미리보기를 합니다 . Ctrl+S: 파일을 저장하는 기능 입니다 . Ctrl+O: 파일을 불러오는 기능 입니다 . Ctrl+H: 테스트 파일을 찾아 바꾸어주는 기능 입니다 . Ctrl+Z : 실행 취소 Ctrl+Y: 다시 실행 Ctrl+G: 스크립트에서 원하는 라인 위치를 찾아주는 기능입니다 . Ctrl+F : 스크립트에서 원하는 텍스트를 찾아주는 기능 입니다 . Ctrl+K+C : 주석 처리하기 ( 마우스로 드래그하여 블록 지정 후 사용 ) Ctrl+K+U : 주석 해제하기 ( 마우스로 드래그하여 블록 지정 후 사용 ) Ctrl+Space : 스크립트에서 자동 구문 완성 기능을 강제 호출하는 기능입니다 . Ctrl+Shift+Z : 미리보기 창을 클릭 후 트레이스 창을 보여주는 기능입니다 .

3-5. 주요 단축키3. OZ Application 설정

우선 자신이 기본값을 주기 원하는 컴포넌트를 화면에 그립니다 . 도구 -> 기본값 편집기를 클릭합니다 .

3-6. 기본값 편집기3. OZ Application 설정

해당 창에서 원하는 항목들의 기본값을 설정해 준 후 새 파일에 적용 버튼을 클릭 후 확인을 한 다음 어플리케이션을 닫았다 다시 실행시켜줍니다 . 주요 설정 항목

GridSize : Board, Panel, Table, Grid등 디자인 타임에 키보드로 컴포넌트를 옮길 수 있는 단위를 8 픽셀에서 2 픽셀로 변경하여 더 세밀한 작업을 가능하게 해줍니다 .ex)2,2 BackColor : 주로 255,255,255 로 흰색으로 변경을 해 줍니다 . Cursor : 버튼 같은 경우 해당 값을 Hand로 변경하여 마우스가 컴포넌트 위로 올라 갈경우 커서를 화살표 모양에서 손모양으로 변경을 해 줍니다 . Size : 보드 같은 경우 최소 사이즈를 정하여 항상 새 파일 생성시에 원하는 크기로 생성이 되게 해줍니다 .

3-6. 기본값 편집기3. OZ Application 설정

우선 자신이 기본값을 주기 원하는 컴포넌트를 화면에 그립니다 . 도구 -> 옵션을 클릭합니다 .

해당 체크박스를 체크하게 되면 스타일이 디자인 타임에서도 적용이 되어 집니다 . 체크를 하지 않게 될 경우 스타일을 디자인 타임에 적용 하여도 사용자는 미리 보기로 확인을 할 수 있습니다 .

3-7. 옵션3. OZ Application 설정

Chapter 04

OZ Application4-1 변수 선언4-2 주요 스트링 함수4-3 화면 로딩 시 실행 되어지는 이벤트4-4 HelloWorld 만들기4-5 트리거 이벤트4-6 디버깅 하기4-7 보드 추가4-8 다이얼로그 생성4-9 화면 전환4-10 함수 만들기4-11 스타일 만들4-12 사용자 컴포넌트 만들기

변수 선언에 있어 String, Integer, float, double 등 모든 선언 형식을 var 로선언을 해줍니다 . 이렇게 변수 선언을 할 때 객체도 담아서 사용을 하실 수 있습니다 .

Ex)var str = “abcde”; // 문자열 형식을 변수에 담습니다 .var num = 12345; // 숫자 형식을 변수에 담습니다 .var txt1 = TextBox1; // 객체를 변수에 담습니다 .

배열 선언var str = new Array();str[0] = 1;str[1] = 2;

글로벌 변수 선언_SetGlobal("aaa"," 변수 1");var str = _GetGlobal("aaa");ozf 파일의 function 함수 외부 , Document 의 Globalfunction 에 선언되어질 수 있습니다 .

4-1. 변수 선언4. OZ Application

substr, substring var str = "abcdefg";_TRACELN(str.substr(4,2)); // 결과 : ef. 시작 인덱스 부터 원하는 길이 만큼 문자열 반환_TRACELN(str.substring(4,6)); // 결과 : ef. 시작 인덱스 부터 끝 인덱스 까지의 문자열 반환

indexOf // 문자열에서 검색하는 문자열의 index 를 반환 . 없으면 -1 반환 . var str = "abcdefg";_TRACELN(str.indexOf("c")); // 결과 : 2

parseInt// 문자열을 숫자로 변환var str = "123";str = parseInt(str,10); // 여기서 10 은 10 진수를 뜻함

4-2. 주요 스트링 함수

4. OZ Application

toString

// 숫자를 문자열로 변환var str = 123;str = str.toString();

replace // 모든 문자를 바꿀 경우 var v = value.replace(/\n/g," "); // 특수 문자를 바꿀 경우 var value = value.replace(/[/]/g," ");

round // 반올림 var str = 314.6;str = Math.round(str); // 결과 : 315


4. OZ Application

정해진 소수점 자리에서 반올림 function round(str, idx) { var num = 1; for(var i=0;i<idx;i++){num = num+"0";} str = str*num; str = Math.round(str); str = str/num; return str; }

isNaN // 숫자인지 체크 if(isNaN()){ _TRACELN(" 숫자가 아닙니다 ."); }

length // 문자열 길이 반환 var str = "abcdefg";_TRACELN(str.length); // 결과 : 7

split // 문자열을 구분자로 분리해서 배열을 반환 var str = "abcdefg;abc";var arr = str.split(";");_TRACELN("arr0 = "+arr[0]+" arr1 = "+arr[1]); // 결과 : arr0 = abcdefg arr1 = abc


4. OZ Application

string 앞 뒤의 공백문자 제거 function trim(str){ if (str == null || str=="") return ""; return str.replace(/(^\s*)|(\s*$)/gi, ""); }

string 앞 공백문자 제거 function lTrim(str){ if (str == null || str=="") return ""; return str.replace(/(^\s*)/gi, ""); }

string 뒤의 공백문자 제거 function rTrim(str){ if (str == null || str=="") return ""; return str.replace(/(\s*$)/gi, ""); }


4. OZ Application

toLowerCase // 모든 영문자가 소문자로 변환된 문자열 반환 var str = "String Literal";str = str.toLowerCase( );

toUpperCase // 모든 영문자가 대문자로 변환된 문자열 반환 var str = "String Literal";str = str.toUpperCase( );


4. OZ Application

화면 로딩 시에는 3 가지의 이벤트가 실행되어 집니다 . 처음에 각각의 컴포넌트들 마다 OnInitialize 이벤트가 실행 되어지고 계층적으로 실행이 완료 되어지면 거꾸로 OnPostInitialize 이벤트가 실행 되어 집니다 . 그 다음 화면이 그려지고 나서 Board 에만 있는 속성으로 OnAttached 이벤트가 실행되어 집니다 .

OnInitialize OnPostInitialize

OnAttached 의 경우는 화면이 한번 로딩되었다 하더라도 호출 시 매번 이벤트를 호출 시키며 OnInitialize 와 OnPostInitialize 이벤트의 경우는 한번 로딩되어지면 다시 로딩 되어지지 않습니다 .

4-3. 화면 로딩시 실행되어지는 이벤트

4. OZ Application

버튼과 텍스트 박스를 그린 후 버튼 컴포넌트의 OnClick 이벤트에 해당스크립트를 넣어 줍니다 .TextBox1.Text = "HelloWorld";

컴포넌트 트리창 에서 컴포넌트를 선택한 후 마우스 우측키를 눌러 스크립트 편집을 클릭 합니다 .

해당 컴포넌트를 직접 클릭하여 마우스 우측키를 눌러 스크립트 편집을 합니다 .

컴포넌트를 마우스로 선택 후 스크립트 창으로 드래그 하여 스크립트 창을 선택합니다 .

스크립트편집창의 컴포넌트 콤보박스와 이벤트 콤보박스를 직접 클릭하여 선택합니다 .

4. OZ Application 4-4. HelloWorld 만들기

트리거 이벤트란 같은 기능을 하는 두 개 이상의 이벤트가 존재 할 시에 하나의 이벤트에 스크립트를 넣고 다른 이벤트에서는 단순히 트리거 함수를 사용하여 해당 스크립트를 호출 할 수 있다 .

버튼을 2 개를 만들어 줍니다 .

첫 번째 버튼의 OnClick 이벤트에 해당 스크립트를 넣어줍니다 ._MessageBox(“HelloWorld");

두 번째 버튼의 OnClick 이벤트에 해당 스크립트를 넣어줍니다 .Button1.TriggerEvent(EventNameConst.OnClick);

버튼 1 을 클릭하나 버튼 2 를 클릭하나 같은 액션이 일어나게 됩니다 .

4-5. 트리거 이벤트

4. OZ Application

메시지 박스의 호출의 경우 자신이 원하는 컴포넌트 이벤트 스크립트 창에 해당 스크립트를 넣습니다 .

글로벌 함수 등의 자동완성기능 호출은 Ctrl+Space 누루고 그 다음 _ 를 입력하셔야 합니다 .

Ex)_MessageBox("HelloWorld"+" 안녕하세요 ");

미리보기를 하여 확인을 합니다 . 해당 샘플의 경우 버튼의 클릭 시 메시지 박스가 화면에 호출 되는 것을 보실 수 있습니다 .

4-6. 디버깅 하기 (_MessageBox)

4. OZ Application

트레이스 창 호출의 경우 자신이 원하는 컴포넌트 이벤트 스크립트 창에 해당 스크립트를 넣습니다 . 글로벌 함수의 자동완성기능 호출은 Ctrl+Space누루고 _ 를 입력하셔야 합니다 .

Ex)_TRACELN("HelloWorld"+" hi");

4-6. 디버깅 하기 (_TRACELN)

미리보기 실행 후 화면을 클릭하고 Ctrl+Shift+Z 를 누루면 트레이스 창을 호출한 뒤 버튼을 클릭하여 확인 하실 수 있습니다 . 삭제시는 트레이스창 클릭 후 Delete키를 누릅니다 .

4. OZ Application

Document 의 새 보드 추가 항목을 선택합니다 .보드가 추가 되시는 것을 보실 수 있습니다 .

4-7. 보드 추가 4. OZ Application

만약 미리보기 시에 보드 2 를 띄우고 싶다면 보드를 클릭 후 마우스 우측키를 눌러 시작보드로 설정을 클릭 하시면 됩니다 .

4-7. 보드 추가 ( 시작보드로 설정 ) 4. OZ Application

보드 1 에 버튼을 생성 합니다 . 버튼의 클릭 이벤트에 해당 스크립트를 작성합니다 . Board1.ShowDialog("Board2", "Title", true, 100, 100, true);

4-8. 다이얼로그 생성

현재 Board1 을 사용하고 있는 객체들에서 Board2 의 객체를 사용하고 싶다면 var btn = _GetBoard("Board1").GetChild(" 자식객체명 "); 이러한 식으로 자신이 가져오고 싶은 보드의 자식객체를 가져와 사용하시면 됩니다 .

4. OZ Application

Arguments :Name 보드 이름

Title 다이얼로그 제목 , 빈 문자로 설정할 경우 타이틀바가 없는 다이얼로그로 생성됨

Modal 모달 다이얼로그로 띄울 지 여부모달 다이얼로그로 띄운 경우에는 다이얼로그가 닫히기 전에는 다른 창에 사용자 액션 ( 버튼 클릭 등 ) 을 할 수 없음

X 다이얼로그 위치 중 x 좌표Y 다이얼로그 위치 중 y 좌표

Resize 다이얼로그 크기 조절 가능 여부값을 설정하지 않으면 false 로 동작됨

AllowMaximize다이얼로그 크기 최대화 가능 여부값을 설정하지 않으면 false 로 동작됨

AllowMinimize다이얼로그 크기 최소화 가능 여부값을 설정하지 않으면 true 로 동작됨

4-8. 다이얼로그 생성4. OZ Application

// 다이얼로그를 모달로 띄우는 경우에는 다이얼로그 창을 닫힌 후 다음 스크립트가 동작됨

// 다이얼로그 창이 닫힌 후에 "OZ Application" 메시지 박스가 표시됨var b = Board1.ShowDialog("Board2", "Title", true, 100, 100, true);_MessageBox("OZ Application"); // 다이얼로그를 모달리스로 띄우는 경우에는 다이얼로그 창을 띄운 후 다음

스크립트가 동작됨// 다이얼로그 창이 뜬 후에 "OZ Application" 메시지 박스가 표시됨var b = Board1.ShowDialog("Board2", "Title", false, 100, 100, true);_MessageBox("OZ Application"); // 다른 OZA 의 보드를 다이얼로그를 띄우는 예var b = Board1.ShowDialog("AAA/b.oza", "Title", false, 100, 100, true); // 별칭을 사용하여 같은 OZA 를 여러 창으로 띄우는 예Board1.ShowDialog("AAA/b.oza:1", "Title", false, 100, 100, true);Board1.ShowDialog("AAA/b.oza:2", "Title", false, 200, 200, true);


Oza 파일에서 버튼을 하나 생성 후 버튼의 클릭 시에 다이얼로그를 다음과 같이 띄워줍니다 . 모달리스로 띄울 경우 해당 다이얼로그의 객체들을 가져오실 수 있습니다 .Board1.ShowDialog("/ 교육 /oza/ 다이얼로그 1.oza", "Title", false, 100, 100, true);var obj = _GetDocument("/ 교육 /oza/ 보드뷰 1.oza");if(obj){

var board = obj._GetBoard("Board1"); _TRACELN("board.Name = "+board.Name);

}else{ _TRACELN("obj NULL...");}

다이얼로그 창에서 상위 oza 에 있는 글로벌 변수를 가져오거나 함수를 사용하려 하면_SetGlobalObject("excelTable",Table1);_SetGlobal("fileName","excelExport");위처럼 상위 oza 에서 변수 혹은 객체를 선언해 주고하위 다이얼로그 oza 에서 다음과 같이 받아 사용하시면 됩니다 .var Grid = _GetGlobalObject("excelTable");var str = _GetGlobal("fileName");


보드 1 에 버튼을 생성 합니다 . 버튼의 클릭 이벤트에 해당 스크립트를 작성합니다 . Board1.ShowBoard("Board2");

다른 oza 의 화면 전환Board1.ShowBoard("/Category/A.oza");별칭을 이용한 화면 전환Board1.ShowBoard("/Category/A.oza:Alias1/Board2");Board1.ShowBoard("/Category/A.oza:Alias2/Board2");

4-9. 화면 전환4. OZ Application

오즈에서 제공하는 함수를 선언하는 방법은 총 3 가지를 제공하고 있습니다 . 1. 각각의 컴포넌트들 마다 들어가 있는 Functions. 2. Document 의 GlobalFunction 이벤트 3. 오즈에서 제공하는 ozf 함수 파일 .

1 번째의 경우 해당 함수가 들어가 있는 컴포넌트의 이벤트들만 사용을 할 수 있으며 다른 컴포넌트에서는 사용을 할 수 없는 가장 작은 단위의 함수 입니다 .

2 번째의 경우 하나의 oza 파일에 있는 모든 객체들이 선언되어진 함수를 사용할 수가 있습니다 .

3 번째의 경우 ozf 라는 파일로 만들어 간단히 임포트를 하여 많은 oza 가 해당 함수를 사용할 수 있습니다 .

4-10. 함수 만들기4. OZ Application

선언해주는 부분입니다 .Document 의 GlobalFunction 이벤트에 해당 함수를 선언해 줍니다 .// 넘겨주는 인자값으로 str 에는 스트링을 txt 는 텍스트 박스객체를 넘겨줍니다 .function aaa(str, txt){

_TRACELN("str = "+str+" txt = "+txt.Text);}

호출해주는 부분입니다 .보드에 버튼과 텍스트 박스를 생성해 줍니다 .버튼의 OnClick 이벤트에 해당 스크립트를 넣어 줍니다 .var str = "abc";var txt = TextBox1;aaa(str, txt);

미리보기하여 버튼을 클릭하여 트레이스가 제대로 실행 되어지는지 확인 합니다 .

4-10. 함수 만들기 (GlobalFunction)

4. OZ Application

어플리케이션의 도구 ->함수편집기를 선택 해 줍니다 . 새 파일을 만들어 줍니다 .

4-10. 함수 만들기 (ozf 만들기 )

4. OZ Application

기존에 Document 의 GlobalFunction 에서 작업한 함수를 잘라내기 하여 ozf에 붙여 넣습니다 . 작업폴더 아래에 ozf 라는 폴더를 생성하여 해당 파일을 저장 합니다 . 어플리케이션에서 인비지블 컴포넌트 트리창을 선택하여 Document 를 클릭 후 추가의 함수추가를 하여 ozf 함수를 임포트 해 줍니다 .

임포트 후 미리보기를 해 화면을 실행해줍니다 .

4-10. 함수 만들기 (ozf 만들기 )

4. OZ Application

어플리케이션의 도구 ->스타일편집기를 선택 해 줍니다 . 새 파일을 만들어 줍니다 .

4-11. 스타일 만들기4. OZ Application

스타일을 클릭 후 마우스 우측키를 눌러 새 속성추가를 클릭해 줍니다 .

해당 창에서 BackColor 를 선택 한 후 확인을 클릭해 줍니다 .


우측에 BackColor 가 추가 되어 있는 것을 확인 할 수 있습니다 . 이러한 스타일 파일은 새 스타일 추가로 몇 개이든 만들 수 있습니다 . 또한 하나의 스타일이 여러 개의 속성을 가질 수 도 있습니다 . 만들어진 파일을 작업폴더 아래 ozs 라는 폴더를 만들어 저장을 해 줍니다 .


어플리케이션에서 인비지블 컴포넌트 트리창을 선택하여 Document를 클릭 후 추가의 함수추가를 하여 ozs를 임포트 해 줍니다 .

해당 자신이 원하는 스타일을 마우스로 클릭 후 드래그 하여 자신이 원하는 컴포넌트 위에 놓아 줍니다 . 스타일이 변경 되어지는 것을 볼 수 있습니다 . 혹은 스타일을 변경 하고자 하는 컴포넌트를 클릭 후 속성창의 스타일 속성을 선택해 줍니다 .


화면에 패널과 버튼과 텍스트 박스를 하나 그려줍니다 .

그려준 패널안에 각각의 버튼과 텍스트 박스를 넣습니다 .

4-12. 사용자 컴포넌트 만들기 (OZC)4. OZ Application

그려준 패널을 클릭 후 마우스 우측키를 누룬 후 컴포넌트 내보내기를 합니다 . 작업폴더 아래에 ozc 폴더를 만들어 저장 합니다 .


디자이너에서 OZC 임포트 하기보드에 ozc 로 내보낸 패널을 삭제 해 줍니다 .보드를 클릭 후 마우스 우측 키를 눌러 컴포넌트 가져오기를 None 타입으로 만들어진 ozc 파일을 임포트 시켜줍니다 .해당 만들어진 ozc 가 화면에 임포트 되어지는 것을 보실 수 있습니다 .

스크립트로 OZC 임포트 하기임포트 되어진 패널을 삭제해 줍니다 .버튼을 하나 만들어 줍니다 .만들어진 버튼에 해당 스크립트를 명세해 줍니다 .Board1.ImportNewChild("ozp://ozc/aaa.ozc");Ozp 의 경우 리파지토리를 의미 하며 리파지토리 폴더 아래로 폴더와 ozc 파일명을 적어 주시면 됩니다 .미리보기를 실행하여 버튼을 클릭하면 해당 ozc 가 동적으로 임포트 되어지는 것을 보실 수 있습니다 .


컴포넌트 가져오기 None, Auto Include, Menual Include 의 차이점None 타입의 경우는 OZC 를 가져온 후 파일을 저장하여도 OZC 수정사항이 적용되지 않습니다 .

Auto Include 의 경우 속성창의 ManageType 속성중에 Save Type 을 AutoSave 로 변경해 주게 될 경우 OZC 를 따로 내로 내지 않아도 수정 후 파일 저장을 했을 때 수정사항이 OZC 파일에 적용이 되어집니다 .

Menual Include 의 경우 미리보기 시에 해당 사항이 보이지 않게끔 임포트 하는 항목입니다 .

주로 사용되어지는 것은 None 타입과 Auto Include 방식이 주로 사용이 되어집니다 .


1. Oza 파일을 만들어 버튼을 하나 만듭니다 .또 다른 oza 파일을 만들어 Board 의 BackColor 를 변경해 주고 텍스트 박스를 만들어 줍니다 .처음 만들어진 oza 에서 Button 클릭시 다른 oza 의 보드를 다이얼로그로 띄워주고 동시에 텍스트 박스에 HelloWorld 를 찍어 줍니다 .

2. 위의 다이얼로그를 띄워주는 방식을 화면전환 하는 방식으로 바꾸어 줍니다 .

실습4. OZ Application

Chapter 05

OZ Application 주요 컴포넌트5-1 Document5-2 패널5-3 그룹박스5-4 스플리터5-5 보드뷰5-6 콤보박스5-7 테이블5-8 그리드5-9 테이블 그리드 CRUD5-10 라벨5-11 픽쳐 박스5-12 텍스트 박스5-13 버튼5-14 체크 박스 , 라디오 버튼5-15 리스트 박스 , 체크 리스트

박스5-16 뉴메릭 업다운5-17 마스크 텍스트 박스

5-18 리치 텍스트 박스5-19 데이트 타임 피커5-20 켈린더5-21 수평 , 수직 네비게이션5-22 탭컨트롤5-23 타이머5-24 프로그래스바5-25 툴팁5-26 컨텍스트 메뉴5-27 메인 메뉴5-28 이미지 리스트5-29 트리뷰5-30 크로스탭5-31 차트5-32 리포트 컨트롤5-33 리포트 버튼5-34 HTML 뷰

Document 의 경우 어플리케이션의 최 상위 객체이며 이것의 중요 속성으로는 AutoAdjustSize, AllowExternalAccess 속성을 이야기 할 수 있습니다 .

AutoAdjustSize 가 true 가 되게 되면 미리보기시에 사이즈의 증감에 따라 보드의 크기가 변경되어지는 것을 확인 하실 수 있습니다 .

5. OZ Application 주요 컴포넌트5-1. Document

False실제 보드 크기

화면크기

True

AllowExternalAccess 속성의 경우 외부 JSP, ASP, HTML 페이지와 통신을 하기 위해서는 반드시 True 로 설정이 되어져야 합니다 .

패널의 경우 레이아웃 컴포넌트로서 영역을 지정해 주는 역할을 해 주는 컴포넌트 입니다 . 주로 사용되어지는 속성으로 Dock 속성이 존재 합니다 . 패널을 하나 그려줍니다 .

패널의 속성 중 Dock 속성을 Top 으로 줍니다 .

5. OZ Application 주요 컴포넌트5-2. 패널

패널을 하나 그려줍니다 . 패널의 속성 중 Dock 속성을 Left 주고 패널을 다시 하나 더 그려 Dock 속성을 Fill 로 주어 줍니다 . 아래 그림처럼 영역을 지정해 줄 수 있습니다 .

5-2. 패널5. OZ Application 주요 컴포넌트

Dock 속성과 함께 주로 쓰이는 속성으로 Anchor 속성을 사용 할 수 있습니다 .화면에 버튼을 하나 올려 놓고 Document 의 AutoAdjustSize 속성을 True 로 설정해 줍니다 .버튼의 Anchor 속성을 Top,Right 로 변경해 줍니다 .화면상에서 화면이 리사이즈가 될경우 버튼이 우측 상단에 고정되어 움직이는 것을 확인 하실 수 있습니다 .

5-2. 패널5. OZ Application 주요 컴포넌트

그룹박스를 하나 그려줍니다 . 그룹박스의 경우 패널과 동일한 레이아웃 컴포넌트 이며 모양의 차이를 제외하고는 패널과 같은 기능을 해 줍니다 .

5-3. 그룹박스5. OZ Application 주요 컴포넌트

패널을 하나 그려주고 Dock 설정을 Left 로 줍니다 .스플리터를 하나 그려줍니다 .스플리터의 속성중 Cursor 를 Hsplit 으로 변경해 줍니다 .패널을 하나 그려주고 Dock 설정을 Fill 로 해 줍니다 .스클리터를 사용하여 영역을 구분 지어 움직이실 수 있습니다 .

5-4. 스플리터

사용자가 미리보기 상에서 스플리터를 사용하여 영역을 조정 하실 수 있습니다 .

5. OZ Application 주요 컴포넌트

위의 Dock 속성이 Fill 로 주어진 패널에 보드뷰를 그려줍니다 .

보드뷰의 Dock 속성을 Fill 로 주어주고 좌측 패널에 버튼을 2 개 올려 놓습니다 .

보드뷰

5-5. 보드뷰


2 개의 oza 파일을 만들어 주되 모양이 서로 다르게 디자인 하여 만들어 줍니다 . 디자인 시에 텍스트 박스를 만들어 넣어줍니다 . 버튼 1 의 클릭 이벤트에 해당 스크립트를 넣어줍니다 . 버튼 2 의 클릭 이벤트에 해당 스크립트를 넣어줍니다 .

// 다른 OZA 의 시작 보드를 표시하는 예BoardView1.BoardName = "/Category/Sample.oza "; // 다른 OZA 의 특정 보드를 표시하는 예BoardView1.BoardName = "/Category/Sample.oza/Board2"; // 별칭을 이용하여 보드를 표시하는 예BoardView1.BoardName = "/Category/Sample.oza:AA/Board2";

미리보기를 하여 버튼을 누르게 되면 각각 지정되어진 oza 가 호출 되어 집니다 .

보드뷰

5-5. 보드뷰


보드뷰를 사용하여 보드뷰를 포함한 상위 oza 에서 보드뷰에 임포트 되어진 oza 에 있는 객체를 가져오고자 한다면 BoardView1.BoardName = "/ 교육 /oza/ 보드뷰 1.oza";var board = BoardView1.GetChildBoard();_TRACELN("child = "+board.Name);

하위 oza 에서 보드뷰를 포함하고 있는 상위 oza 에 있는 글로벌 변수를 가져오거나 함수를 사용하려 하면var doc = _GetDocument("/ 교육 /oza/ 보드뷰메인 .oza")._GetGlobalScript();var gloStrTest = doc.gloStr;// 혹은 gloStr 대신에 함수를 사용 해도 됩니다 ._TRACELN("gloStr = "+ gloStrTest);gloStrTest 이란 변수가 보드뷰메인 .oza 에 글로벌로 선언되어져 있어야 합니다 . 함수 역시 같은 방법으로 사용 할 수 있습니다 .

5-5. 보드뷰


미리보기 후 버튼 1 을 클릭하여 해당 oza 화면을 불러와 그 화면의 텍스트 박스에 값을 입력합니다 .

버튼 2 를 클릭하여 화면전환을 한 후 다시 버튼 1 을 클릭하게 되면 기존에 텍스트 박스에 입력해 놓았던 값이 그대로 존재하는 것을 확인 하실 수 있습니다 . 만약 화면 전환시에 이러한 값들을 리프레쉬 하고자 한다면 해당 호출이 되어지는 oza 의 보드 속성중 AutoDelete 라는 속성을 True 로 주시면 됩니다 .

5-5. 보드뷰 (AutoDelete)


(1). 화면에 컴보박스를 그려줍니다 .( 마법사 사용 )

그려진 컴보박스를 클릭 후 마우스 우측키를 눌러 마법사를 실행시킵니다 .

실행되어진 마법사 창에서 원하는 항목을 입력해주고 ItemValue 값을 설정해 줍니다 .

5-6. 콤보박스


(2). 화면에 컴보박스를 그려줍니다 .( 데이터 셋 사용 ) 컴보박스에 넣을 데이터 셋을 만들어 주어야 합니다 . ODI 를 열어 셋을 하나 더 만들어 줍니다 해당 셋에 다음 쿼리문을 넣어줍니다 .

select Region, ERegion from Carinfogroup by Region, Eregion

실행을 시켜주고 저장을 하신다음 어플리케이션의 데이터 트리창을 새로 고침 해 줍니다 .

우측에 빨간색 영역이 컴보박스에 넣어줄 값과 아이템 값 입니다 .

5-6. 콤보박스


마우스드래그

컴보박스에 세팅이 되어질 텍스트 필드를 마우스로 드래그 드롭 해줍니다 .

컴보박스에 텍스트 값 세팅후 아이템 벨류도 선택을 해주어야 한다면 컴보박스의 속성창의 ValueField 를 선택해 주면 됩니다 .

5-6. 콤보박스


(3). 화면에 컴보박스를 그려줍니다 .( 스크립트 사용 ) 컴보박스의 OnPostInitialize 이벤트에 해당 스크립트를 넣어줍니다 . 해당 예제의 경우 데이터 셋으로 값을 가져올 수 있다는 전제하에 제공 되어지는 예제 입니다 .

var dm = _GetDataManager().GetDataModule(" 모듈명 ");var ds = dm.GetDataSet(" 셋명 ");for(var i=0;i<ds.GetRowCount();i++){

var txt = ds.GetStringData(i," 텍스트필드명 ");var id = ds.GetStringData(i," 벨류 필드명 ");This.AddItem(txt, id);// 컴보에 아이템을 넣어준다 .

}This.SelectedIndex = 0;// 첫번째 항목이 선택 되어진다 .

5-6. 콤보박스


컴보박스에 선택되어진 텍스트와 선택되어진 아이템 벨류값의 확인 방법입니다 .

5-6. 콤보박스


DropDownStyle DropDownList 로 변경하게 되면 컴보박스의 텍스트 항목을 수정 할 수 없게 할 수 있습니다 .

5-6. 콤보박스

5. OZ Application 주요 컴포넌트 DropDownStyle 이 DropDown 으로 설정이 되어져 있을 때 AutoSelect 가 True 이면 텍스트 박스 수정시 자동 선택이 되어 집니다 .

테이블 컴포넌트란 리스트성 조회 데이터를 사용자에게 보여주기 위한 컴포넌트 입니다 . 먼저 기존에 만든 ODI 를 인클루드 시켜주며 컴보박스에 지역데이터를 넣어주고 버튼을 생성합니다 .( 위의 만들어진 컴보박스를 사용하면 됩니다 .) 그리고 테이블을 그려줍니다 .

테이블

5-7. 테이블5. OZ Application 주요 컴포넌트

자신이 표현하고자 하는 리스트성 데이터 셋을 마우스로 클릭하여 테이블에 드래그 해 줍니다 . 테이블 속성창에서 ODIKey 와 DataSet 을 직접 설정 하셔도 됩니다 .

드래그


테이블을 더블클릭해 줍니다 . 테이블 마법사를 보실 수 있습니다 . 자신이 사용자에게 보여주고자 하는 리스트 필드들을 선택해 우측 공간으로 이동시켜주고 확인을 눌러 줍니다 .


확인을 하게 되면 테이블 디자인이 보이게 되며 미리보기를 실행하게 되면 아래와 같이 실행 화면을 보실 수 있습니다 .


디자이너에 그려져 있는 버튼을 조회 버튼이라 생각을 하고 해당 버튼의 OnClick 이벤트에 다음 스크립트를 넣습니다 .

var dm = _GetDataManager().GetDataModule("sample1");dm.UpdateOZParam("param1", ComboBox1.Value);dm.UpdateOZParam("param2", ComboBox2.Value);var ds = dm.GetDataSet("SQL_1",null,true);

ODI 에 선언되어진 파라메터 명입니다 . 데이터 셋 명입니다 .

파라메터에 넘겨줄 값 입니다 .

ODI 명칭입니다 .

해당 인자를 넘겨주지 않으면 처음 데이터 셋을 호출 후 그 다음 부터는 가져온 Set 을 그대로 사용하게 되어 한번 조회 후 다시 DB 에서 가져 오지 않습니다 .


미리보기 후 버튼을 클릭하게 되면 컴보박스에 값에 따라 조회 되어지는 것을 보실 수 있습니다 .

헤더GetHeader()

인디케이터GetIndicator()

타이틀GetTitle()

셀GetCell() 그리드에서사용GetCellInPage()<- 테이블에서사용


테이블의 특성상 만약 Default 로 바인딩을 사용 하고 있다면 첫 화면 로딩시 데이터를 한번 바인딩 하게 되어져 있습니다 . 퍼포먼스상 이러한 바인딩을 없애주는 것이 성능을 더욱 향상 시켜 줍니다 .

1. 테이블의 BindingAtInitialize 속성을 False 로 변경해 줍니다 .2. 테이블의 ShowTitleAtInitialize 속성을 True 로 변경해 줍니다 .

1. 테이블의 인디케이터를 보이고 싶지 않다면 속성에 ShowIndicator 를 false 로 주시면 됩니다 .

2. 인디케이터의 시작 번호를 0 이 아닌 값으로 주고 싶다면 속성에 IndicatorStartIndex 값을 원하시는 값으로 넣으시면 됩니다 .


테이블을 더블 클릭 하여 테이블 마법사에서 상단의 디자인 탭을 클릭하게 되면 타이틀과 셀을 디자인 하실 수 있습니다 . 자신이 원하는 셀을 클릭하여 분할 할지 삽입할지 삭제 할지 마우스 우측 키로 컨트롤 하여 타이틀 혹은 셀을 2 줄 이상 만드실 수 있습니다 .


테이블을 더블 클릭 하여 테이블 마법사에서 선택한 필드 중에 자신이 컨트롤 하고자 하는 필드를 선택 한 후 우측의 속성으로 해당 필드들을 제어 할 수 있습니다 .


ColumnType : 테이블 셀을 다양한 형태로 변경해 줄 수 있습니다 . PicktureBox, Button, CheckBox, RadioButton, ComboBox, RichTextBox 등으로 변경 하실 수 있습니다 .

SortType : 사용자가 미리보기시 테이블 타이틀을 클릭하여 테이블이 소팅이 되어지게 하는 기능을 제공합니다 . Text, Numeric 형태로 소트 하실 수 있습니다 .

TableSortMode : 테이블 소팅시 화면에 보여지는 셀단위로 소팅할지 아니면 연결되어져 있는 데이터 셋을 기준으로 소팅할 지를 결정해 주는 속성입니다 .

ColumnEditable : 사용자가 미리보기시 해당 타이틀의 셀들을 수정 할 수 있게 하는 지를 제어해 주는 속성입니다 .

ColumnMerge : 사용자가 미리보기시 같은 항목이 연달아 존재시 머지하는 기능을 제공하는 속성 입니다 .

ColumnAutoSize : 테이블의 길이를 텍스트 크기에 맞게 자동으로 조절 해 주는 기능 입니다 .


(3). 마우스 클릭 , 더블클릭 시에 타이틀과 셀을 구분 짓기 .사용자가 OnLMouseDown, OnLDoubleClick 등의 이벤트에서 마우스 클릭 위치를 잡아 특정 액션을 취하는 경우가 많은데 이럴 경우 타이틀 클릭시에는 주로 액션을 일으키지 않아야 하는 경우가 많습니다 . 이럴 경우 클릭되어진 셀을 가져와 해당 셀타입을 구분하여 사용자가 타이틀을 클릭했는지 셀을 클릭 했는지 구분 지어 줄 수 있습니다 .

var cell = This.GetCellByPos(ozarg_x,ozarg_y);if(cell == null)return;if(cell.ComponentType == "GridCellTitle"){

_TRACELN(" 타이틀을 클릭하셨습니다 .....");return;

}_TRACELN(" 셀을 클릭하셨습니다 ....");

위의 스크립트를 사용하여 다양한 이벤트에서 테이블의 타이틀과 셀을 구분지어 줄 수 있습니다 . 참고로 ozarg_x 와 ozarg_y 의 경우는 이벤트에서 제공해 주는 변수 이므로 반드시 사용 전 해당 이벤트에서 다음 변수들을 제공 하는지 확인 해 주셔야 합니다 .


(4). 테이블의 셀을 콤보 박스로 만들어 주기 .우선 테이블을 더블클릭하여 테이블 마법사를 실행해 줍니다 . 선택한 필드 중 콤보 박스로 만들고자 하는 필드를 선택한 다음 ColumnType 을 ComboBox 로 변경해 주고 ColumnEditable 을 True 로 줍니다 . 확인을 하시면 테이블 셀이 변경되어진 것을 볼 수 있습니다 .


(4). 테이블의 셀을 콤보 박스로 만들어 주기 .데이터 트리창에서 콤보박스에 세팅되어질 텍스트 필드를 드레그하여 필드에 드롭해 줍니다 . 테이블 필드의 속성창에 ODIKey 와 DataSet 과 Field 값이 선택이 되어지면 ValueField 값을 직접 설정해 줍니다 . 미리보기를 실행하여 제대로 실행 되어지는지 확인 합니다 .

만약 특정 이벤트 시에 테이블 컴보박스의 선택되어진 필드의 ItemValue값을 가져오고 싶다면 셀을 가져와 셀의 속성인 ItemValue 라는 속성으로 가져올 수가 있습니다 .

Ex) var item = Table1.GetCellInPage(0,0).ItemValue;


5-8. 그리드

그리드 컴포넌트란 리스트성 조회 데이터 및 다양한 격자 모양의 구성을 사용자에게 보여주기 위한 컴포넌트 입니다 .( 간트 차트 , 달력등 다양한 그림을 그리실 수 있습니다 .) 테이블과 동일하게 리스트성을 설명하도록 하겠습니다 . 기존 만들어진 ODI 를 임포트 시켜주고 그리드를 그려줍니다 .


5-8. 그리드

처음 화면 로딩과 동시에 그리드의 경우 타이틀을 그려주는 작업을 먼저 하셔야 합니다 . 그리드는 격자 모양의 컴포넌트로 모든 작업에 있어 스크립트로 구현 됩니다 . Board 의 OnPostInitialize 이벤트에 그리드의 타이틀을 먼저 그려주도록 합니다 .

// 그리드의 기초적인 모습을 그려줌 ( 타이틀 )var title = " 지역 ; 사무실 ;QUANTITY;TOTAL";var width = "80;80;80;80";var height = 24;var arrTitle = title.split(";");var arrWidth = width.split(";"); Grid1.AddColumn(arrTitle.length);for(var i=0; i<arrTitle.length; i++){

Grid1.GetTitle(0, i).Value = arrTitle[i];Grid1.GetTitle(0, i).Size = arrWidth[i]+","+height;

}

미리보기를 하시면 로딩과 동시에 타이틀이 보여지는 것을 확인 하실 수 있습니다 .


5-8. 그리드

조회 Button 의 OnClick 이벤트에서 조회시 데이터 값을 가져와 그리드에 뿌려주는 로직을 작성 하시면 됩니다 . 데이터셋 에서 값을 가져오는 함수로는 GetStringData, GetStringDataByIndex 두가지 함수 중 하나를 사용하실 수 있습니다 .

var dm = _GetDataManager().GetDataModule("sample1");dm.UpdateOZParam("param1", ComboBox1.Value);dm.UpdateOZParam("param2", ComboBox2.Value);var ds = dm.GetDataSet("SQL_1",null,true);

for(var i=0;i<ds.GetRowCount();i++){

Grid1.AddRow(1);Grid1.GetCell(i,0).Value = ds.GetStringData(i,"Region");Grid1.GetCell(i,1).Value = ds.GetStringData(i,"BranchOffice");Grid1.GetCell(i,2).Value = ds.GetStringData(i,"Quantity");Grid1.GetCell(i,3).Value = ds.GetStringData(i,"TotalAmount");

}

자신이 넣고자 하는 값의 필드명 입니다 .


5-8. 그리드

미리보기를 하여 조회 버튼을 클릭하시면 해당 화면 처럼 그리드에 리스트가 뿌려지는 것을 확인 하실 수 있습니다 .


5-8. 그리드 , 테이블

이러한 그리드의 경우 다양한 스크립트를 사용하여 그리드의 스타일을 정하실 수 있습니다 .

GetTitle : 그리드의 타이틀을 가져와 스타일 및 값을 변경 해 줄 때 사용하는 함수 입니다 . Ex) Grid1.GetTitle(0).Value = "Hello";Grid1.GetTitle(0,0).Value = "Hello";// 타이틀이 두줄 이상일 때 사용합니다 .

GetHeader : 그리드의 헤더를 가져와 스타일 및 값을 변경 해 줄 때 사용하는 함수 입니다 . Ex) Grid1.GetHeader().Value = "Hello";

GetIndicator : 그리드의 인디케이터를 가져와 스타일 및 값을 변경 해 줄 때 사용하는 함수 입니다 . Ex) Grid1.GetIndicator(0).Value = "3";

GetCell : 그리드의 셀을 가져와 스타일 및 값을 변경 해 줄 때 사용하는 함수 입니다 . Ex) Grid1.GetCell(0,0).Value = "Hello";// 그리드Ex) Table1.GetCellInPage(0,0).Value = “Hello";// 테이블


5-8. 그리드 , 테이블

그리드 셀의 속성을 영역을 지정해 변경해 주는 함수 입니다 . 각각의 셀마다 얻어와 속성을 변경시켜줄 수 있겠지만 영역을 지정하여 한번에 변경 하실 수 있습니다 .void SelectCellRange( integer MinRowIndex, integer MinColumnIndex, integer MaxRowIndex, integer MaxColumnIndex)

Ex)// 영역을 지정하여 지정되어진 셀을 머지 합니다 .Grid1.SelectCellRange(0, 2, 4, 4);Grid1.MergeCellInRange(true);

Ex)// 영역을 지정하여 선택 되어진 영역의 셀들의 속성을 변경시켜줍니다 .Grid1.SelectCellRange(0, 2, 4, 4);Grid1.SetPropertyInRange(PropertyNameConst.BackColor, "225, 225, 225");


그리드 셀의 속성을 영역을 지정해 변경해 주는 함수 입니다 . 각각의 셀마다 얻어와 속성을 변경시켜줄 수 있겠지만 영역을 지정하여 한번에 변경 하실 수 있습니다 .Ex)// 그리드 셀의 컴포넌트 타입을 변경해 줍니다 .Grid1.SelectCellRange(0, 1, -1, 1);Grid1.ChangeCellTypeInRange("Button");

Ex)// 그리드 셀이 사용자에게 보여질 때는 라벨로 보이지만 사용자가 셀에 에디트를 하게 되면 셀의 타입이 변경되어집니다 .Grid1.SelectCellRange(0, 1, -1, 1);Grid1.CellEditComponentTypeConst("CheckBox");

Ex)// 타이틀에 영역을 지정하여 속성을 변경 시켜줍니다 .Grid1.SelectTitleRange(0, 1, 3, 3); Grid1.SetPropertyInRange(PropertyNameConst.BackColor, "255, 255, 255");

5. OZ Application 주요 컴포넌트5-8. 그리드 , 테이블

5-8. 그리드 , 테이블 ( 마우스 변경 )

그리드의 마우스 이동에 따라 색상을 변경 시켜주는 예제 입니다 . 특정 컬럼에서는 커서 모양를 손모양으로 변경 시켜 주었습니다 .

// 마우스의 이동에 대한 색깔을 칠해줌 Grid 의 OnCellMouseEntervar row = ozarg_y_cell_index-1;var cols = This.GetColumnCount();if(row>-1){

for(var i=0; i<cols; i++){This.GetCell(row, i).BackColor = "225,255,255";

}}

// 마우스의 손모양을 그려줌var row = ozarg_y_cell_index-1;var col = ozarg_x_cell_index;if(row>-1 && ( col==4 || col==12)){ This.Cursor = CursorTypeConst.Hand;}


5-8. 그리드 , 테이블 ( 마우스 변경 )

// 마우스의 색깔을 원래대로 해줌 Grid의 OnCellMouseLeavevar row = ozarg_y_cell_index-1;var cols = This.GetColumnCount();if(row>-1){

for(var i=0; i<cols; i++){This.GetCell(row, i).Ba

ckColor = "255,255,255";}

}

// 마우스의 손모양을 원래대로 해줌var row = ozarg_y_cell_index-1;var col = ozarg_x_cell_index;if(row>-1 && ( col==4 || col==12)){ This.Cursor = CursorTypeConst.Default;}


5-9. 테이블 그리드 스크립트 DATAACTION

(1). 테이블 그리드 입력 수정 삭제 이러한 행동들이 자동으로 Action 객체에 담기며 커밋 실행시 일괄적으로 쿼리 디자이너에게 값들을 전달해 주며 쿼리디자이너의 행 삽입 , 삭제 , 수정쿼리를 실행 시켜줍니다 . 이럴 경우 쿼리디자이너 상에서 삽입 삭제 수정에 대한 쿼리문이 입력되어져 있어야 합니다 .



(1). 테이블 그리드 입력 수정 삭제 오즈에서 액션객체에 담겨오는 값으로 파라메터를 받게 되는데 여기에서 적용한 파라메터의 경우 행 삽입 삭제 수정입력 창에서 마우스 우측키를 누르게 되면 파라메터 마법사를 이용하여 선택 하실 수 있습니다 . 이 파라메터의 사용에 있어 필드의 경우는 ‘’를 사용하지 않고 벨류 값에만 사용을 합니다 . 또한 숫자형에 있어서는 ‘’ 를 적어주지 않습니다 .

#@ARG_SF1# : Source Field 를 받아주는 파라메터로 변경되어질 필드명을 받아줍니다 .#@ARG_SV1# : Source Value 를 받아주는 파라메터로 변경되어질 값들을 받아줍니다 ..#@ARG_DF1# : Definition Field 를 받아주는 파라메터로 조건 필드명을 받아줍니다 .#@ARG_DV1# : Definition Value 를 받아주는 파라메터로 조건 값을 받아줍니다 .



(1). 테이블 그리드 입력 수정 삭제‘’ 의 경우 문자형에는 반드시 존재 해야 하며 숫자형일 경우 표기 하지 않습니다 .필드 파라메터 역시 ‘’을 사용하지 않습니다 .입력문INSERT INTO GRIDSAMPLE(#@ARG_SF1#,#@ARG_SF2#,#@ARG_SF3#,#@ARG_SF4#,#@ARG_SF5#)VALUES('#@ARG_SV1#','#@ARG_SV2#',#@ARG_SV3#,#@ARG_SV4#,#@ARG_SV5#)

수정문UPDATE GRIDSAMPLESET #@ARG_SF1# = '#@ARG_SV1#',

#@ARG_SF2# = '#@ARG_SV2#',#@ARG_SF3# = #@ARG_SV3#,#@ARG_SF4# = #@ARG_SV4#,#@ARG_SF5# = #@ARG_SV5#

WHERE #@ARG_DF1# = '#@ARG_DV1#‘

삭제문DELETE FROM GRIDSAMPLE WHERE #@ARG_DF1# = '#@ARG_DV1#'



Insertif(This.Text == "Insert"){

Table1.InsertNewRow(0);//This.Text = "OK";

}else{This.Text = "Insert";// 삽입 삭제가 일어나게 되어지는 셋을 가져온다 .var dm = _GetDataManager().GetDataModule("TABLECRUD");dm.CleanUpQueuedActions();var ds = dm.GetDataSet("CUSTOMER");

//CRUD 를 위한 ACTION 객체를 생성해준다 .var DataAction = new Array();DataAction[0] = ds.MakeDefaultDataAction();// 빈액션객체를 만들어준다 .DataAction[0].DataActionType = DataActionTypeConst.Insert;// 인서트인지 업데이트인지 삭제 인지를 결정해준다 .

var arrField = new Array(); var arrValue = new Array();arrField[0] = "MENUID"; arrValue[0] = Table1.GetCellInPage(0, 0).Text;arrField[1] = "REGION"; arrValue[1] = Table1.GetCellInPage(0, 1).Text;arrField[2] = "VALUE1"; arrValue[2] = Table1.GetCellInPage(0, 2).Text;arrField[3] = "VALUE2"; arrValue[3] = Table1.GetCellInPage(0, 3).Text;arrField[4] = "VALUE3"; arrValue[4] = Table1.GetCellInPage(0, 4).Text;

DataAction[0].SetSourceNames(arrField);// 필드를 설정해준다 .DataAction[0].SetSourceValues(arrValue);// 값을 설정해 준다 .

ds.QueueActionObjects(DataAction);// 큐에 해당 액션을 만들어준다 .var Result = dm.CommitQueuedActions();// 디비에 커밋을 한다 .

if(Result == ""){// 액션이 제대로 수행되어지면 "" 을 리턴한다 ._MessageBox(" 추가되었습니다 .");

} else {_MessageBox(Result);

}}

처음 버튼 클릭시 해당 버튼을 OK 로 변경해 주며 한 줄을 추가해 줍니다 .그 다음 버튼 클릭시 저장을 수행합니다 .



Update// 삽입 삭제가 일어나게 되어지는 셋을 가져온다 .var dm = _GetDataManager().GetDataModule("TABLECRUD");dm.CleanUpQueuedActions();var ds = dm.GetDataSet("CUSTOMER");

//CRUD 를 위한 ACTION 객체를 생성해준다 .var DataAction = new Array();DataAction[0] = ds.MakeDefaultDataAction();// 빈액션객체를 만들어준다 .DataAction[0].DataActionType = DataActionTypeConst.RowUpdate;// 인서트인지 업데이트인지 삭제 인지를 결정해준다 .

var rIdx = Table1.GetFocusRowIndex();// 클릭되어져 있는 행을 수정한다 .var arrField = new Array(); var arrValue = new Array();arrField[0] = "MENUID"; arrValue[0] = Table1.GetCellInPage(rIdx, 0).Text;arrField[1] = "REGION"; arrValue[1] = Table1.GetCellInPage(rIdx, 1).Text;arrField[2] = "VALUE1"; arrValue[2] = Table1.GetCellInPage(rIdx, 2).Text;arrField[3] = "VALUE2"; arrValue[3] = Table1.GetCellInPage(rIdx, 3).Text;arrField[4] = "VALUE3"; arrValue[4] = Table1.GetCellInPage(rIdx, 4).Text;


var targetNames = new Array(); var targetValues = new Array();targetNames[0] = "MENUID"; targetValues[0] = Table1.GetCellInPage(rIdx,0).Value;DataAction[0].SetTargetNames(targetNames);DataAction[0].SetTargetValues(targetValues);


if(Result == ""){// 액션이 제대로 수행되어지면 "" 을 리턴한다 ._MessageBox(" 수정되었습니다 .");


}



Delete// 삽입 삭제가 일어나게 되어지는 셋을 가져온다 .var dm = _GetDataManager().GetDataModule("TABLECRUD");dm.CleanUpQueuedActions();var ds = dm.GetDataSet("CUSTOMER");

//CRUD 를 위한 ACTION 객체를 생성해준다 .var DataAction = new Array();DataAction[0] = ds.MakeDefaultDataAction();// 빈액션객체를 만들어준다 .DataAction[0].DataActionType = DataActionTypeConst.Delete;// 인서트인지 업데이트인지 삭제 인지를 결정해준다 .

var rIdx = Table1.GetFocusRowIndex();// 클릭되어져 있는 행을 수정한다 .var targetNames = new Array(); var targetValues = new Array();targetNames[0] = "MENUID"; targetValues[0] = Table1.GetCellInPage(rIdx,0).Value;

DataAction[0].SetTargetNames(targetNames);DataAction[0].SetTargetValues(targetValues);


if(Result == ""){// 액션이 제대로 수행되어지면 "" 을 리턴한다 .dm.GetDataSet("CUSTOMER", null, true);// 테이블의 데이터를 다시 호출해준다 ._MessageBox(" 수정되었습니다 .");


}



(2). 테이블 그리드 입력 수정 삭제‘’ 의 경우 문자형에는 반드시 존재 해야 하며 숫자형일 경우 표기 하지 않습니다 .필드 파라메터 역시 ‘’을 사용하지 않습니다 . 해당 쿼리디자이너의 경우 쿼리문을 어플리케이션에서 만들어 쿼리디자이너에 전달해 주는 역할을 해줍니다 .

입력문 , 수정문 , 삭제문 – 쿼리자체가 어플에서 만들어 주기 때문에 행삽입 , 삭제 , 변경 쿼리창 중 하나만 입력이 되어 있어도 됩니다 . 다음 스크립트는 행 변경 쿼리에 넣도록 하겠습니다 .

ARG_SF1#



Insertif(This.Text == "Insert"){

Table1.InsertNewRow(0); This.Text = "OK";}else{

This.Text = "Insert"; var dbTable = "GridSample";// 삽입 삭제가 일어나게 되어지는 셋을 가져온다 .var dm = _GetDataManager().GetDataModule("TABLECRUD"); dm.CleanUpQueuedActions(); var ds = dm.GetDataSet("CUSTOMER");//CRUD 를 위한 ACTION 객체를 생성해준다 .var DataAction = new Array();DataAction[0] = ds.MakeDefaultDataAction();// 빈액션객체를 만들어준다 .DataAction[0].DataActionType = DataActionTypeConst.RowUpdate;// 인서트인지 업데이트인지 삭제 인지를 결정해준다 .var arrField = new Array(); var arrValue = new Array();arrField[0] = "MENUID"; arrValue[0] = Table1.GetCellInPage(0, 0).Text;arrField[1] = "REGION"; arrValue[1] = Table1.GetCellInPage(0, 1).Text;arrField[2] = "VALUE1"; arrValue[2] = Table1.GetCellInPage(0, 2).Text;arrField[3] = "VALUE2"; arrValue[3] = Table1.GetCellInPage(0, 3).Text;arrField[4] = "VALUE3"; arrValue[4] = Table1.GetCellInPage(0, 4).Text;

sql[0] += "INSERT INTO "+dbTable+" (";for(var j=0;j<arrField.length;j++){

sql[0] += arrField[j];if(j != arrField.length-1)

sql[0] +=", ";else

sql[0] += " ) VALUES(";}for(var j=0;j<arrValue.length;j++){

sql[0] += " '"+arrValue[j];if(j != arrValue.length-1)

sql[0] +="', ";else

sql[0] += "' )";}


actions[k].SetSourceNames(sql);actions[k].SetSourceValues(sql);

ds.QueueActionObjects(DataAction);var Result = dm.CommitQueuedActions();if(Result == "")

_MessageBox(" 추가되었습니다 .");else

_MessageBox(Result);}


Update// 삽입 삭제가 일어나게 되어지는 셋을 가져온다 .var dbTable = "GridSample";var dm = _GetDataManager().GetDataModule("TABLECRUD"); dm.CleanUpQueuedActions(); var ds = dm.GetDataSet("CUSTOMER");


var rIdx = Table1.GetFocusRowIndex();// 클릭되어져 있는 행을 수정한다 .var arrField = new Array(); var arrValue = new Array();arrField[0] = "MENUID"; arrValue[0] = Table1.GetCellInPage(rIdx, 0).Text;arrField[1] = "REGION"; arrValue[1] = Table1.GetCellInPage(rIdx, 1).Text;arrField[2] = "VALUE1"; arrValue[2] = Table1.GetCellInPage(rIdx, 2).Text;arrField[3] = "VALUE2"; arrValue[3] = Table1.GetCellInPage(rIdx, 3).Text;arrField[4] = "VALUE3"; arrValue[4] = Table1.GetCellInPage(rIdx, 4).Text;


// 쿼리를 구성해 준다 .sql[0] += "UPDATE "+dbTable+" SET ";for(var j=0;j<arrField.length;j++){

sql[0] += arrField [j]+"='"+arrValue[j];if(j != arrField.length-1){

sql[0] +="', ";}else{

sql[0] += "' ";}

}sql[0] += "WHERE "+"MenuId"+"='"+arrValue[0]+"'";DataAction[0].SetSourceNames(sql);// 필드를 설정해준다 .DataAction[0].SetSourceValues(sql);// 값을 설정해 준다 .


ds.QueueActionObjects(DataAction);var Result = dm.CommitQueuedActions();

if(Result == ""){_MessageBox(" 수정되었습니다 .");


}


Delete// 삽입 삭제가 일어나게 되어지는 셋을 가져온다 .var dbTable = "GridSample";var dm = _GetDataManager().GetDataModule("TABLECRUD"); dm.CleanUpQueuedActions(); var ds = dm.GetDataSet("CUSTOMER");


var rIdx = Table1.GetFocusRowIndex();// 클릭되어져 있는 행을 수정한다 .var arrField = new Array(); var arrValue = new Array();arrFiled[0] = "MenuId"; arrValue[0] = Table.GetCell(rIdx, 1).Text;// 쿼리를 구성해 준다 .sql[0] += "DELETE FROM "+dbTable+" WHERE ";for(var j=0;j<arrField.length;j++){

sql[0] += arrField[j]+"='"+arrValue[j];if(j != arrField.length-1){

sql[0] +="', ";}else{

sql[0] += "' ";}

}

actions[i].SetSourceNames(sql);actions[i].SetSourceValues(sql);ds.QueueActionObjects(DataAction);// 큐에 해당 액션을 만들어준다 .var Result = dm.CommitQueuedActions();// 디비에 커밋을 한다 .

if(Result == ""){// 액션이 제대로 수행되어지면 "" 을 리턴한다 .dm.GetDataSet("CUSTOMER", null, true);// 테이블의 데이터를 다시 호출해준다 ._MessageBox(" 수정되었습니다 .");


}


(3). 테이블 입력 수정 삭제 앞에서 만들어진 테이블의 ColumnEditable 을 모두 True 로 설정하여 사용자가 테이블을 수정 할 수 있게 해줍니다 . 위의 속성은 테이블 마법사에서 설정 하실 수 있습니다 .

테이블 마법사에서 #OZDeleteFlag# 를 선택해 준다 . 버튼을 하나 생성하여 InsertRow 라 텍스트를 넣으시고 해당 버튼의 OnClick이벤트에 Table1.InsertNewRow(0); 넣어줍니다 . 다시 버튼을 하나 더 생성하여 OnClick 이벤트에 다음 스크립트를 넣어줍니다 .

_GetDataManager().GetDataModule(“ 모듈명 ").CleanUpQueuedActions();var result = Table1.CommitQueuedActions();if(result == ""){

_MessageBox(" 데이터가 저장되었습니다 .\n[ 입력 / 수정 / 삭제 ]");} else {

_MessageBox(result);}

5-9. 테이블 DATAACTION5. OZ Application 주요 컴포넌트

(1). 테이블 입력 수정 삭제 해당 스크립트를 사용할 경우 저장 수정 삭제를 전부 컨트롤 할 수 있으며 DeleteFlag 필드를 체크하고 저장을 누르게 되면 삭제가 되어지며 수정을 한 값이 있다면 테이블이 자동으로 인식하여 그 행을 수정 해주고 InsertNewRow 로 삽입되어진 행은 입력으로 인식하게 됩니다 .

5-9. 테이블 DATAACTION5. OZ Application 주요 컴포넌트

5-9. 테이블 DATAACTION

(2). 테이블 입력 수정 삭제값 변경위의 (1) 번 처럼 하게 될 경우는 단순히 테이블의 수정 삭제 입력기능을 동시에 구현 하실때 쓰실 수가 있는데 만약 테이블에 컴보박스가 삽입되어져 있다던가 기본 테이블 값들이 넘어가는 것이 아니라 값을 변경하여 넣어야 할 경우 혹은 입력 수정 삭제를 따로 구현할 경우 스크립트를 사용하셔야 합니다 .

또한 이것 역시 쿼리디자이너의 행 삽입 삭제 수정 쿼리 창에 쿼리문이 입력되어야 한다 .


5-9. 테이블 DATAACTION

(4). 테이블 입력 수정 삭제값 변경Table1.GetDataModule().CleanUpQueuedActions();// 큐를 비워준다 .var actionCount = 0;// 액션 개수를 가져온다 .var actions = new Array();actionCount += Table1.MakeActions(actions);// 저장 수정 삭제에가 일어난 것의 총 카운트를 가져온다 ._T(actions.length, actionCount);// 액션일 일어난 개수를 가져옵니다 .if(actionCount < 1) {return};// 액션이 없다면 아무것도하지않습니다 .for(var index = 0; index < actions.length; index++){// 액션이 일어날 값들을 변경해 줄 수 있습니다 .

var action_type = actions[index].DataActionType;var src_values = new Array();var target_values = new Array();actions[index].GetSourceValues(src_values);// 액션에 있는 값들을 가져와 배열에 넣어준다 .actionIndex = actions[index].DataSetIndex;// 액션이 일어난 행을 알 수 있다 .

if(action_type == DataActionTypeConst.Insert){}else if(action_type == DataActionTypeConst.RowUpdate){

for(var i=0;i<src_values.length;i++){ _TRACELN("src_values["+i+"]="+src_values[i]); }for(var i=0;i<target_values.length;i++){ _TRACELN("target_values["+i+"]="+target_values[i]); }

}else if(action_type == DataActionTypeConst.Delete){}actions[index].SetSourceValues(src_values);// 값을 재설정해 준다 .

}_BeginWaitCursor();// 커서를 모래시계로 변경 해준다 .var datamodule = Table1.GetDataModule();datamodule.QueueActionObjects(actions);// 액션을 큐에 담는다 .var result = datamodule.CommitQueuedActions();// 커밋을 한다 .if(result == ""){ _MessageBox(" 데이터가 저장되었습니다 .\n[ 입력 / 수정 / 삭제 ]");}else{ _MessageBox(result); }_EndWaitCursor();// 커서를 디폴트로 변경 해준다 .


5-10. 라벨라벨의 속성을 이용하여 다양한 모습을 나타내줄 수 있습니다 .


5-11. 픽쳐 박스

픽쳐 박스의 속성을 이용하여 다양한 모습을 나타내줄 수 있습니다 .


5-12. 텍스트 박스텍스트 박스의 속성을 이용하여 다양한 모습을 나타내줄 수 있습니다 .


5-13. 버튼

마우스가 버튼위에 올라가면 HoverImage 로 변경되어 집니다 .


5-14. 체크박스 , 라디오 버튼체크박스와 라디오 버튼의 경우 Checked 라는 함수를 사용하여 해당 기능을 수행 하실 수 있습니다 .

Ex)If(CheckBox1.Checked){

_TRACELN(" 체크 되었습니다 .");}else{

_TRACELN(" 체크 되지 않았습니다 .");}

Ex)If(RadioButton1.Checked){

_TRACELN(" 체크 되었습니다 .");}else{

_TRACELN(" 체크 되지 않았습니다 .");}


5-15. 리스트박스 , 체크리스트박스리스트 박스와 체크리스트 박스의 경우 아래 처럼 Value 와 ItemValue 값을 가져 오실 수 있습니다 .for(var index = 0; index < ListBox1.GetItemCount() ; index++){

var obj = ListBox1.GetItemObject(index);_TRACELN( "Text: " + obj.Text);_TRACELN( "ItemValue: " + obj.ItemValue);

}

리스트 박스와 체크리스트 박스에 아이템을 추가해 주는 함수 입니다 .var itemObj1 = CheckListBox1.AddItem("test");itemObj1.ItemValue = "testItem";

리스트 박스와 체크리스트 박스에 아이템을 삭제해 주는 함수 입니다 .CheckListBox1.RemoveItem(index);


소수점 이하 자리수 (DecimalPlaces) : 016 진수 표현 여부 (Hexadecimal) : False증감하는 값 (Increment) : 1키보드 위 , 아래 방향키로 값 변경 허용 (InterceptArrowKeys) : True최대값 (MaxVal) : 1000000최소값 (MinVal) : 0직접입력 허용안함 (ReadOnly) : False천단위 콤마 구분 (ThousandSeparator) : True버튼 위치 - 스핀이라고함 (UpDownAlign) : Right

5-16. 뉴머릭업다운


5-17. 마스크 텍스트 박스아래의 속성 설정을 사용하여 마스크 텍스트 박스를 이용하 실 수 있습니다 .Mask : 기본적인 마스크 텍스트 박스의 텍스트 모양을 설정해 줍니다 .Literal : 마스크 텍스트 박스에 리터럴을 설정하여 프롬프트 문자와 구분자를 사용하여 입력할 위치와 구분자를 설정합니다 .PromptChar : 주의 하셔야 할 점은 리터럴과 같은 문자이어야 글자가 입력되어 집니다 .


5-18. 리치 텍스트 박스

텍스트 박스와 유사한 기능을 지원하며 차이점으로 글씨 모양을 변경 해 주실 수 있습니다 . 아래 스크립트의 경우 특정 문자의 색상을 변경해 주는 예제 입니다 .// " 개발 " 이 포함된 인덱스를 찾아 옴 .var rich = RichTextBox1;// 리치 텍스트 박스 컴포넌트 입니다 .var str = rich.Text;// 찾을 원본이 되어지는 텍스트var findText = " 개발 ";// 변경되어질 글자 입니다 .var length = str.length;var findLeng = findText.length;var startIdx = 0;while(true){

var index = rich.FindText(findText, startIdx, length, false, false, true);_T("index = "+index);if(index == -1)

break;var char = rich.GetSelectCharFormat(index, index+ findText.length);

// 해당 인덱스의 문자 포맷을 설정함 .char.TextColor ="0, 0, 255";char.Size =300;char.FontName = "궁서 ";char.UnderlineEffect = true;

// 설정한 문자 포맷으로 변경함 .rich.SetSelectCharFormat(char, index, index+findText.length);startIdx = index+findLeng;

}


5-19. 데이터 타임 피커

5. OZ Application 주요 컴포넌트날짜 컴포넌트로서 달력을 표현해 줄 수 있습니다 .

Format 속성을 Custom 으로 설정하고 CustomFormat 속성의 설정값을 yyyy/MM/dd 이러한 식으로 변경을 하게 되면 형식이 변경되어 집니다 .데이트 타임 피커에 설정하는 yyyyMMdd 등의 도움말을 보시려면 getdateTime 함수의 도움말을 보시면 됩니다 .

값을 가져오는 스크립트 입니다 .var date = DateTimePicker1.ValueDate;_TRACELN(" 날짜 = "+date);

5-19. 데이터 타임 피커

5. OZ Application 주요 컴포넌트데이터 타임 피커의 날짜 사이의 간격을 구하는 방법 입니다 .

var fDate = DateTimePicker1.GetCurDateTime();var lDate = DateTimePicker2.GetCurDateTime();var cur = lDate.Minus(fDate);_TRACELN("cur = "+cur.GetDays());

Span 객체를 사용하여 하루 전 날짜를 구하는 방법 입니다 .var fDate = DateTimePicker1.GetCurDateTime();var lDate = DateTimePicker2.GetCurDateTime();var span = _GetDateTimeSpan(1,0,0,0);fDate.Minus(span);lDate.Minus(span);_TRACELN(" 시작 날짜의 하루전 ="+fDate.GetDate());_TRACELN(" 마지막 날짜의 하루전 ="+lDate.GetDate());

5-20. 켈린더

5. OZ Application 주요 컴포넌트날짜 컴포넌트로서 달력을 표현해 줄 수 있습니다 .

MaxSelectionCount 라는 속성을 이용하여 최대 선택할 수 있는 날짜를 제어 하실 수 있습니다 .

자신이 선택되어진 값을 가져오는 스크립트 입니다 .var EndDate = MonthCalendar1.GetCurSelDateEnd();_TRACELN("EndDate = "+EndDate.GetDateTime("yyyy/MM/dd"));

5-21. 수평 , 수직 네비게이션

5. OZ Application 주요 컴포넌트테이블 컴포넌트의 페이지 넘김 기능을 제어해 주는 컴포넌트 입니다 .

테이블에 대한 페이지 넘기기를 위해 HNavigator 컴포넌트를 이용합니다 .이용방법은 HNavigator 의 LinkComponentName 속성에 테이블이름을 지정합니다 .테이블 속성에서는 RowAutoSize 속성을 FixHeight, FixCount, FixCountAuto 중에서 지정합니다 .FixCount 를 지정한 경우에는 RowCount 로 테이블에 보여줄 레코드수를 지정합니다 .

5-21. 수평 , 수직 네비게이션


테이블에 대한 페이지 넘기기를 위해 VNavigator 컴포넌트를 이용합니다 .이용방법은 VNavigator 의 LinkComponentName 속성에 테이블이름을 지정합니다 .테이블 속성에서는 RowAutoSize 속성을 FixHeight, FixCount, FixCountAuto 중에서 지정합니다 .FixCount 를 지정한 경우에는 RowCount 로 테이블에 보여줄 레코드수를 지정합니다 .

5-22. 탭컨트롤

5. OZ Application 주요 컴포넌트여러 항목을 하나의 컴포넌트에서 탭형태로 보여 주실 수 있습니다 .

더블클릭

5-22. 탭컨트롤

5. OZ Application 주요 컴포넌트TabAlignment 의 속성을 선택하여 탭의 타이틀 위치를 변경하실 수 있습니다 .

Multiline 의 속성을 선택하여 탭 타이틀을 여러줄로 표현 하실 수 있습니다 .

5-23. 타이머 (Timer)5. OZ Application 주요 컴포넌트

시간의 흐름에 따라 주기적인 이벤트 실행을 일으킬 수 있습니다 . Invisible 트리창에 해당 컴포넌트가 생성되어지는 것을 확인 하실 수 있습니다 .

1/1000 초 이며 즉 1 초 간격으로 타이머객체의 OnTimer 이벤트를 실행 시켜 줍니다 .

시작과 정지 두개의 버튼을 만들어 주고 그 아래에 라벨을 그려줍니다 .

시작 버튼의 OnClick 이벤트에 해당 스크립트를 적어 줍니다 .var timer = _GetInvisible("Timer1");timer.Start();정지 버튼의 OnClick 이벤트에 해당 스크립트를 적어 줍니다 .var timer = _GetInvisible("Timer1");timer.Stop();Timer 객체의 OnTimer 이벤트에 해당 스크립트를 적어줍니다 .var label = _GetBoard("Board1").GetChild("Label1");label.Width += 10;미리보기를 하여 확인을 해 줍니다 .

5-24. 프로그레스바

5. OZ Application 주요 컴포넌트화면의 해당 프로세스의 진행 사항을 체크해 주는 컴포넌트 입니다 .타이머 인비지블 컴포넌트와 같이 사용되어지는 컴포넌트 입니다 .Timer 객체를 하나 생성해 줍니다 .시작버튼에 다음 스크립트를 넣어줍니다 ._GetInvisible("Timer1").Start();정지버튼에 다음 스크립트를 넣어줍니다 ._GetInvisible("Timer1").Stop();위치확인 버튼에 다음 스크립트를 넣어줍니다 ._MessageBox(" 현재 바의 위치 : " + ProgressBar1.Value);10 증가 버튼에 다음 스크립트를 넣어줍니다 .ProgressBar1.OffsetPos(10); // 현재 위치에서 10 증가 시킴ProgressBar1.Text = ProgressBar1.Pos;Timer 객체의 OnTimer 이벤트에 다음 스크립트를 넣어줍니다 .var ProgressBar1 = _GetBoard("Board1").GetChild("ProgressBar1");if( !ProgressBar1.IsFullPos() ) { // 바의 위치가 최대값인지 확인

ProgressBar1.StepIt(); // 바의 위치를 Step 크기만큼 증가} else {

ProgressBar1.Pos = ProgressBar1.Minimum; // 바의 위치를 최소위치로 설정}ProgressBar1.Text = ProgressBar1.Pos;

5-25. 툴팁 (ToolTip)

5. OZ Application 주요 컴포넌트컴포넌트에 마우스가 올라가게 되면 작은 창으로 텍스트가 보이는 기능을 해 줍니다 .라벨을 하나 생성해 주고 툴팁을 하나 생성해 줍니다 . 툴팁의 경우 Invisible 트리창에 생성이 되는 것을 확인 하실 수 있습니다 .

라벨의 속성중 ToolTip 속성에 해당 만들어진 툴팁 객체를 선택해 줍니다 .

Board1 의 OnPostInitialize 이벤트에 해당 스크립트를 적어 줍니다 .Label1.ToolTipText = Label1.Text;// 라벨의 텍스트는 2 줄로 작성해 줍니다 .기본적으로 툴팁은 1 줄을 표현해 주게 되어 있습니다 .

툴팁의 MaxTipWidth 를 대략적으로 200 으로 수정해 줍니다 .

5-26. 컨텍스트메뉴 (ConTextMenu)

5. OZ Application 주요 컴포넌트컴포넌트에서 마우스 우측 키를 클릭하여 액션을 취할 수 있는 기능입니다 .컨텍스트 메뉴를 하나 생성해 줍니다 . 해당 컨텍스트메뉴를 클릭 후 마우스 우측키로 마법사를 선택해 줍니다 .

탭을 이용하여 하위단 메뉴를 만드실 수 있으며 해당 아이템 선택후 IsSeparator 속성을 true 로 주시면 구분선을 주어주실 수 있습니다 .

5-26. 컨텍스트메뉴 (ConTextMenu)

5. OZ Application 주요 컴포넌트컨텍스트 메뉴의 가장 하위단 아이템을 클릭시 OnCommand 이벤트가 실행이 되어 집니다 . 해당 컨텍스트 메뉴의 OnCommand 이벤트에 다음 스크립트를 넣어 줍니다 ._TRACELN(" 컨텍스트 메뉴 실행 입니다 .");라벨을 하나 생성을 해줍니다 .라벨의 ConTextMenu 속성에 해당 컨텍스트 메뉴를 연결해 줍니다 .

실행하여 마우스를 라벨위에서 우측키를 눌러 컨텍스트 메뉴를 실행해 줍니다 .컨텍스트 메뉴의 가장 하위단을 클릭하여 트레이스가 제대로 실행되어 지는지 확인 해 줍니다 .

5-27. 메인메뉴 (MainMenu)

5. OZ Application 주요 컴포넌트보드의 최상단에 메뉴 구성을 해 주는 인비지블 컴포넌트 입니다 . 메인메뉴를 하나 생성해 줍니다 .

탭을 이용하여 하위단 메뉴를 만드실 수 있으며 해당 아이템 선택후 IsSeparator 속성을 true 로 주시면 구분선을 주어주실 수 있습니다 .

5-27. 메인메뉴 (MainMenu)

5. OZ Application 주요 컴포넌트메인 메뉴의 경우 보드에만 설정을 해주 실 수 있습니다 .메인 메뉴의 가장 하위단 아이템을 클릭시 OnCommand 이벤트가 실행이 되어 집니다 . 해당 컨텍스트 메뉴의 OnCommand 이벤트에 다음 스크립트를 넣어 줍니다 ._TRACELN(“ 메인 메뉴 실행 입니다 .");보드의 MainMenu 속성에 해당 메인 메뉴를 연결해 줍니다 .

메인 메뉴의 가장 하위단을 클릭하여 트레이스가 제대로 실행되어 지는지 확인 해 줍니다 .

5-28. 이미지 리스트 (ImageList)

5. OZ Application 주요 컴포넌트리스트 형태로 이어져 있는 이미지를 특정 크기로 동일하게 분할 하여 해당 이미지 마다 인덱스를 부여하여 인덱스를 이용하여 사용할 수 있는 인비지블 컴포넌트 입니다 . 해당 컴포넌트의 경우 주로 트리뷰에 그 기능이 많이 사용되어 집니다 .이미지 리스트 컴포넌트를 하나 생성 합니다 .이미지 리스트의 속성 중 ImageListUrl 로 이미지 경로를 잡아주고ImageSize 로 해당 컴포넌트를 가로 세로 몇으로 분할 할 지 결정 해 줍니다 .

해당 이미지를 연결해 주고 size 를 20,17 로 지정해 주게 되어지면 차레대로 이미지리스트가 생성이 되어 집니다 .

5-29. 트리뷰

5. OZ Application 주요 컴포넌트트리 모양의 UI 를 구성해 줍니다 . 트리뷰를 하나 생성해 준 후 마우스 우측 키를 클릭하여 마법사를 선택해 줍니다 .

탭을 이용하여 하위단 메뉴를 만드실 수 있습니다 .

트리뷰의 ItemHeight 속성을 이용하여 줄 간격을 변경 시켜줄 수 있습니다 .트리뷰의 HotTracking 속성을 이용하여 마우스의 이동에 따른 노드의 변화를 주 실 수 있습니다 .

5-29. 트리뷰

5. OZ Application 주요 컴포넌트해당 스크립트들을 사용하여 트리뷰의 노드를 추가 하실 수 있습니다 .object AddRootString// 인자 값에 대한 설명 입니다 .( string Text, [ string NodeID ], [ integer ImageIndex ], [ integer SelectedImageIndex ])var RootNode = TreeView1.AddRootString("Text3", "NodeID_2", 1, 2);

object AddNodeString// 인자값에 대한 설명 입니다 .( string Text, [ string NodeID ], [ integer ImageIndex ], [ integer SelectedImageIndex ])var NewTreeNode = TreeNode.AddNodeString("Text3", " NodeID_2", 1, 2);

5-30. 크로스탭

5. OZ Application 주요 컴포넌트크로스탭의 경우 좌측에 타이틀을 주며 상단에도 타이틀을 주어 가운데에 값을 표현 하는 모양의 화면을 디자인 할 때 사용 할 수 있는 컴포넌트 입니다 . 기존에 생성한 ODI 를 이용하여 크로스탭을 만들도록 하겠습니다 . 기존에 만들어진 ODI 를 임포트 해 준 후 크로스탭을 화면에 그려줍니다 . 자신이 그리고자 하는 셋을 마우스 드래그로 크로스탭에 연결해 줍니다 .

마우스로 드래그해 줍니다 .

5-30. 크로스탭

5. OZ Application 주요 컴포넌트크로스탭을 더블클릭하여 해당 표현하고자 하는 필드들을 연결해 줍니다 .

크로스탭의 피봇을 하기 위해서는 크로스탭 마법사 -> 옵션 -> 공통 -> 피봇하기를 체크해 줍니다 .

5-31. 차트5. OZ Application 주요 컴포넌트

차트의 경우 그래프 화면을 디자인 할 때 사용 할 수 있는 컴포넌트 입니다 . 기존에 생성한 ODI 를 이용하여 차트를 만들도록 하겠습니다 . 기존에 만들어진 ODI 를 임포트 해 준 후 차트를 화면에 그려줍니다 . 자신이 그리고자 하는 셋을 마우스 드래그로 차트에 연결해 줍니다 .

마우스로 드래그해 줍니다 .


차트를 더블클릭하여 차트 마법사를 실행 시켜 줍니다 . 자신이 원하는 차트 타입을 선택 한 후에 데이터 탭을 클릭해 줍니다 ..

데이터 탭에서 x축과 y축을 결정해 줍니다 . Y축의 경우는 Integer 값이 들어가야 합니다 . 계열의 경우 그룹화 해서 표현을 하려 할 때 필드를 연결 시켜 주시면 됩니다 .

X축 Y축 Z축 각각 자신이 변경하고자 하는 값을 변경해 줍니다 . 주로 축의 제어와 라벨의 제어를 하 실 수 있습니다 .


Y 축의 고급탭에서 원점에 직접 숫자를 입력하게 되면 기준선을 그리실 수 있습니다 .

5-31. 차트5. OZ Application 주요 컴포넌트범례 탭의 경우 범례의 모양과 그 위치를 변경해 주실 수 있습니다 . 기타 패턴적용 체크박스를 체크하여 마크 , 면 , 선 패턴을 주 실 수 있습니다 .


데이터 라벨 탭의 경우 툴팁보기를 체크 하게 되면 마우스가 해당 교차점에 올라갔을 때 툴팁을 표시하게 됩니다 .툴팁을 보이기 위한 사전 작업으로 툴팁을 하나 생성한 다음 차트의 속성에 ToolTip 을 지정해 주셔야 합니다 .

데이터 라벨 탭의 경우 해당 교차점에 대한 데이터 수를 표시 할 수 있으며 툴팁을 적용 하실수 있습니다 . 툴팁의 적용시 반드시 차트의 ToolTip 속성에 ToolTip 이 지정되어 있어야 합니다 .

5-32. 리포트 컨트롤5. OZ Application 주요 컴포넌트

어플리케이션에서 리포트를 호출하여 사용자에게 제공해주는 컴포넌트 입니다 .어플리케이션에서 리포트를 호출 하기 위해서는 기존에 리포트 디자이너로 개발되어진 ozr 파일이 존재 하여야 하며 사용자 PC 에 리포트 디자이너 뷰어가 있어야 합니다 .

1. 간단한 리포트를 만들어 보겠습니다 . 시작 -> 모든 프로그램 ->FORCS->OZ Reporting Tool 4.0 을 실행 시키고 새 파일을 생성 합니다 . 기존에 만들어진 ODI 를 연결 합니다 .


2. 간단한 타이틀과 테이블을 만들어 보겠습니다 . 해당 아이콘을 클릭 후 리포트 페이지에 드래그 하여 그려줍니다 . 해당 타이틀 밴드에 라벨을 하나 올려줍니다 .


3. 데이터 밴드를 그리고 그 위에 테이블을 그려줍니다 .리포트를 저장해 줍니다 .

5-32. 리포트 컨트롤 5. OZ Application 주요 컴포넌트

어플리케이션을 실행 시켜 줍니다 .어플리케이션에서 버튼을 하나 생성하고 리포트 컨트롤을 화면에 그려줍니다 .컴보박스에 들어가야 할 데이터 셋을 연동시켜 실행을 해 봅니다 .


버튼의 OnClick 이벤트에 해당 스크립트를 넣어주고 실행 후 버튼을 클릭해 줍니다 .

//Parameter 초기화ReportControl1.InitUserParameter();

// 표시할 Report 파일 지정ReportControl1.ReportViewerURL = "ozp:/// 교육 /ozr/test.ozr";

//ODI Parameter 설정ReportControl1.AddReportParameter("odi.odinames","sample1");ReportControl1.AddReportParameter("odi.sample1.pcount","2");ReportControl1.AddReportParameter("odi.sample1.args1","param1=" + ComboBox1.Value);ReportControl1.AddReportParameter("odi.sample1.args2","param2=" + ComboBox2.Value);

//////////////////////////////////////////////////////////////////////////// 추가 파라메터 예제ReportControl1.AddReportParameter("information.debug","true");ReportControl1.ApplyReport(true);

5-33. 리포트 버튼 5. OZ Application 주요 컴포넌트

리포트 컨트롤과 같이 리포트를 출력하게 해주는 컴포넌트 입니다 . 차이점은 미리보기 없이 바로 프린트 화면을 호출 하실 수 있습니다 . 사용 스크립트의 경우 리포트 컨트롤과 동일 합니다 .

//Parameter 초기화ReportControl1.InitUserParameter();

// 표시할 Report 파일 지정ReportControl1.ReportViewerURL = "ozp:/// 교육 /ozr/test.ozr";

//ODI Parameter 설정ReportControl1.AddReportParameter("odi.odinames","sample1");ReportControl1.AddReportParameter("odi.sample1.pcount","2");ReportControl1.AddReportParameter("odi.sample1.args1","param1=" + ComboBox1.Value);ReportControl1.AddReportParameter("odi.sample1.args2","param2=" + ComboBox2.Value);

//////////////////////////////////////////////////////////////////////////// 추가 파라메터 예제ReportControl1.AddReportParameter("information.debug","true");ReportControl1.ApplyReport(true);

5-34. Html 뷰 5. OZ Application 주요 컴포넌트

인터넷 브라우저를 오즈 화면에 보여주는 역할을 해줍니다 .var webObject = HtmlView1.GetWebBrowser();webObject.GoHome();// 인터넷 도구에 설정되어진 시작페이지로 이동 합니다 .webObject.GoBack();// 뒤로 이동합니다 .webObject.GoForward();// 앞으로 이동합니다 .webObject.Stop();// 중지합니다 .webObject.Refresh();// 새로고침합니다 .webObject.GoSearch();// 주소 페이지를 찾습니다 .

Chapter 06

OZ Application Tip

6-1 Export6-2 Pattern6-3 Event Hook6-4 SetEvent6-5 FileSystemObject6-6 Dictionary6-7 FXDataSet6-8 OZ Application Global Function

6-1. Export(Excel)

6. OZ Application Tip

var Grid = Table1;//<--엑셀이 저장될 컴포넌트 입니다 . 테이블 그리드사용 .var str = "file";//<-- 저장될 파일명입니다 .

saveExcell(Grid, str);function saveExcell(Grid,str){

var arg = FileDialogOptionsConst.OverWritePrompt;var arg2 = "EXCEL Files(*.xls)|*.xls|";var file = _FileDialog(false, "*.xls", str + ".xls" ,arg, arg2);if(file == "")

return;Grid.SelectCellRange(-1,-1,-1,-1);Grid.SaveExcelToFilePathInRange(file);

}

6-2. 패턴패턴 속성을 이용하여 다양한 모습을 나타내줄 수 있습니다 .


6-3. Event Hook6. OZ Application Tip

아래 이미지와 같이 버튼 컴포넌트를 2 개 그리고 PostEventHook 의 OnClick 이벤트에 해당 트레이스 스크립트를 적어 넣습니다 . 미리보기 실행 후 어떠한 컴포넌트를 클릭하여도 PostEventHook 의 OnClick 이벤트가 실행 되어 지는 것을 보실 수 있습니다 .이벤트 훅은 컴포넌트들의 특정 이벤트를 전부 실행 시켜주는 역할을 해 줍니다 .

6-4. SetEvent


SetEvent 의 경우 이벤트에 이벤트를 실행 시켜주는 함수 입니다 . 특정 이벤트 실행시에 다른 이벤트를 걸어 놓을 수가 있습니다 . SetEvent 에서 함수를 호출해 줄 경우 특정 함수를 ozf 혹은 GlobalFunction 이벤트에 함수를 설정해 놓으면 설정되어진 이벤트에서 해당 함수를 호출해 줄 수 있습니다 .

버튼을 하나 생성 후에 보드의 OnPostInitialize 이벤트에 다음 스크립트를 넣어줍니다 .var strEvent = "btn();";Button1.SetEvent(EventNameConst.OnClick, strEvent);

Document 의 GlobalFunction 이벤트에 해당 스크립트를 넣어줍니다 .function btn(){

_TRACELN("Button Click....");}

미리보기를 하여 버튼을 클릭해 줍니다 .

6-5. FileSystemObject


다양한 파일관련 제어 javascript 입니다 .

아래 코드는 FileSystemObject 를 사용하여 읽거나 쓸 수 있는 TextStream 개체를 반환하는 방법을 보여줍니다 . // 텍스트 만들기var fso = new ActiveXObject("Scripting.FileSystemObject"); var a = fso.CreateTextFile("c:\\testfile.txt", true); a.WriteLine(" 테스트입니다 ."); a.Close();

// 텍스트 파일 삭제 하기var fso = new ActiveXObject("Scripting.FileSystemObject"); fso.DeleteFile(" 파일 경로 ");

위의 예제 이외에도 다향한 파일 관련 제어를 하실 수 있습니다 .BuildPath 메서드 | CopyFile 메서드 | CopyFolder 메서드 | CreateFolder 메서드 | CreateTextFile 메서드 | DeleteFile 메서드 | DeleteFolder 메서드 | DriveExists 메서드 | FileExists 메서드 | FolderExists 메서드 | GetAbsolutePathName 메서드 | GetBaseName 메서드 | GetDrive 메서드 | GetDriveName 메서드 | GetExtensionName 메서드 | GetFile 메서드 | GetFileName 메서드 | GetFolder 메서드 | GetParentFolderName 메서드 | GetSpecialFolder 메서드 | GetTempName 메서드 | MoveFile 메서드 | MoveFolder 메서드 | OpenTextFile 메서드

mk:@MSITStore:C:%5CProgram%20Files%5CMicrosoft%20Windows%20Script%5CJSdocs%5CJS55.CHM::/html/jsmthbuildpath.htm



mk:@MSITStore:C:%5CProgram%20Files%5CMicrosoft%20Windows%20Script%5CJSdocs%5CJS55.CHM::/html/jsmthcopyfile.htm



mk:@MSITStore:C:%5CProgram%20Files%5CMicrosoft%20Windows%20Script%5CJSdocs%5CJS55.CHM::/html/jsmthcopyfolder.htm



mk:@MSITStore:C:%5CProgram%20Files%5CMicrosoft%20Windows%20Script%5CJSdocs%5CJS55.CHM::/html/jsmthcreatefolder.htm



mk:@MSITStore:C:%5CProgram%20Files%5CMicrosoft%20Windows%20Script%5CJSdocs%5CJS55.CHM::/html/jsmthcreatetextfile.htm



mk:@MSITStore:C:%5CProgram%20Files%5CMicrosoft%20Windows%20Script%5CJSdocs%5CJS55.CHM::/html/jsmthdeletefile.htm



mk:@MSITStore:C:%5CProgram%20Files%5CMicrosoft%20Windows%20Script%5CJSdocs%5CJS55.CHM::/html/jsmthdeletefolder.htm



mk:@MSITStore:C:%5CProgram%20Files%5CMicrosoft%20Windows%20Script%5CJSdocs%5CJS55.CHM::/html/jsmthdriveexists.htm



6-6. Dictionary 객체6. OZ Application Tip

일반적으로 DB 의 경우 Table 을 해쉬 테이블을 사용하여 코드값을 이용한 index 로 필요한 값을 가져올 수가 있습니다 . 이와 같은 역할을 하는 것으로서 코드 값으로 해당 필요로 하는 값들을 다이렉트로 가져다 사용을 하실 수 있습니다 .

아래처럼 Dictionary 객체를 선언 후에 사용하실 수 있습니다 .var dicRow = new ActiveXObject("Scripting.Dictionary");dicRow.Add("grididx", 0);//key 값과 value 값이 세팅됩니다 .dicRow.Add("griddomnName", 1);

해당 key 값을 이용한 Value 값 가져오기dicRow.Item(" grididx ");

해당 Dictionary 객체의 키값을 가져오기var dicKeyRow = (new VBArray(dicRow.Keys())); // 키를 가져옵니다 . var fieldRow = dicKeyRow.getItem(1);

6-7. FXDataSet


자신이 원하는 가상 셋을 만드실 수 있습니다 .만들어 주어야 하는 셋의 형태는 다음과 같습니다 .

<?xml version = "1.0" encoding="euc-kr"?><OZDATA><OZPARAMS/><OZDATASETINFOS><DATASETINFO NAME="set1" MASTERSET=""><FIELDINFO><FIELD NAME="field1" TYPE="VARCHAR"/><FIELD NAME="field2" TYPE="VARCHAR"/><FIELD NAME="field3" TYPE="VARCHAR"/></FIELDINFO></DATASETINFO></OZDATASETINFOS><OZDATARESULT><OZDATASET NAME="set1"><RECORD><COL NAME="field1">aaa</COL><COL NAME="field2">bbb</COL><COL NAME="field3">ccc</COL></RECORD><RECORD><COL NAME="field1">aa</COL><COL NAME="field2">bb</COL><COL NAME="field3">cc</COL></RECORD></OZDATASET></OZDATARESULT></OZDATA>

6. OZ Application Tip6-7. FXDataSet

단순히 스트링으로 만든후 함수를 하나 호출하여 만드는 형식으로 사용하실 수 있습니다 .

호출부

var content = "aaa;bbb;ccc\n";content += "aa;bb;cc\n";var dsName = "set1";var fieldName = "field1;field2;field3";var fieldType = "VARCHAR;VARCHAR;VARCHAR";drawXml(content, dsName, fieldName, fieldType);

6. OZ Application Tip6-7. FXDataSet

함수function drawXml(content, dsName, fieldName, fieldType){

var arrName = fieldName.split(";");var arrType = fieldType.split(";");var arrContent = content.split("\n");var xml = "<?xml version = \"1.0\" encoding=\"euc-kr\"?>\n";xml += "<OZDATA>\n";xml += "<OZPARAMS/>\n";xml += "<OZDATASETINFOS>\n";xml += "<DATASETINFO NAME=\""+dsName+"\" MASTERSET=\"\">\n";xml += "<FIELDINFO>\n";for(var j=0;j<arrName.length;j++){

xml += "<FIELD NAME=\""+arrName[j]+"\" TYPE=\""+arrType[j]+"\"/>\n";}xml += "</FIELDINFO>\n";xml += "</DATASETINFO>\n";xml += "</OZDATASETINFOS>\n";xml += "<OZDATARESULT>\n";xml += "<OZDATASET NAME=\""+dsName+"\">\n";var record = "";for(var i=0;i<arrContent.length;i++){

record = arrContent[i].split(";");if(record.length == 1)continue;

xml += "<RECORD>\n";for(var j=0;j<record.length;j++){

xml += "<COL NAME=\""+arrName[j]+"\">"+record[j]+"</COL>\n";}xml += "</RECORD>\n";

}xml += "</OZDATASET>\n";xml += "</OZDATARESULT>\n";xml += "</OZDATA>\n";var fxdm = _GetFXDataModule();var dsCount = -1;if (xml != "") {

var xmlDoc = new ActiveXObject("Msxml.DOMDocument");xmlDoc.loadXML(xml);dsCount = fxdm.ApplyData(xmlDoc);

}var fxSet = fxdm.GetFXDataSet(dsName);return fxSet;

}

6-8. Global Function6. OZ Application Tip

주로 사용 되어지는 다양한 Global 전역 함수들 입니다 .디자이너 상에서 F1 키를 누룬후 목차부분에서 Component->Document->Method 부분을 보셔야 합니다 .

목차부분에서 GeneralScript->Global->Method 부분을 보셔야 합니다 .

6-8. 실습6. OZ Application Tip

실습1. GridSample 을 이용한 조건을 Region 으로 하여 검색 되게 테이블을 만듭니다 .2. 입력 , 수정 , 삭제 가 가능하게 합니다 . 입력은 맨 위에 한 줄 추가 하여

입력을 하고 수정과 삭제의 경우 사용자가 선택한 행이 삭제가 되게 하면 됩니다 .

3. 조회 버튼을 누르게 되면 테이블의 값이 조회가 되고 바로 그 아래에 리포트 컨트롤을 만들어 리포트가 조회되게 합니다 .

4. 버튼에 커서가 올라가면 마우스가 손 모양으로 변경 되어져야 합니다 .5. 테이블은 초기에 바인딩 되면 안되고 인디케이터를 보이지 않게 만듭니다 .

Chapter 07

OZ Server

7-1 Properties Files7-1-1 db.propertie

s7-1-2 log.properti

es7-1-3 repository.p

roperties7-2 lecense7-3 Viewer 호출 태그7-4 Html 연동

7-1. Properties Files7. OZ Server

7-1-1. db.propertiesapOra.vendor=oracleapOra.serverAddress=127.0.0.1apOra.portNo=1521apOra.sid=oracleapOra.user=oraUserapOra.password=oraPassapOra.maxconns=20apOra.initconns=5apOra.timeout=5

ap.vendor=ODBCap.dsn=apap.user=ap.password=ap.maxconns=20ap.initconns=5ap.timeout=5ap.initSqls=ap.closeSqls=

Alias 로서 고유 해야 합니다 .


7-1-2. log.propertiesROLLING_FILE.Type=RollingFileROLLING_FILE.Layout=%d{ISO8601} [%t] %-5p %c{1} %x - %m%nROLLING_FILE.File=%OZ_HOME%/logs/server_oz.logROLLING_FILE.Append=trueROLLING_FILE.MaxBackupIndex=5ROLLING_FILE.MaxFileSize=1MBROLLING_FILE.ImmediateFlush=true

해당 경로에 로그가 server.log 라 쌓입니다 .

로그가 쌓이는 최대 개수 입니다 .하나의 로그 파일의 Size 입니다 .

Server.log 로 파일이 쌓이다 최대 Size 가 되면 Server.log->Server.log.1 이 되며 다시 최신 Log 가 Server.log 로 쌓이게 됩니다 . 이렇게 최대 개수까지 쌓이게 되면 개수를 초과시 자동으로 오래된 로그부터 삭제가 되어집니다 .


7-1-3. repository.properties#REPOSITORY_TYPE = BUILTINREPOSITORY_TYPE = NONEREPOSITORY_FILE_PATH = %OZ_HOME%/repository_files/

#BackUp History for None Type REPOSITORY_NONE_BACKUP=false REPOSITORY_NONE_BACKUP_PATH=%OZ_HOME%/repository_files_bak/REPOSITORY_NONE_BACKUP_ITEM_COUNT=10 REPOSITORY_NONE_BACKUP_ITEM_VALIDDAYS=0

Default 가 오즈 서버 폴더 아래의 repository_files 폴더 이며 이를 운영자가 변경 하실 수도 있습니다 . 참고로 변경 시에 폴더 권한에 대해 체크 하셔야 합니다 .

7-2. license7. OZ Server

오즈 서버 아래의 license 폴더로 가시면 ozlicense.xml 파일을 보실 수 있습니다 .

<?xml version="1.0" encoding="UTF-8"?><OZ-SERVER-FRAMEWORK-SERVLET PRODUCT-VERSION="4.0.0101" OS-NAME="any" IP="any" EXPIRE-DATE="2008-09-03" CPU-COUNT="" USE-WEBSERVICE="FALSE" KEY="77208008217EBC33A876468D44A02101160EF5CA" />

서버 버전정보와 일치해야 합니다 .

라이센스 만료 날짜 입니다 .

7-3. Viewer 호출 태그7. OZ Server

<%@page contentType="text/html;charset=euc-kr"%><%%><HTML><HEAD><TITLE></TITLE><SCRIPT LANGUAGE="JAVASCRIPT"></SCRIPT></HEAD><body>

<OBJECT width = "0" height = "0" ID="ZTransferX" CLASSID="CLSID:C7C7225A-9476-47AC-B0B0-FF3B79D55E67" codebase="http://127.0.0.1:8080/ozviewer40/ZTransferX.cab">

<PARAM NAME="download.Server" VALUE="http://127.0.0.1/ozviewer40"><PARAM NAME="download.Port" VALUE="8080"><PARAM NAME="download.Instruction" VALUE="ozaviewer.idf"><PARAM NAME="install.Base" VALUE="<PROGRAMS>/Forcs"><PARAM NAME="install.Namespace" VALUE="AppSampleOZ"></OBJECT>

<OBJECT bgcolor="#FFFFFF" width = "100%" height="100%" ID="OZ" CLASSID="CLSID:907A00F3-7390-4EF2-931B-360546587804" VIEWASTEXT>

<param name="repository_agent.type" value="FROM_OZSERVER"><param name="repository_agent.ozserver.servlet" value="http://127.0.0.1:8080/oz40/server"><param name="application.namespace" value="AppSampleOZ\bin"><param name="ozadoc.path" value="AppSampleOZ/MainFrame40.oza"> </OBJECT>

</BODY></HTML>

7-4. HTML 과 OZ Application 통신7. OZ Server

Html 과 OZ 간의 상호 값을 전달하고 전달 받을 수 있으며 컴포넌트들을 제어 하실 수 있습니다 .

첫 번째로 OZ 와 html 과 통신을 하기 위해서는 OZ Application 의 Document 속성 중 AllowExternalAcess 속성을 True 로 설저해 주셔야 합니다 .

두 번째로 자신이 발생시키고자 하는 특정 이벤트의 스크립트에 다음과 같이 명시합니다 .var window = _GetWebBrowserWindow();window. fromApplication();// fromApplication() 함수는 html 에 선언되어 있어야 합니다 .

세 번째로 Html 소스에 fromApplication() 함수를 만듭니다 .

7-4. HTML 과 OZ Application 통신7. OZ Server

<script language="JavaScript" type="text/JavaScript">function toApplication() {

var doc = OZApplicationViewer.Document;// textboxdoc._GetBoard('Board1').GetChild('tb1').Text = document.frm1.htmlText.value;// checkboxdoc._GetBoard('Board1').GetChild('check1').Checked = document.frm1.htmlCheckbox1.checked;// 변수doc._SetGlobal('gVar', document.frm1.htmlVariable.value);doc._GetBoard('Board1').GetChild('bt1').TriggerEvent("OnClick");

}

function fromApplication(){

var doc = OZApplicationViewer.Document;// textboxdocument.frm1.htmlText.value = doc._GetBoard('Board1').GetChild('tb1').Text;// checkboxdocument.frm1.htmlCheckbox1.checked = doc._GetBoard('Board1').GetChild('check1').Checked;// 변수document.frm1.htmlVariable.value = doc._GetGlobal('gVar');

}</script>

Documents

5. OZ Application 주요 컴포넌트