[xplatform] 페이지 만들어 보기

다음과 같은 페이지를 만들기로 하자.

우선 기본적으로 Project를 만들기로 하자.

File - New - Project

이름을 알아서 지어주도록 하자. ex) bill

왼쪽 메뉴는 고정이고 오른쪽 화면만 계속 바뀌는 형식이다. 그렇다면 프레임을 구성해보자

MainFrame 

HFrameset

ChildFrame

FrameSet

이렇게 하면 좌우로 나뉜 프레임에 왼쪽은 고정프레임(메뉴쪽) 오른쪽은 자유프레임(변하는쪽)으로 설정이 된다.

HFrameset을 눌러 속성을 보면

Properties    -    Misc    -    separatesize    =    150, *    // 화면비율맞추기 : 왼쪽은 150 , 오른쪽은 나머지

페이지를 나눠줬다면 이제 공통적으로 사용하는 menu를 만들어 보도록 하자.

[menu 만들기]

File - New - Item - Form

폼을 만들어주자.

이름은 메뉴바니 menu로 하자.

메뉴바를 만들기위해서 필요한 조건을 생각해 보자...

우리는 트리 구조로 만들 것 이므로, 트리구조는... id, name, level, start(open, close), url 이 필요하다.

dataset을 만들어서 각각의 값들을 넣어 주도록 하자.

ex) menu_id, menu_nm, menu_lv, menu_st, menu_url

값들을 넣었다면 해당 트리를 본격적으로 만들어 보자.

1. 그리드를 그린다.

2. dataset을 드레그해서 그리드로 가져온다.

3. 그리드를 편집창에서 속성값을 수정한다.

3-1) 필요없는 id, level, state, url 항목은 삭제하고, name만 남겨둔다.

3-2) header도 필요없으니 삭제한다.

3-3) Action    -    displaytype    =    tree

   edittype       =    tree

3-4) Binding    -    text    =    bind:menu_nm    // 확인(꺼진불도 다시보자)

3-5) GrideTree    -    treelevel        =    bind:menu_lv

    treestartlevel    =    bind:ment_st

3-6) Style    -    background    -    color    =    transparent    // 우리는 배경색은 필요 없다.

 background2   -    color    =    transparent

4. propertes의 속성값을 수정한다.

4-1) Action    -    autofittype    =    col     

4-2) GridTree    -    treeinitstatus        =    expand,all       

treeusecheckbox     =    false            

treeuseline           =    false            

4-3) Style    -    lineType    =    onlyvert

자 여기까지 했다면 다음과 같은 결과를 볼 수 있을 것이다.

자 모양은 만들어 졌으니 이제 script를 만들어 보자

메뉴바에서 클릭을 해서 가는것 보다, 더블클릭해서 가는것이 좋을것 같다.

그럼 더블클릭 이벤트를 만들도록 하자.

그리드 전체에 더블클릭 이벤트를 적용시켜주고,

id, url, title을 dataset에서 가져와서 새창을 열도록 하게 만들자.

?

1 2 3 4 5 6 7 8 9 10 11 12

function left_menu_oncelldblclick(obj:Grid, e:GridClickEventInfo) {     var sID     = gds_menu.getColumn(e.row, "menu_id");     var sURL    = gds_menu.getColumn(e.row, "menu_url");     var sTitle  = gds_menu.getColumn(e.row, "menu_nm");           if(sURL.length < 1)     {             return;     }     gfn_open(sID, sURL, sTitle); }

여기까지 했다면, id, url, title을 gfn_open에게 전달하는 역할까지 했을 것이다.

그럼 실질적으로 페이지를 열어주는 gfn_open함수는 이제 만들도록 하자.

?

1 2 3 4 5 6 7 8 9 10 11 12

function gfn_open(sID, sURL, sTitle) {       var oFS = application.mainframe.HFrameSet0.FrameSet0;     var oCF = new ChildFrame(sID,0,0,800,600);           oCF.formurl=sURL;     oCF.titletext=sTitle;           oFS.addChild(sID, oCF);           oCF.show(); }

oFS는 열어줄 Frame의 위치를 저장하고 있고,

oCF는 새로 생성한 ChildFrame을 저장하고 있다.

새로 생성한 ChildFrame에 url을 넣어주고, title을 지정해 준다.

그다음 해당 Frame인 oFS에 새로 생성한 ChildFrame을 add시켜 준다.

그리고 마지막으로 새로 생성한 CholdFrame을 보여주면 된다.

gfn_open함수는 자주 사용 도므로 global 함수로 만들어줘야한다.

이 코드는 해당 proejct의 ADL을 우클릭하면 Edit Script가 나오는데 여기에 입력을 하면 

어떤 form에서도 가져다 사용 할 수 있어 global함수가 된다.

이렇게 했다면 menu는 모두 끝이 났다.

(디테일한걸 원한다면 더 봐야하지만 굵직한것만 보면 끝났다.)

자 이제 Main - H - ChildFrame에 이 menu를 추가하도록 하자.

Base 패키지는 TypeDefintion에서 Servicse부분에서 설정되어 있는 부분이 있으므로, 이를 활용해서 적자.

ChildFrame을 클릭    -    properties    -    Appearance    -    formrul    =    Base::menu.xfdl

참고로 form은 확장자가 xfdl로 저장이 된다.

(따로 설정한게 없다면 내문서\XPLATFORM\프로젝트명\Base\menu.xfdl이 존재 할 것이다.)