PID의 소개
PID의 소개
PID는 Visual Basic, Delphi, PowerBuilder와 유사한 Interface 및 Functionality를 제공하는 MiPlatform 개발 도구입니다. 개발자는 화면을 디자인하고 Dataset을 설정할 수 있으며 컴포넌트 이벤트 설정 및 Script를 작성할 수 있습니다. 또한 작성한 화면을 다양한 Device에 쉽게 적용할 수 있습니다.
권장사양
MiPlatform V3.3을 사용하는 데 필요한 시스템 권장사항입니다.
항목 | 내역 |
---|---|
CPU | Intel Pentium 4 1.4GHz 이상(Intel Pentium i3-330M, 2.13GHz 이상 권장) |
운영체제 | Windows XP SP3 이상(Windows7 Home Premium 32bit SP1 이상 권장) |
메모리 | 1GB RAM 이상(DDR3 4GB 이상 권장) |
디스크 여유 공간 | 8GB 이상(30GB 이상 권장) |
디스플레이 | 가속 기능을 갖고 있는 메모리 512MB 이상의 그래픽 장치 권장 |
PID의 설치 및 삭제
설치
PID는 MiPlatform 설치 패키지에 포함되어 배포됩니다.
본 절의 설치과정은 MiPlatform_SetupDeveloper330U팩을 기준으로 설명합니다.
1
배포된 Setup 파일을 실행하면 설치 준비과정이 진행됩니다.
Windows Vista의 경우, 보안 경고창이 나타납니다. 반드시 실행을 선택하여 주시기 바랍니다.
1
MiPlatform_SetupDeveloper330U의 실행에 필요한 설치 파일을 사용자 컴퓨터에 복사하고 프로그램 실행에 필요한 정보를 등록합니다.
2
Finish 버튼을 클릭하여 프로그램 설치를 완료합니다.
PID의 설치정보
[시작 > 프로그램 > TOBESOFT > MiPlatform > MiPlatform V3.3.0 Unicode for Developer] 경로에서 PID를 비롯하여 설치 패키지에 포함된 툴의 단축 아이콘을 확인할 수 있습니다. 설치된 각각의 단축 아이콘과 설치 폴더에 포함된 파일은 다음과 같습니다.
시작메뉴
단축 아이콘
아이콘 | 설명 | 바탕화면 아이콘 생성 유무 |
---|---|---|
PID V3.3 단축 아이콘 | O | |
BSB V3.3 단축 아이콘 | O | |
Demo 프로그램 V3.3 단축 아이콘 | O | |
Showcase 프로그램 단축 아이콘 | X | |
MiPlatform 도움말 아이콘 | X | |
Uninstall 단축 아이콘 | X |
설치된 폴더 및 파일
OS | 경로 |
---|---|
VISTA | C:\Users\[유저명]\AppData\Local\TobeSoft\MiPlatform330U |
C:\Users\[유저명]\Documents\TOBESOFT\MiPlatform330U | |
XP | C:\Document and Settings\[유저명]\Local Settings\Application Data\TobeSoft\MiPlatform330U |
C:\Documents and Settings\[유저명]\Local Settings\Compatible LocalLow\TOBESOFT\Miplatform330U |
MiPlatform의 폴더 구조
폴더 | 설명 |
---|---|
기본경로(VISTA): C:\Users\[유저명]\AppData\Local\TobeSoft\MiPlatform330U | |
MiPlatform V3.3 기본 Component 모음 | |
PID 기능 지원 서비스 ※ 주의: 폴더 이름이나 위치를 변경할 경우 PID가 작동하지 않습니다. | |
도움말 파일 | |
Temp 폴더 | |
Template 모음 | |
기본경로(VISTA): C:\Users\[유저명]\Documents\TOBESOFT\MiPlatform330U | |
Demo Sample Root | |
MiPlatform V3.3 문서 파일 ※ 반드시 숙지하십시오. | |
Tutorial Sample Root |
Registry 정보
Registry의 \HKEY_CURRENT_USER\SoftWare\AppDataLow\SoftWare\TobeSoft 경로에서 MiPlatform 정상 구동에 필요한 설정 정보를 확인할 수 있습니다. 설정 정보는 Registry 편집기(C:\WINDOWS\regedit.exe)로 확인할 수 있으며 사용자가 임의로 변경하면 프로그램이 손상될 수 있습니다. 설정 정보에 대한 자세한 내용과 변경 방법 등은 Administrators Guide를 참고하십시오.
경로 | 설명 |
---|---|
Demo 사이트의 경로 | |
MiPlatform을 구동하기 위한 Registry 정보 경로 | |
Tutorial 사이트의 경로 |
Key | 값 | 설명 |
---|---|---|
기본경로: \HKEY_CURRENT_USER\SoftWare\AppDataLow\SoftWare\TobeSoft\MiPlatform330U | ||
ExecPath | C:\Users\[유저명]\AppData\Local\TobeSoft\Miplatform330 | MiPlatform330.exe 실행 경로 |
Key | 값 | 설명 |
---|---|---|
기본경로: \HKEY_CURRENT_USER\SoftWare\AppDataLow\SoftWare\TobeSoft\MiPlatform330U\settings | ||
CacheDir | C:\Users\[유저명]\AppData\LocalLowTobesoft\Miplatform330U\Cache\ | Simulator의 Cache 정보가 들어 있는 위치로 Application Group별, device별로 저장 |
ComponentPath | C:\Users\[유저명]\AppData\Local\TOBESOFT\MiPlatform330U\Component | Simulator의 화면 구성에 필요한 Component 위치 |
CurrentLayout | 4 (16진수) | 현재 Device 설정값 Nexio(800x454): 0 Pocket Style(240x320): 1 PC-Ephone(640x454): 2 SmartPhoone(160x24): 3 Win32(800x600): 4 Wind32(1024x768): 5 Essence(240x320): 6 |
Lang | Kor | 한국어 Version |
MaxCommCnt | A(16진수) | 통신 연결 최대값 |
PingWaitTime | 2(16진수) | wait time |
Retry | 2 (16진수) | 통신 연결 시도 횟수 |
ScriptPath | C:\Users\[유저명]\AppData\Local\TOBESOFT\MiPlatform330U\Script | Simulator 작동에 필요한 Script(js) 경로 |
TimeOut | 1e (16진수) | 통신 연결 Timeout |
버전 확인
시작 프로그램 TOBESOFT MiPlatform MiPlatform V3.3.0 Unicode for Developer에서 PIDeveloper330를 실행합니다. PID의 메뉴[Help > About PID]를 클릭하면 설치된 PID의 버전을 확인할 수 있습니다.
삭제
시작 프로그램 TOBESOFT MiPlatform MiPlatform V3.3.0 Unicode for Developer에서 Uninstall을 실행하면 설치된 MiPlatform Package 및 PID가 제거됩니다.
1
UnInstall의 실행
2
예(Y) 버튼을 클릭하면 삭제가 시작됩니다.
3
사용자의 컴퓨터에 설치된 프로그램 및 설치정보를 삭제 후 완료합니다.
Windows Vista의 경우, 시스템 접근 허용창이 나타납니다. 반드시 허용을 선택하여 주시기 바랍니다.
도움말 사용
단축키 <F1>을 누르거나 메뉴에서 [Help > Help]를 선택합니다. 아래 그림은 도움말을 실행한 화면입니다.
JS 파일에서 사용하는 Script 문법에 관련된 도움말 | ||
Expression(표현식)에서 사용하는 문법에 관련된 도움말 | ||
Form에서 사용 가능한 Object 도움말 | ||
Start XML에 관련된 Element에 대한 도움말 | ||
Script API 도움말 모음 | ||
Script에서 사용 가능한 함수 API 도움말 | ||
Form에서 사용 가능한 API 도움말 | ||
Service에 관련된 API 도움말 | ||
Component와 관련된 Property, Method 및 Event에 대한 도움말 Component에 대한 자세한 내용은 Component Reference Guide를 참고하십시오. | ||
Color 목록, 기능 구현 방법 등의 부가적인 도움말 |
PID의 구성
영역 | 구성 | 구성요소 |
---|---|---|
1 | Application Frrame | MenuBar, ToolBar, ComponentBar, AlignmentBar, DebugBar |
2 | Project Explorer | Application, Data, Global, WebService로 구분되어 Project 구성을 표시 |
3 | 편집 창 | Design(Form), Dataset, Design Source, Script, ServiceObject, DataObject로 구분되어 각각의 편집 지원 |
4 | Properties | Form 및 각종 Component, Dataset의 속성 및 Event 속성 표시 |
5 | Output | Message, Debug, Find In Files로 구분되어 각종 메시지 및 결과 표시 |
PID의 화면 구성
PID의 화면은 Application Frame, Project Explorer, 편집 창, Properties 창 및 Output 창으로 구분됩니다.
Application Frame
Menu Bar
Menu Bar는 PID에서 사용하는 기능을 모아놓은 곳입니다.
File Menu
메뉴 | 아이콘 | 기능 |
---|---|---|
New | 새로운 Form 생성 | |
Open Project | Project를 열기 | |
Close Project | 현재 선택된 Project 닫기 | |
Close | 현재 열린 Form 닫기 | |
Save | 현재 열린 Form 저장 | |
Save As | 현재 열린 Form 다른 이름으로 저장 | |
Save All | 현재 열린 모든 Form 저장 | |
Rename | 현재 Form의 이름 변경 | |
현재 Form 인쇄 | ||
Page Setup | 프린터 환경 설정 | |
Add To Template List | Template에 현재 Form 저장 | |
Exit | 프로그램 종료 |
Edit Menu
메뉴 | 아이콘 | 기능 |
---|---|---|
Undo | 최종 단계의 이전 상태로 되돌림 | |
Redo | Undo 하기 이전 상태로 되돌림 | |
Cut | 선택된 영역을 잘라서 클립보드에 삽입 | |
Copy | 선택된 영역을 클립보드에 삽입 | |
Paste | 클립보드에 있는 내용을 붙여 넣기 | |
Delete | Device Form 화면 개발 중일 때는 선택된 컴포넌트 삭제 내부 로직 Script 개발 중일 때는 선택된 영역의 Text 삭제 | |
Select All | 컴포넌트를 모두 선택하거나 Script의 모든 텍스트 선택 | |
Find | Text Editor에서 편집 작업 중일 때, 문자열을 찾기 | |
Find Next | Text Editor에서 편집 작업 중일 때, 찾기 메뉴를 이용하여 처음 찾은 문자열 이후 나오는 문자열을 다시 찾기 | |
Find Previous | Text Editor에서 편집 작업 중일 때, 다음 찾기와 반대로, 찾은 문자열 이전에 나오는 문자열을 다시 찾기 | |
Replace | Text Editor에서 편집 작업 중일 때, 특정 문자열을 다른 문자열로 교체 | |
Find in Files | 지정 경로의 파일들 중 지정 단어를 포함한 파일을 찾기 | |
Goto Line | Text Editor에서 편집 작업 중일 때, 특정 라인으로 커서를 이동 | |
Toggle Bookmark | Text Editor에서 편집 작업 중일 때, 현재 커서의 위치에 Bookmark를 새로 만들거나 삭제 | |
Next Bookmark | Text Editor에서 편집 작업 중일 때, 현재 커서의 위치를 다음 Bookmark 위치로 이동 | |
Previous Bookmark | Text Editor에서 편집 작업 중일 때, 현재 커서의 위치를 이전 Bookmark 위치로 이동 | |
Clear Bookmarks | Text Editor에서 편집 작업 중일 때, 전체 Bookmark를 삭제 | |
List Members | Text Editor에서 편집 작업 중일 때, 현재 문자열과 ID가 같은 컴포넌트의 콤보 리스트 상자(속성, Method 리스트)를 띄움 | |
Parameter Info | Text Editor에서 편집 작업 중일 때, 현재 문자열과 같은 함수의 파라미터 정보 상자를 띄움 | |
Block Comment or Uncomment | Text Editor에서 편집 작업 중일 때, 선택된 영역을 주석 처리 여부 선택 | |
Refresh File Status | 파일을 다시 로드함 |
View Menu
메뉴 | 아이콘 | 기능 |
---|---|---|
Main | Main 툴바를 보이거나 숨김 | |
Debug | 디버그바를 보이거나 숨김 | |
Align | 정렬 바를 보이거나 숨김 | |
Source Control | 형상관리 바를 보이거나 숨김 | |
Components | 컴포넌트 바를 보이거나 숨김 | |
Status Bar | 상태 바를 보이거나 숨김 | |
Project Explorer | Project Explorer 창을 보여줌 | |
Properties | Properties 창을 보여줌 | |
Output | Message, Debug 및 Find in Files 창을 보여줌 | |
Component Toolbox | 컴포넌트 툴박스 창을 보이거나 숨김 |
Project Menu
메뉴 | 아이콘 | 기능 |
---|---|---|
Reload | 문서를 새로 고침 | |
Launch Project | Project 실행 | |
Launch Project(Variable) | 변수를 입력받아 Project 실행 | |
Make Shortcut | 단축 아이콘 생성 | |
Save the Project As Compiled XML | Project를 compiled된 XML 파일로 저장 | |
Edit Component Template | 컴포넌트 Template 관리창 실행 | |
Project All Upload | Project 전체를 Deploy에 Upload 합니다. Option / Deploy에서 Host를 추가해야 사용이 가능합니다. | |
Launch MiDeploy | Mideploy를 실행합니다. | |
Make Update HTML | Update HTML을 생성합니다. | |
Make Update Config XML | Update Config XML을 생성합니다. | |
Edit Start XML | Start XML을 편집합니다. |
Design Menu
메뉴 | 아이콘 | 기능 |
---|---|---|
Align | Left: 마지막에 선택된 컴포넌트의 Left 값을 기준으로 정렬 Right: 마지막에 선택된 컴포넌트의 Right 값을 기준으로 정렬 Top: 마지막에 선택된 컴포넌트의 Top 값을 기준으로 정렬 Bottom: 마지막에 선택된 컴포넌트의 Bottom 값을 기준으로 정렬 Horizontal Centers: 마지막에 선택된 컴포넌트 수평 중앙값을 기준으로 정렬 Vertical Centers: 마지막에 선택된 컴포넌트 수직 중앙값을 기준으로 정렬 | |
Space | Same Space Horizontal: 마지막에 선택된 컴포넌트와 이전에 선택된 컴포넌트를 같은 간격(수평)으로 정렬 Same Space Verticaly: 마지막에 선택된 컴포넌트와 이전에 선택된 컴포넌트를 같은 간격(수직)으로 정렬 | |
Size | Same Width: 마지막에 선택된 컴포넌트의 Width 값을 기준으로 크기 변경 Same Height: 마지막에 선택된 컴포넌트의 Height 값을 기준으로 크기 변경 | |
Position | Left Edge: 선택된 컴포넌트를 Form의 Left를 기준으로 정렬 Right Edge: 선택된 컴포넌트를 Form의 Right를 기준으로 정렬 Top Edge: 선택된 컴포넌트를 Form의 Top을 기준으로 정렬 Bottom Edge: 선택된 컴포넌트를 Form의 Bottom을 기준으로 정렬 Horizontal Center: 선택된 컴포넌트를 Form의 수평 중앙에 정렬 Vertical Center: 선택된 컴포넌트를 Form의 수직 중앙에 정렬 | |
Tab Order | Form에서 Tab Order를 직접 수정 | |
Tab Order Editor | Tab Order Editor 실행 | |
Quick View | 현재까지 만들어진 Form 문서를 MiPlatform으로 실행 | |
Quick View(Variable) | 변수를 입력 받아 현재까지 만들어진 From 문서를 MiPlatform으로 실행 |
Debug Menu (V3.3 추가)
V3.2에서 Project 및 View Menu의 하위에 있던 Debug Start 명령과 Menu에 포함되어 있지 않고 Toolbar로만 제공하던 Debug Menu를 V3.3에서 분리, 추가하였습니다.
아울러 Debug 관련 창 활성화를 위한 메뉴를 추가하여 해당 Watch 및 Variables 창에 접근을 용이하도록 하였습니다.
메뉴 | 아이콘 | 기능 |
---|---|---|
Debug Project | Project를 Debugging 모드로 실행합니다. | |
Debug Form | 현재 열린 Form을 Debugging 모드로 실행합니다. | |
Stop Debug | Debugging을 종료합니다. | |
Step In | 호출한 함수 안으로 진입합니다. | |
Step Over | 다음 Line으로 진행합니다. | |
Step To | 지정된 Cursor 위치까지 한번에 진행합니다. | |
Step Out | 함수안에서 밖으로 나옵니다. | |
Toggle Breakpoint | Breakpoint를 설정/해제합니다. | |
Delete All BreakPoints | 설정된 모든 Breakpoint를 해제합니다. | |
Windows | Wath: Watch창을 나타나게 합니다. Variables: Variables창을 나타나게 합니다. Debug Message: Debug Message를 나타나게 합니다. |
Tool Menu
메뉴 | 아이콘 | 기능 |
---|---|---|
Project Manager | Project Manager 실행 | |
Device Manager | Device Manager 실행 | |
Options | PID의 Options 설정창 열기 | |
Custom Form Templates | 사용자폼 관리창 열기 |
Window Menu
메뉴 | 아이콘 | 기능 |
---|---|---|
Cascade | 열린 창을 계단식으로 정렬 | |
Tile | 열린 창을 타일식으로 정렬 | |
Arrange Icons | 최소화된 창 아이콘 정렬 | |
Close | 열린 창 닫기 | |
Close All | 열린 모든 창 닫기 | |
Next | 다음 화면으로 이동 | |
Provious | 이전 화면으로 이동 |
Help Menu
메뉴 | 아이콘 | 기능 |
---|---|---|
Help | 도움말 창 표시 | |
Whats New ? | MiPlatform V3.3의 새로운 기능 정보 창 표시 | |
Regist | License Key 등록/갱신 | |
About PID | PID 정보 창 표시 |
Toolbar
Toolbar는 PID 사용에 필요한 기본 기능을 모아놓은 곳입니다.
V3.3에서 사용자로 하여금 원래의 Toolbar 기능을 쉽게 이해할 수 있도록 Project Open, Project Launching Toolbar button의 이미지를 변경하였습니다.
메뉴 | 기능 | |
---|---|---|
Open Project | Project 열기 | |
New | 새로운 Form 문서 생성 | |
Save | 현재 열린 Form 문서 저장 | |
Save All | 현재 열린 모든 Form 문서 저장 | |
Cut | 선택 영역을 잘라내어 클립보드에 저장 | |
Copy | 선택 영역을 복사해서 클립보드에 저장 | |
Paste | 클립보드에 저장된 내용 붙여넣기 | |
현재 Form 문서 인쇄 | ||
Project Manager | Project Manager 실행 | |
Launch Project | Project 실행 | |
Quick View | 현재까지 만들어진 Form 문서를 MiPlatform으로 실행 | |
Options | PID의 Option 설정 창 표시 | |
About | PID의 정보 창 표시 |
Component Bar
Component Bar는 작업 중인 Project에 등록된 Component 모임입니다. 화면 편집 중에 해당 Component를 직접 끌어다 놓음으로써 화면을 구성할 수 있습니다.
컴포넌트 | 기능 | |
---|---|---|
Select | Component Select Icon | |
cySpin | 정해진 규칙에 따라 손쉽게 숫자를 입력받을 때 사용하는 Component | |
cyMaskedit | 날짜의 연월일시(yyyy/mm/dd hh:mi:ss) 형식 또는 숫자의 Comma 표시와 같이 규정된 형식으로 문자열을 입력받거나 보여주는 Component | |
cyButton | 사용자로부터 마우스 입력을 받을 때 사용하는 버튼 Component | |
cyStatic | Static Component는 다른 Presentation Component (Edit, Combo..)들에 대한 제목 등을 기술하거나 화면을 구성할 때 관련 있는 Component를 그룹화하는 컴포넌트 Static Component 안에는 2가지(Label, GroupBox) Control이 있습니다. | |
cyEdit | 텍스트 표시와 입력 값을 가지는 Component | |
cyShape | 라인, 사각형, 원, 라운드 사각형을 그리기 위한 Component | |
cyPie | 호(Pie)모양을 그리기 위한 Component | |
cyCheckBox | TRUE/FALSE 값을 가지는 Component | |
cyFileDialog | 옵션에 따라 파일 열기 대화 상자, 파일 저장 대화 상자, 폴더 선택 대화 상자를 표시하는 경우 사용되는 Component | |
cyFile | File을 읽거나 작성된 내용을 저장할 때 사용되는 Component | |
cyListBox | Dataset에 Binding하여 항목을 List로 나열하여 선택할 경우 사용되는 Component | |
cyComboEx | Edit와 드롭 다운 스크롤 리스트를 통합한 형태의 Component | |
cyRadio | 제시된 여러 가지 선택사항 중에서 하나의 항목을 선택해야 할 경우 사용되는 Component | |
cyTextArea | 사용자에게 여러 Line의 문자열을 입력받거나 표시할 경우 사용되는 Component | |
cyProgressbar | 작업의 현재 진행 상태를 그래픽을 이용하여 보여주는 Component | |
cyTreeView | Data를 Tree 형태로 표시할 때 사용되는 Component | |
cyGrid | 스프레드시트와 유사하게 Dataset의 내용을 표 형식으로 처리하는 Component | |
cyImage | 화면에 이미지를 표시할 때 사용되는 Component | |
cyCalendarEx | 날짜를 입력할 때 사용되는 Component | |
cyDiv | Form안에 다른 Form을 불러와서 하나의 Form인 것처럼 사용하거나, 관련 있는 Component를 하나의 그룹으로 묶어서 처리할 경우 사용되는 Component | |
cyTab | 한 화면에서 여러 개의 Tab Page를 분할할 경우 사용되는 Component | |
cyWebBrowser | Internet Explorer와 같은 웹 브라우저 Component | |
cySWFlash | Flash를 보여주는 Component | |
cyMenuBar | Menu Item을 구성할 경우 사용되는 Component | |
cySplit | 화면 분할을 구현하기 위한 Component | |
cySplitJoint | 1개~4개의 Split Component를 연결하기 위한 Component | |
cySign | 사용자의 Sign을 입력받기 위한 Component | |
CyPopupDiv | 하나의 화면에 여러 개의 부분 화면을 구성할 때 사용하는 Component |
Alignments Bar
Alignments Bar는 Form 화면 개발 시 컴포넌트를 정렬하는 기능을 모아놓은 곳입니다.
메뉴 | 기능 | |
---|---|---|
Align Left | 마지막에 선택된 컴포넌트의 Left 값을 기준으로 정렬 | |
Align Horizontal Centers | 마지막에 선택된 컴포넌트 수평 중앙값을 기준으로 정렬 | |
Align Right | 마지막에 선택된 컴포넌트의 Right 값을 기준으로 정렬 | |
Align Top | 마지막에 선택된 컴포넌트의 Top 값을 기준으로 정렬 | |
Align Vertical Centers | 마지막에 선택된 컴포넌트의 수직 중앙값을 기준으로 정렬 | |
Align Bottom | 마지막에 선택된 컴포넌트의 Bottom 값을 기준으로 정렬 | |
Same Width | 마지막에 선택된 컴포넌트의 Width 값을 기준으로 너비를 맞춤 | |
Same Height | 마지막에 선택된 컴포넌트의 Height 값을 기준으로 높이를 맞춤 | |
Horizontal Space | 컴포넌트 사이를 같은 간격(수평)으로 정렬 | |
Vertical Space | 컴포넌트 사이를 같은 간격(수직)으로 정렬 | |
Lock Control | 컴포넌트의 위치를 고정시키거나 해제 |
Debug Bar
Debug Bar는 디버깅 시 필요한 기능을 모아놓은 곳입니다.
메뉴 | 기능 | |
---|---|---|
Start Debug | 디버깅 모드 시작 <F5> | |
Stop Debug | 디버깅 모드 종료 | |
Step In | 한 스텝씩 디버그, 스텝에 다른 함수 호출 시 해당 함수로 이동 <F11> | |
Step Out | 한 스텝씩 디버그, 한 스텝을 모두 실행하고 다음 스텝으로 이동 <F10> | |
Step Over | 현재 함수의 나머지 부분을 실행하고, 함수 호출이 이루어진 다음 문장에서 멈춤 | |
Step to | 현재 커서가 위치한 줄까지 실행 후 멈춤 | |
Breakpoint | Breakpoint를 설정하는 기능 | |
Delete All Breakpoints | 설정된 Breakpoint를 해제 |
SCM Bar
SCM (Source Control Manager) Bar는 형상관리 시 필요한 기능을 모아놓은 곳입니다.
메뉴 | 기능 | |
---|---|---|
Get Last Version | 최종 버전을 다운 SCM Type이 Clearcase일 경우 비활성화 | |
Check Out | 서버로부터 최신 버전을 다운 | |
Check In | 수정한 내용을 서버에 올림 | |
Undo Check Out | 수정한 내용을 저장하지 않고 파일을 Check In SCM Type이 Clearcase일 경우만 실행 | |
Add To Source Control | SCM에 파일 등록 | |
Remove From Source Control | SCM에 등록된 파일을 삭제 | |
Show Version Tree | Clearcase Show Version Tree Browser을 호출 SCM Type이 Clearcase일 경우만 실행 | |
Show History | 파일 수정 내역 확인창 실행 | |
Show Differences | SCM에 등록된 최종 버전과 현재 사용자의 파일 비교창 실행 | |
Refresh Status | 파일의 상태를 Refresh | |
Run Source Control Client | SCM 프로그램 실행 |
Status Bar
Status Bar는 PID의 상태를 나타내는 곳입니다.
메뉴 | 기능 |
---|---|
프로그램의 상태를 보여주는 Message Bar | |
선택된 Component의 Form 좌표 Form이 선택된 경우에는 마우스 커서 좌표 (단위: Pixel) | |
선택된 Component의 크기 (단위: Pixel) | |
현재 파일의 상태 | |
스크립트 삽입모드 상태 | |
<CAPS LOCK> 설정/해제 기능 | |
<NUM LOCK> 설정/해제 기능 | |
<SCROLL LOCK> 설정/해제 기능 |
Project Explorer
Project Explorer는 Project에 포함된 항목들을 표시하고 각 항목별로 편집기를 제공합니다. Project Explorer는 Application, Data, Global의 세 영역으로 구성됩니다.
Application 영역은 형태별 Application Group, 각 Application 경로에 포함된 파일 목록 및 표시 가능한 각 파일별 구성 항목을 보여 줍니다. Form 형태의 Application Group은 각 화면과 그 구성 Component 목록, Application Group에 포함된 Image Resource 파일 내역을 표시하고 편집합니다.
Data 탭은 각종 통신, Local DB Protocol 목록, Business Service 목록 및 입출력 레이아웃을 표시합니다. Global 탭은 StartXML에 정의되어 있는 각종 Global 항목을 표시하고 편집합니다.
Application Group
Application 영역은 각 그룹별로 포함된 파일들의 목록과 그 내용을 표시합니다. Application Group은 Form/Js/BS/File의 4가지 Type이 있으며 설정에 따라 Project 설정값과는 별도의 Codepage 및 Cache 정책 등의 속성을 가질 수 있습니다.
Form type의 Application Group에는 화면(Form) 목록과 Image Resource 목록, Library Script, 기타 사용자 지정 파일 목록의 경로 정보가 포함되어 있습니다.
Js Type의 Application Group에는 공통 라이브러리 또는 사용자 정의 Function을 포함하는 JavaScript 파일 목록이 표시됩니다. BS와 File Type의 Application Group에는 경로 정보만 저장되어 있으며 별도 내역은 표시되어 있지 않습니다.
Application 영역의 각 항목을 더블클릭하면 적절한 Editor를 활성화시킬 수 있습니다. 또한 Form이나 JS 파일의 경우에는 Drag 하여 다른 Application Group으로 복사하거나 이동할 수 있습니다.
Application Group Editor에서 Application Group을 추가/삭제하고 설정을 변경할 수 있습니다.
영역 | 설명 |
---|---|
1 | Form 리스트 중 특정 Form을 Form 이름으로 빠르게 찾을 수 있는 Edit 상자 |
2 | Application Group, Data, Global의 목록 창 |
Data
Data 영역에는 각종 통신용 Protocol과 Business Service 연결을 위한 Data Group이 표시됩니다.
Protocols 항목에는 Project 생성 시 포함되는 File, http, https, Rss의 네 가지 통신 Protocol과 Local DB, 기타 사용자 정의 Protocol 항목이 표시됩니다.
Data Group 항목에는 Business Service 접근 경로가 포함된 각각의 Data Group, Business Service 목록, Business Service 입출력 Layout이 표시됩니다.
각각의 항목은 Protocol Editor와 Data Group Editor를 사용하여 추가/삭제하거나 설정을 변경할 수 있습니다.
영역 | 설명 |
---|---|
1 | 통신을 위한 Protocol에 관한 목록 |
2 | Data 교환을 위한 Data Groups의 목록 |
Global
Global Area에는 Application과 Data 영역에 포함되지는 않으나 Project 전체에 걸쳐 사용되는 여러 Global 항목이 표시됩니다. 또한 각각의 편집기를 사용하여 Global Area에 항목들을 추가하거나 변경할 수 있습니다.
Project Explorer는 팝업메뉴의 Refresh 명령을 사용하여 하위 항목을 다시 읽어 표시할 수 있습니다. Global 영역의 각 항목들은 별도로 표시되지만 모두 하나의 Start XML 안에 기술됩니다. 따라서 Global 영역의 각 항목에 대해서 Refresh 명령을 사용하는 것과 Project Reload를 실행하는 것은 같은 기능입니다. Global에 관한 자세한 내용은 5장 [5. Global Contents]를 참고하십시오.
전역 변수 목록 | |
전역 Dataset과 각 Dataset Layout 표시 | |
항목 더블클릭 시 Script Editor 연결 | |
Color, Font 등의 정보를 포함하는 Style Template 목록 표시 | |
사용자 지정 Color | |
사용자 API 등록 | |
Project Image Resource 목록 | |
Menu 생성 및 속성 설정 | |
Domain 속성 설정 | |
MDI 형태 프로그램의 속성 설정 | |
Frame의 속성 설정 | |
Global ServiceObjecct 목록 표시 | |
Global DataObject 목록 표시 |
Properties
Properties는 편집 중인 Form이나 각 Component, Dataset에 대한 속성 및 이벤트 항목의 값을 표시하고 편집합니다.
이름순 속성
[그림 3-33]은 해당 컴포넌트의 속성을 이름순으로 정렬하여 속성을 설정하는 화면입니다.
Group별 속성
[그림 3-34]는 해당 컴포넌트의 속성을 그룹별로 정렬하여 속성을 설정하는 화면입니다.
그룹별로 속성을 볼 때 [그림 3-34]의 +나 -를 마우스로 클릭하여 항목을 펼치거나 접을 수 있습니다.
이벤트 설정
컴포넌트에 대한 Event 리스트가 나열되며 해당 컴포넌트 이벤트에 대한 동작(함수)을 설정합니다.
각 Event 속성의 입력 창을 더블클릭하면 해당 컴포넌트 이름과 Event 이름으로 함수를 생성하고 Event 속성값으로 할당합니다. 이미 속성값이 있는 경우에는 Script 편집 창의 해당 함수에 커서를 위치합니다.
Form Design
Form Design 창에서는 Project에서 사용 가능한 Component로 응용 프로그램의 각 화면을 작성합니다. Form Design 창은 Design 창과 Dataset 편집 창, Design Source Editor, Script Editor로 구성됩니다.
다수의 사용자가 동시에 하나의 Form 파일을 열어 사용하는 경우에 처음으로 Form에 접근한 사용자를 제외한 다른 사용자들의 편집 창은 읽기 전용 모드가 되어 편집 작업을 할 수 없게 되며 PID 하단의 Status bar에 Read only로 표시됩니다.
Design
Design에서는 사용자가 볼 화면을 디자인합니다. 개발자가 원하는 곳에 컴포넌트를 배치할 수 있으며 각각의 컴포넌트를 복사, 이동하거나 정렬할 수 있습니다. 또한 Project Explorer의 Data 영역에 표시된 BS의 입출력 레이아웃 항목을 Drag 하여 컴포넌트의 Contents를 생성하고 해당 BS의 정보를 연결할 수 있습니다.
Dataset
Dataset은 상수와 Column 정보, 실제 데이터를 포함한 Record 영역으로 구성된 Data 처리 컴포넌트입니다. Dataset 편집 창에서 Form에 포함된 Dataset 항목을 추가, 삭제하거나 구성을 변경할 수 있습니다.
Dataset의 사용법은 4장 [4.4 Dataset의 사용]를 참고하십시오.
영역 | 속성 | 설명 |
---|---|---|
1 | Import Dataset | 저장된 파일에서 Dataset 로드 |
2 | Export Dataset | 현재 Dataset을 파일로 저장 |
3 | Add Dataset | Dataset 추가 |
4 | Delete Dataset | Dataset 삭제 |
5 | View Source | Dataset을 XML 형태로 표시 |
6 | Const | Constant Data |
7 | Add Const | Constant 변수 추가 |
8 | Delete Const | Constant 변수 삭제 |
9 | Columns | Dataset의 Columns 설정 |
10 | Add Column | Dataset의 Column 추가 |
11 | Insert Column | 커서가 위치한 상단에 Column 삽입 |
12 | Delete Column | Dataset의 Column 삭제 |
13 | Rows | Dataset의 Row 설정 |
14 | Add Row | Dataset의 Row 추가 |
15 | Insert Row | 커서가 위치한 상단에 Row 삽입 |
16 | Delete Row | Dataset의 Row 삭제 |
Design Source
Design Source Editor에는 Form의 내용 중 Script 영역을 제외한 모든 내용이 XML 형태로 표시됩니다. 표시된 XML을 직접 편집하여 Form의 내용을 변경할 수 있습니다.
Script
Script 편집 창에서는 Form 및 각종 Component의 Event 처리 함수와 사용자 함수들을 JavaScript로 작성합니다.
Form Design 기능 개선 ( V3.3 개선 )
V3.3에서 Form Design의 기능을 개선하였습니다.
편집 창 확대
PID의 화면은 메뉴 및 Toolbar는 Project Explorer, Properties, Output Window 등 다수의 Sub Window와 편집 영역으로 구성합니다. 각 Sub Window들은 각자의 역할을 가지고 있지만 이 Sub Window들로 인해 실제 편집 공간이 부족한 경우가 있습니다.
이때 편집 공간의 확보를 위해 확대 기능을 활용할 수 있습니다.
기능의 활성화, 비활성화
기능의 사용을 위해서는 편집창의 제목을 표시하고 있는 MDI Client Tab button을 마우스 왼쪽 버튼으로 Double-Click 하면 된다. 편집 창 확대 기능을 활성화하면 다른 Sub Window들은 Auto Hide 상태로 전환되고 편집 창 영역이 사용할 수 있는 모든 공간으로 확장됩니다.
편집 창 확대 기능을 비활성화하려면 다시 제목을 표시하고 있는 MDI Client Tab button을 마우스 왼쪽 버튼으로 Double-Click 합니다.
Ruler / Guide Line
Ruler는 Design 창의 좌측과 상단에 눈금자 형태로 표시되며 현재 Mouse Pointer의 좌표와 Guide Line의 위치 등을 표시합니다. Design 창에 Ruler를 표시하지 않기를 원하거나 Guide Line 기능을 비활성화하려면 Options 창의 Design Tab에서 설정을 변경하거나 단축키를 사용합니다.
Mouse Pointer 표시
Options / Design / Display current mouse position 설정 시 Ruler에 Mouse Pointer의 현재 위치를 표시합니다. 마우스 이동에 따라 표시 위치를 갱신하여 줍니다. Ruler에 표시하는 Mouse의 위치는 Status bar에 표시되는 값과 같습니다.
Guide Line 설정
생성
Ruler에서 Guide Line을 생성하고자 하는 위치를 Click 하여 Guide Line을 생성할 수 있습니다.
Click 한 위치에는 오각형의 Guide Line Mark를 표시하며 Design 창에 파란색 Guide Line을 표시합니다.
이동
Ruler에서 생성한 Guide Line Mark를 Mouse로 Drag 하여 위치를 변경할 수 있습니다.
Options / Design / Snap to other components when move Guide Line 선택항목 값이 설정되어 있는 경우 이미 생성한 Component의 위치와 Guide Line의 위치를 일치하도록 할 수 있습니다.
삭제
Guide Line Mark를 Design 창밖으로 Drag 하거나 Double-Click 하여 삭제할 수 있습니다.
컴포넌트 자동 배치
Guide Line 생성 후 해당 Guide Line 위치로 생성한 Component를 이동하거나 크기의 변경을 위해 Tracker를 이동하면 Guide Line과 일치하도록 Tracker 위치를 조절합니다.
해당 기능은 Guide Line 표시 여부 설정과 함께 설정됩니다.
Fit to Image 기능 개선
PID V3.2에서 Image Viewer Component에 설정한 Image 크기에 맞추어 Image Viewer Component의 크기를 자동으로 설정해 주는 기능입니다. V3.3에서 해당 기능을 ImageID 속성을 갖는 모든 Component로 확장하였습니다. 현재 해당 속성을 갖고 있는 Component는 Button과 Image Viewer의 두 가지입니다.
해당 기능은 Form Design 창에서 해당 Component를 선택한 후 마우스 오른쪽 버튼을 Click 하였을 때 나타나는 Popup Menu를 통하여 사용할 수 있습니다.
Button Component의 경우에 Image ID 속성에 설정한 Image는 4개의 상태에 해당하는 이미지를 모두 포함하고 있어 Fit to Image 기능 사용 시 원래의 이미지 크기 중 Width를 4등분 하여 적용합니다.
Output
Message
PID로 작업하는 중에 발생할 수 있는 각종 메시지를 표시합니다. 메시지에는 각종 오류, 진행과정 표시 메시지 등이 포함됩니다.
Debug
Debug 창은 디버깅 모드에서 발생하는 메시지를 보여줍니다. 디버그의 자세한 내용은 6장 [6. 디버깅]을 참고하십시오.
Find in Files 1/2
Find in Files 명령의 처리 결과를 표시합니다. 표시된 각 파일을 더블클릭하면 해당 편집 창이 열리고 해당 라인이 표시됩니다.
Find in Files 검색 창에서 Output to Panel 2의 체크 옵션에 따라 Find in Files1 또는 Find in Files 2에 결과를 표시합니다.
PID의 설정
Options 창과 Device Manager를 사용하여 개발자 자신에게 맞는 개발 환경을 설정할 수 있습니다.
Options
PID의 메뉴[Tools – Options]를 클릭하면 PID의 전체적인 개발 환경을 설정할 수 있습니다.
General 설정
General은 PID의 일반적인 Option을 설정합니다.
영역 | 속성 | 설명 |
---|---|---|
1 | Reopen last open project on Startup | PID 실행 시 마지막으로 작업했던 Project를 자동으로 엽니다 |
2 | Make Backup(.bak) File | 편집 대상 파일의 백업파일을 생성합니다. |
3 | Check event when save. | Form 내역을 저장할 때 Script 영역을 검사하여 컴포넌트의 Event 속성 중 부적절하게 연결된 항목의 값을 지웁니다. |
4 | Default Character Set | 문자 Set을 설정합니다. |
5 | Show Form Title at Project Explorer | Project Explorer에 Form 타이틀을 표시합니다. Reopen last open project on Startup 항목과 함께 설정하면 PID 실행 시 마지막으로 편집한 Form의 Application Group에 포함된 모든 Form Contents를 Load하여 Title과 함께 표시합니다. |
6 | Show Form Title at Child Tab | MDI Child Tab에 Form 타이틀 표시 여부를 설정합니다. |
7 | Show the all App. Groups form info. When open Project | Project를 Open 시 form 정보를 같이 Load 합니다. 이 옵션은 Project Open 시 느려질 수도 있습니다. |
8 | Display the title on the exported Item list | Project Explorer에서 Excel로 기능 수행 시 Form에 Title을 붙여 표시할지 여부 |
9 | Working Folder | 신규 프로젝트 생성 시 프로젝트가 저장되는 폴더를 지정합니다. |
10 | Simulator Path | 사용할 시뮬레이터의 위치를 나타냅니다. |
Design 설정
Design은 PID의 Design 관련 Option을 설정합니다.
V3.2의 General에 있던 내용이 V3.3에서 Design Tab으로 옮겨졌습니다.
영역 | 속성 | 설명 |
---|---|---|
1 | Max Undo | Undo로 복구할 수 있는 최대 횟수입니다. |
2 | Use Component Toolbox instead Toolbar | Component Toolbox를 화면 Open 시 자동 실행 여부를 설정합니다. |
3 | Display Dots | Grid Size에 맞춰 Form 디자인 창에 Dot 표시 여부를 설정합니다. |
4 | Snap to dots when move control | 컴포넌트 이동 시 이동 후 위치를 Dot에 맞출지를 설정합니다 |
5 | Grid Size | Form 디자인 창의 격자의 크기입니다. (단위: Pixel) |
6 | Display Ruler | 설정 시 Design 창에 Ruler를 표시할 것인지 선택합니다. 기본 설정값은 Ruler를 표시하도록 합니다. Ctrl+Shift+R 단축키를 사용하여 이 설정값을 변경할 수 있습니다. |
7 | Display Guide Lines | 설정 시 Ruler와 함께 Guide Line을 사용할 수 있습니다. 기본 설정값은 Guide Line을 표시하도록 합니다. |
8 | Snap to other components when move Guide Line | 설정 시 Guide Line을 Drag 하여 위치를 변경할 때 Guide Line와 근접한 Component의 좌표와 Guide Line의 이동 위치를 일치하게 합니다. 기본 설정값은 Guide Line 이동 시 Component 좌표를 사용하도록 합니다. |
9 | Display current mouse position | 설정 시 Ruler에 Mouse Pointer의 위치를 표시합니다. 기본 설정값은 Mouse 위치를 표시합니다. 설정 시 PC 사양에 따라 성능에 영향을 줄 수 있습니다. |
10 | View Linked DIV/TAB Contents | DIV/TAB에 연결된 서브폼의 미리 보기를 설정합니다. |
Editor 설정
Editor 설정은 Script 편집 창의 글꼴 및 색상을 개발자의 의향에 따라 변경할 수 있습니다.
영역 | 속성 | 설명 |
---|---|---|
1 | Font | 글자체 설정 |
2 | Size | 글자 크기 설정 |
3 | Script | 폰트의 문자 종류 설정 |
4 | Bold | 폰트 굵게 설정 |
5 | Italic | 이탤릭 체 설정 |
6 | Strike Out | 취소줄 설정 |
7 | Underline | 밑줄 설정 |
8 | Tab Size | 탭 크기 설정 |
9 | Indent Size | 들여쓰기 크기 설정 |
10 | Insert Spaces/Keep Tabs | 탭의 표시 설정. Insert Spaces로 설정 한 경우 탭 크기만큼 공백으로 표시. |
11 | View Indentation Guide | 들여쓰기 안내선 보기 설정 |
12 | Auto Indent | 자동 들여쓰기 설정 |
13 | Foreground | 바탕 색상 설정 |
14 | Background | 배경 색상 설정 |
15 | Set General | 현재 상태의 속성값을 모든 Font 리스트에 적용 |
16 | Event Function Prefix | Event Function 명의 앞에 적용될 문자열을 지정 |
17 | Set focus to the Message box when show user trace message | Trace()함수 사용 시 자동으로 Message 창으로 Focus 이동 |
Deploy/Update 설정
Deploy/Update 설정은 배포 또는 업데이트할 URL을 추가 또는 설정할 수 있습니다.
영역 | 속성 | 설명 | |
---|---|---|---|
1 | Update URL | 배포 URL | |
2 | Check Update On Startup | 시작할 때 업데이트 체크 여부 설정 | |
3 | Prompt to update when exist | 업데이트할 파일이 있을 경우 확인 창 설정 | |
4 | Add to Deploy | 사이트 추가 | |
5 | Delete the selection | 사이트 삭제 | |
6 | Deploy Info | 사이트 정보 | |
Profile | FTP Server 식별 ID, | ||
Host Addr | FTP Server IP Address | ||
Id | 사용자 ID | ||
Password | 사용자 Password | ||
Set Directory | 초기 경로 | ||
Port | Number | ||
7 | Connection Test | 연결 테스트 실행 |
SCM 설정
SCM 설정은 형상관리의 사용 여부와 관리 환경을 설정할 수 있습니다
영역 | 속성 | 설명 | |
---|---|---|---|
1 | Use SCM | SCM 사용 여부 설정 | |
2 | SCM Type | 사용자가 사용할 SCM Program을 선택 Clearcase : 유료 형상관리 툴 CVS : 무료 형상관리 툴 Harvest : 유료 형상관리 툴 MaxPlus : 유료 형상관리 툴 | |
3 | Prompt the user for optional change requests | SCM Type이 Clearcase일 경우만 선택 가능하며 Clearcase 사용 시 ClearQuest 사용 여부. | |
4 | Check User | 사용자 체크 방법 설정 | |
Only User | 사용자 로그인 ID로 체크 | ||
User + Host Name | 사용자 로그인 ID + Computer Name으로 체크 | ||
5 | Get file when opening the workspace | 프로젝트를 열 때 최신 버전으로 다운 받을지를 설정합니다 | |
6 | Check out source file(s) when edited | 등록된 파일을 편집할 때 Check out 창의 호출 여부를 설정합니다 | |
7 | Check in file(s) when closing the workspace | 프로젝트 종료 시 checked out된 파일이 있을 경우 Check in 여부를 묻는 메시지 창이 나타날지 여부를 설정합니다. | |
8 | Prompt to add files when inserted | 파일 추가 시 확인창이 나타날지 여부를 설정합니다 파일을 추가하는 경우 Add To Source control 창이 나타납니다. 프로젝트를 추가하는 경우 Source control에 추가여부를 확인합니다 | |
9 | Check SCM Status when open project | 프로젝트가 열릴 때 파일의 상태를 체크할지 여부를 설정합니다 | |
10 | Check SCM Status when a App.Group item expanded at first time | Project Explorer의 Application 탭에서 App.Group의 아이템을 +를 클릭하여 펼칠 때 파일의 상태를 체크할지 여부를 설정합니다. | |
11 | Source Control Client | 실행할 Source Control 프로그램 경로 |
Device Manager
Device Manager는 Device의 속성을 설정합니다.
PID에서 제공하는 Device에서 하나를 선택할 수 있으며 사용자 정의 Device를 추가 또는 삭제할 수 있습니다. [그림 3-56]는 PID 설치 시 기본적으로 등록되어 있는 Device에 대한 목록을 보여줍니다. [그림 3-56]의 + 버튼 또는 - 버튼을 마우스로 클릭하여 Device를 추가하거나 삭제할 수 있습니다.
Project Wizard 또는 Project Manager에서 선택된 Device의 정보를 변경한 후 저장하면 기존의 Device 목록에 새로운 Device로 추가됩니다. 추가된 Device 정보는 기존 Device처럼 사용할 수 있습니다.
Device 목록을 초기화하려면 구성 파일 중 MiPlatform 설치 폴더내의 pid_device.xml 파일을 삭제합니다.
영역 | 속성 | 설명 |
---|---|---|
1 | Device Name | Device 이름 |
2 | Width | MiPlatform이 실행될 때 전체 화면의 Width Size |
3 | Height | MiPlatform이 실행될 때 전체 화면의 Height Size |
4 | Forced to user Caption & Menu | Caption과 Menu를 강제로 표시 |
5 | Caption Height | Caption의 높이 |
6 | Menu Height | Menu의 높이 |
7 | Statusbar Height | 상태 바의 높이 |
8 | Operation System | 운영체제 |
9 | Provider | 공급자 |
10 | Information URL | Device 정보가 있는 URL |
11 | Delete Device | Device 삭제 |
12 | New Device | Device 추가 |
Device의 추가 및 수정
Device를 추가하려면 먼저 [그림 3-57]의 + 버튼을 클릭하여 새로운 Device 정보를 입력합니다. 정보 입력란에 원하는 속성을 입력한 후 OK 버튼을 클릭합니다.
Device의 수정은 Device 선택합니다. 정보 입력란에 속성을 수정한 후 OK 버튼을 클릭합니다.
Device의 삭제
Device를 삭제하려면 삭제할 Device를 선택한 후 [그림 3-58]의 - 버튼을 클릭합니다. Device의 삭제 시 확인 절차가 없으므로 신중하게 생각해서 삭제하십시오.
Hello, MiPlatform!!!
다음은 앞서 기술된 내용을 바탕으로 작성된 프로그램 예시입니다. 버튼이 클릭되면 화면에 메시지가 표시되는 예시입니다.
Project 만들기
1
Project Manager 실행
PID 메뉴 [Tools - Project Manager]를 실행한 후 [그림 3-59]의 New Project를 클릭합니다.
2
Project Wizard 설정
[그림 3-60]의 Project Wizard 1단계에서 Project의 속성을 설정합니다.
속성 | 값 |
---|---|
Name | Hello |
Character Set | euc_kr |
Working Folder | C:\Users\[유저명]\Documents\TOBESOFT\MiPlatform330\Hello |
Project Wizard 2, 3, 4단계는 Project Wizard의 기본 옵션을 그대로 사용합니다.
[그림 3-61]은 프로젝트가 생성된 상태입니다.
3
생성된 Project의 확인
이제 개발에 필요한 모든 준비를 마쳤습니다. 폴더를 열어서 파일을 확인합니다. [그림 3-62]는 Project를 생성 시 설정한 폴더에 Start XML File(Hello_ci_main_Win32.xml)과 Application Group 폴더(DefApp)가 생성되어 있으며, DefApp 폴더에는 Win32와 Script 폴더가 생성되어 있습니다.
Form 생성
1
신규 Form 생성
<CTRL+N>을 눌러 Make New 를 실행한 후 Application 탭의 Form을 선택합니다.
2
Template 선택
Empty Form을 선택합니다.
3
Form의 속성 설정
[그림 3-65]는 Form의 속성을 설정하는 화면입니다.
속성 | 값 |
---|---|
Name | formHello |
Form ID | formID |
Title | Hello, MiPlatform!!! |
Path | Name 값에 따라 XML 파일명이 자동으로 지정 |
4
Initial URL에 Form 등록
Initial URL은 프로그램 실행 시 처음으로 불러오는 페이지의 경로입니다.
Form을 시작페이지에 등록합니다. 시작페이지에 Form을 등록하기 위해 Project Manager를 실행합니다. [그림 3-66]과 같이 Initial URL 항목에 DefApp::formHello라고 입력합니다. 이것은 DefApp Application Group의 formHello Form을 가져오라는 의미입니다.
5
Project 실행
Form은 Project 생성 시 지정한 Base URL에 생성됩니다.
만들어진 Form을 실행하려면 먼저 <CTRL+F5>를 누르거나, 툴 바에서 Launch Project 아이콘을 클릭하여 Project를 실행합니다.
[그림 3-68]는 프로그램을 실행한 결과입니다. Form을 만들 때 title 옵션에 Hello, MiPlatform!!! 문자열이 제목 표시줄에 표시됩니다.
PID는 Project 전체 실행뿐만 아니라 각각의 Form을 개별적으로 실행할 수 있습니다.
[그림 3-69]의 Quick View 아이콘은 해당 Form을 바로 실행합니다.
Component의 배치와 속성 변경
1
Component의 선택
Components Bar에서 [그림 3-70]의 Button 컴포넌트를 마우스로 클릭합니다.
2
Component의 화면 배치
[그림 3-71]과 같이 Form에 컴포넌트가 그려질 위치를 정하고, 마우스를 Drag & Drop 하여 컴포넌트를 배치합니다.
3
Component의 속성 설정
[그림 3-72]와 같이 Button 컴포넌트의 속성을 Properties 창에서 변경합니다.
속성 | 값 |
---|---|
ID | btnHello |
Text | Hello, MiPlatform |
Text Property의 경우 Componect를 지정한 후 한 번 더 Click 하거나 F2 키를 누르시면 화면상에서 Text의 편집이 가능합니다.
[그림 3-73]은 속성 변경 후 Text 값이 변경된 Button 컴포넌트입니다.
이벤트의 설정과 스크립트 작성
1
이벤트의 설정
Button 컴포넌트를 클릭했을 때 메시지를 표시하기 위해서 Properties 창의 이벤트 리스트 중 OnClick 이벤트를 선택합니다. [그림 3-74]과 같이 btnHello_OnClick 부분을 더블클릭하면 컴포넌트 ID_Event 이름으로 함수가 자동 생성됩니다. 물론 함수 이름은 개발자가 임의로 정할 수 있으며, 이미 정의된 함수 리스트를 선택할 수 있습니다.
Button 컴포넌트를 클릭했을 때 작동하는 이벤트 함수가 설정되었습니다.
2
스크립트의 작성
메시지를 표시하는 Script를 작성합니다.
alert는 메시지 박스를 띄워 지정된 문자열을 사용자에게 보여 주는 함수입니다.
실행
<CTRL+S>을 눌러 변경된 사항을 저장한 후 <CTRL+F5>를 눌러 Project를 실행합니다.
Hello, MiPlatform 버튼을 클릭하면 메시지가 표시됩니다.
참고로 Quick View의 경우 변경사항에 대하여 알림 메시지를 표시하지만 Launch Project는 저장 상태로만 실행되므로 반드시 저장한 후에 Project를 실행해야 합니다.