gwimong's blog Software Engineer

Ubuntu에서 QT프로그래밍 시작하기 #2

QT Designer로 위젯 디자인하기
2010-04-27

QT에서는 위젯을 디자인하는 것이 프로그래밍과 분리가 되어있습니다.
QT 디자이너로 비주얼 스튜디오에서 C# 폼을 디자인하듯이 위젯에 여러 컨트롤들을 손쉽게 추가할 수 있습니다.
하지만 이렇게 디자인된 위젯을 바로 적용 할 수는 없습니다. 물론 QT Creator를 이용하면 디자이너에와 연동을 하여 바로 적용이 되게 할 수는 있지만 내부적으로는 다이렉트로 연결 된 것은 아닙니다.

QT 디자이너는 디자인된 위젯을 클래스 형태의 코드로 바꿔주는것 뿐이고 이를 QT 프로그램에서 상속을 받거나 객체를 생성하여 사용하게 됩니다.

먼저 QT 디자이너를 실행 합니다.
처음 실행하면 뜨는 창으로 생성할 위젯 형식을 지정해줍니다.
img

전체적인 QT 디자이너 창입니다. 기존의 IDE들과 거의 비슷합니다.
왼쪽에 컨트롤들이 있어 이를 가운데 있는 위젯에 드래그 하면 추가됩니다.
오른쪽에 있는 속성창들을 이용하여 좀 더 세부적인 디자인을 할 수 있습니다.
img

간단하게 PushButton버튼 하나를 추가하여 저장해보겠습니다. 저장을 하면 확장자가 .ui인 파일이 생성이 됩니다. 이 파일은 위젯을 xml로 표현한 파일인데 qmake 실행시 자동으로 QT의 유저 인터페이스 컴파일러인 uic를 통해 ui_파일이름.h 파일로 변환되게 됩니다.

즉, untitled.ui로 저장을 하면 ui_untitled.h 파일로 변환되어 저장이 되는 것입니다.

이렇게 생성된 클래스를 적용하는 방법에는 2가지 방법이 있는데, 하나는 클래스를 상송 받는 것이고, 나머지 하나는 setupui()를 정의하여 이 함수를 호출하여 세팅하는 것입니다.
img

main.cpp와 untitled.ui 파일을 같은 파일에 넣은 뒤

$qmake -proect
$qmake

를 수행하면 ui_untitled.h 파일과 MakeFile이 생성됩니다.

ui_untitled.h 파일 안에 보시면 setupUi()가 정의되어 있고 이 함수에서 디자이너에서 디자인했던 컨트롤들이 생성되는 코드들이 자동으로 생성되어 들어가 있는 것을 볼 수 있습니다.
그리고 소스 밑에 보시면 namespace UI 로 지정되어 있는데 이를 이용하여 main.cpp에서 접근 하시면 됩니다.


Comments

Content