우선 판넬 모니터에서 많이 사용하는 디스플레이 사이즈를 알아보겠습니다. 어자피 컴퓨터 모니터에서 작동하니까. 그리 필요없는 내용일지도 모르지만....
4:3 640x480, 1024x768
모니터에 대한 내용은 다음에 하기로 하고.
pvMain() 함수에 보면
pvResize(p, 0, 1280, 1024);
//pvScreenHint(p, 1024, 768)
이 두함수가 맨 처음 실행됩니다. 바로 GUI화면 초기화 부분입니다. 두 함수의 정확한 역활에 대해 생각해 본적이 없어 우선은 진행하죠, 여하튼 기본 해상도는 1280x1024인 것 같네요.
 |
| 그림 1. mask(GUI) 레이아웃 디자인 |
우선 레이아웃 생성자에 다음과 같은 레이아웃을 새로 정의 하였습니다.
| 레이아웃 | 레이아웃 이름 | 모 |
| VBOX | ID_MAIN_WIDGET | -1 |
| HBOX | LH_Top | ID_MAIN_WIDGET |
| HBOX | LH_Center | ID_MAIN_WIDGET |
| VBOX | LV_Left | LH_Center |
| VBOX | LV_Right | LH_Center |
| HBOX | LH_Tab01 | LV_Right |
| HBOX | LH_Bottom | ID_MAIN_WIDGET |
레이아웃 생성자 텍스트 박스에 입력된 내용은 다음과 같습니다.
 |
| 그림 2.GUI 작화 화면 |
대강 필요한 위젯들을 배치하여 보았습니다. 그림 2를 만들 때 사용한 위젯은 다음과 같습니다. 우선위젯 크기는 신경쓰지 마시기 바랍니다.
| 위젯 | 라벨 이름 | Width | Height | ETC. |
| Label | label_top | 700 | 70 | SCADA LAYOUT |
| ToolBox | toolb_01 | 120 | 150 | |
| LineEdit | linee_01 | 100 | 30 | |
| Tab | tab_01 | 500 | 250 | |
| Label | label_01 | 100 | 30 | |
| MultilineEdit | mulline_01 | - | ||
| Table | table_01 | - |
사용된 위젯을 참조하시기 바랍니다
그럼 레이아웃 에디터 창에 다음과 같이 입력하시기 바랍니다.
한 방에 너무 많은 양을 집어 넣어서 죄송... 하나씩 넣어 확인하고 싶지만, 한두개 집어넣어서는 의도한 대로 나타나지 않아 최소한의 양을 집어 넣었습니다.
혹시, 설명이 부족한 것 같아 입력한 화면을 첨부합니다.
 |
| 그림3. 레이아웃 에디터 편집화면 |
pvAddWidgetOrLayout(p, parent_id, item_id, row, column);
다시 한번 설명하면, 생성자에서 정의한 Layout에 위젯 이나 레이아웃을 넣어주기 위해 사용하는 함수입니다. parent_id 는 모 피쳐, item_id는 자 피쳐 관계입니다. LH_Top 레이아웃을 ID_MAIN_WIDGET에 넣어 주기 위해서는
pvAddWidgetOrLayout(p,ID_MAIN_WIDGET,LH_Top,-1,-1);
와 같이 넣어주면 됩니다.
만약 LH_Top 레이아웃에 label_top 위젯을 넣고 싶으면
pvAddWidgetOrLayout(p,LH_Top,label_top,-1,-1);
row, column은 Grid layout을 사용하지 않는 경우 기본값이 -1을 넣어 주시기 바랍니다.
 |
| 그림 4. pvbrowser 실행화면 |
이렇게 사용해도 되지만, 화면 좌측에 있는 툴박스가 차지하는 영역이 너무 크죠.(기본적으로 절반을 사용합니다.) 일정 크기 이상 커지지 않게 해보겠습니다.
위젯 속성창에 있는 MinSize, MaxSize를 이용하면 됩니다.
MinSize 값은 pvbrowser 창이 위젯 크기보다 작아질 경우 위젯을 나타낼 최소 크기(... 설명이 이상한가, 정확한 작동법은 아직 잘 모르겠습니다.). Max Size는 반대로 최대 위젯 크기 입니다.
minsize(폭/높이) 10,10; maxsize(폭/높이)120, 150;
위젯의 속성값을 변경한 후 컴파일 하여 pvbrowser에서 확인해 보죠
 |
| 그림 5.툴박스 최소/최대 크기 변경 후 실행 화면 |
 |
| 그림 7. 라인에디너 최소/최대 크기 변경 후 실행화면 |
pvbrowser 창크기를 변경해 보십시오. 크기가 변합니다. 최소 크기는 어떤 형태로 반영되는 지 모르겠습니다. 일정 크기 이하로 변경되지 않는 것 같은데....나중에 알아내면 알려드리기로 하고 우선은 계속 진행하기로 하겠습니다.
LV_Left 레이어에 위치한 툴박스 위젯과 라인에디터 위젯의 위치를 수정해 보죠, 레이아웃에서 가운데 기준으로 정렬되어 보기가 좀 그렇네요, 툴박스 위젯은 상부로 라인 에디터는 하부로... 한번 해 볼까요. 설명이 이상한데 해보죠.
 |
| 그림 8.stretch 삽입 후 실행 화면 |
그림 8은 pvAddStretch() 함수를 사용하였을 때 pvbrowser 실행 화면 입니다. 툴박스는 상부에 라인에디터는 하부로 배치되었습니다.
코드는 다음과 같이 삽입하면 됩니다.
pvAddStretch() 함수를 toolb_01 위젯과 linee_01 위젯 사이에 넣어 주었습니다. 이 두 위젯 사이에 공백을 넣어주었다고 생각하시면 됩니다.
자, 그럼 화면 우측에 위치한 TAB_01 레이아웃을 수정해 보도록 하죠.
아래와 같이 멀티라인, 테이블 위젯 두개를 넣어주면 됩니다. 이제 어디에 넣어야 되는 지 정도를 아실 것 같아 소스 위치는 패스~~~
컴파일 후 실행해 보았습니다.
 |
| 그림 9. 레이아웃 편집 후 실행화면 |
그림 9와 같이 나타납니다. TAB_01에 멀티라인, 테이블 위젯이 삽입되어있습니다... 어라 이상하네, 멀티라인 에디터와 테이블 위젯이 TAB-01에 절반씩 차지하며 나타나는 것을 기대했는데... 뭐가 잘못되었지?
이런 형상은 Layout 생성을 잘못 하였기 때문에 발생하는 문제입니다.
pvQLayoutHbox(p,LH_Tab01,ID_MAIN_WIDGET);
LH_Tab01 레이아웃을 생성할 때 정의된 함수입니다. ID_Main_WIDGET이 모 피처로 지정되었습니다. 멀티라인과 테이블 위젯의 모 피처가 ID_Main_WIDGET일까요? 아닙니다. 테이블 위젯의 첫번째 탭이 모 피처가 되어야 제대로 작동합니다. 수정해 볼까요.
pvQLayoutHbox(p,LH_Tab01, obj3);
obj3는 탭 위젯의 첫번째 탭 위젯 이름입니다. 이름이 다른 경우 수정하시기 바랍니다. 첫번째 탭이를은 일반적인 경우 탭 위젯이 생성될 때 같이 생각되기 때문에 enum 정의에서 탭위젯 이름 다음의 이름입니다.
 |
| 그림 10.GUI 실행화면 |
간단해 보이지만, 소스 코드를 작성하는 것 다음으로 가장 많은 시간을 차지하는 부분입니다. 복잡한 화면을 레이아웃 에디터를 이용하여 수정할 때 실수도 많이 하게 됩니다. 또, 가장 큰 문제이지만 시간이 흐른 후 수정을 하려고 하면...OTL 내용이 기억나지 않을 경우 만만하지 않습니다. 그림 1과 같이레이아웃을 종이에 그려준 후 작업하시기 바랍니다.
레이아웃을 잘 사용하셔야 원하는 화면을 얻을 수 있습니다. 귀찮더라도 시간을 투자해야 하는 부분입니다. 원하는 레이아웃을 디자인 한 후 연습을 여러 번 해보시기 바랍니다.
댓글 없음:
댓글 쓰기