Qt Designer는 메인 윈도우나 대화 상자를 GUI를 통해서 쉽게 생성하고 디자인 해볼 수 있는 도구이다.
윈도우즈의 경우 SDK 를 설치했다면 디자이너까지 설치가 되어 있을 것이고, 우분투에서는 qt4-designer를 설치하면 된다.
디자이너를 설치한 후에 실행을 시키면 아래와 같이 창이 나오는데, 여기서는 대화 상자를 만들 것이므로 Dialog without Buttons을 선택하여 버튼 없는 대화 상자를 생성하자.
디자이너의 사용법은 매우 간단하기 때문에 자세한 설명은 필요 없기 때문에, 디자인을 수행해가는 방식에 대해서 설명을 해보겠다.
(특히, 비주얼 베이직을 해보신 분들이라면 사용하는 방법이 더욱 쉬울 것이다.)
디자인을 하는 순서는 아래와 같다.
- 원하는 위젯을 폼에 적절히 배치한다.
- 위젯의 속성을 설정한다.
- 원하는 위젯들에 대해서 1, 2를 반복한다.
- 창의 크기 조절이나 위젯 간의 공간이 필요하다면 spacer를 추가한다.
- 두 개 이상의 위젯을 선택하여 레이아웃을 배치한다.
- 모든 위젯에 대해서 5번을 반복한다.
- 폼의 전체 위젯에 대해서 레이아웃을 설정한다.
- 폼의 레이블에 대해서 버디(Buddy)를 생성한다.
- 탭 순서가 잘못 되었다면 이를 정정한다.
- 내장 시그널-슬롯을 사용하는 경우에는 이를 생성해준다.
- 폼을 미리보기 하여 점검한다.
- 폼의 객체 이름을 정해주고, 파일을 저장해준다.
많은 순서가 있어 보이지만 각각은 매우 단순한 작업이다. 여기서는 이전에 만들었던 텍스트 에디터에 "찾기 및 바꾸기" 대화 상자를 추가해보도록 하겠다.
(참고로 이것은 책에 있는 예제라서 그대로 따라가는 것이 많을 것이다.)
먼저, Label과 Line Edit를 추가하자. 일반적으로 탭 순서는 위젯의 생성 순서를 따라가므로 위젯을 옳바르게 생성하는 것이 탭 순서 교정을 피하는데 좋다.
레이블을 더블 클릭하면 텍스트를 변경할 수 있다. 그리고 이렇게 객체를 생성한 후에는 반드시 오른쪽 속성에서 objectName을 설정해주자. 이는 나중에 파이썬 모듈을 사용할 때 각 객체의 변수 명이 되기 때문이다.
예를 들어, "찾을 단어:"의 레이블은 findLabel, 이것의 라인 에디트는 findLineEdit과 같이 정해주자.
그런 다음 체크 박스를 추가하고, 마찬가지로 텍스트 변경 및 객체 이름을 지정해주자. 그리고 레이블과 콤보 박스를 추가해주자. 콤보 박스를 더블클릭하면 창이 하나 뜨는데, 여기서 + 버튼을 눌러서 아이템을 추가해줄 수 있다. 아이템으로는 문자열, 정규표현식을 추가하였다.
(
Case Sensetive 는 대소문자 구별, Whole Words는 단어 단위로 검색이다.)
그리고 창 크기를 조절했을 때 위젯은 가만히 있고 창 여백만 늘리기 위해서 콤보 박스 아래에 Vertical Spacer를 추가해주자. 그 다음 오른쪽에 버튼과 그 외 위젯을 분리한다는 것을 나타내기 위해서 Vertical Line을 추가해주었다.
그리고 마지막으로 버튼과 스페이스를 순서대로 추가해주면, 위젯 배치는 완료가 된다.
이제 레이아웃을 배치해야 하는데, 방법은 간단하다. 먼저, 위젯들을 컨트롤 키 + 왼쪽 클릭 또는 드래그를 통해서 여러 개를 선택하고, 위의 도구 상자를 보면 Lay out *** 들이 있다. 이를 클릭하면 레이아웃이 설정된다.
만약, 레이아웃을 잘못 설정했다면, Break Layout을 눌러주면 된다.
먼저, 2개의 라인 에디트와 레이블, 총 4개를 선택해서 Grid로 레이아웃 해주자. 그리고 체크박스끼리 Horizontal 로 배치해주고, 레이블과 콤보박스도 Horizontal로 배치해주자. 그 다음 왼쪽에 있는 모든 위젯(스페이스 포함)들을 모두 선택해서 Vertical로 배치해주고, 버튼들도 묶어서 Vertical로 배치해주자.
그런 다음 폼을 선택하면 선택이 해제가 되는데, 이 상태에서 Horizontal을 누르면 모든 위젯들을 묶어서 수평 배치해준다.
이렇게 하면 레이아웃 배치도 완료되고, 위젯들도 깔끔하게 배치된다. 만약, 창의 크기가 크다면 작게 줄여서 보기 좋게 해준다.
이 상태에서 컨트롤 + R 또는 Form > Preview를 해주면, 대화 상자를 미리 볼 수 있다.
이제 Buddy를 지정해야 하는데, 도구 상자에 보면 Edit Buddies가 있다. 이를 클릭해준 다음 레이블을 클릭한 상태에서 알맞은 다른 위젯으로 드래그 해주자.
그러면 화살표가 다른 위젯으로 가리키면서 Buddy가 되었다는 것을 알려준다. 이렇게 하고나면 레이블에 &S와 같이 되어 있던 텍스트에서 &가 사라지고 밑줄로 변경된다.
탭 순서도 변경할 수 있는데, 위젯을 제대로 생성하였다면 자동으로 깔끔하게 설정되어 있을 것이다. 일단, 변경 방법은 도구 상자에서 Edit Tab Order를 클릭하여 번호를 클릭하여 알맞게 변경시켜주면 된다.
이제 시그널과 슬롯을 지정해주어야 하는데, 여기서 "닫기"를 제외한 나머지 버튼을 따로 슬롯을 생성해주어야 하므로 여기서 지정할 수는 없고, "닫기"의 경우 폼에 reject 슬롯과 연결이 되기 때문에 여기서 바로 지정할 수 있다.
도구 상자에서 Edit Signals/Slots을 클릭하고 Buddy를 지정한 것처럼, "닫기" 버튼을 클릭한 상태에서 "폼"의 아무 곳으로 드래그를 해주면 가능한 시그널과 슬롯이 나타난다.
여기서 clicked 시그널과 reject 슬롯을 선택해주면 시그널, 슬롯이 연결된다.
이제 모든 디자인이 완료되었다. 마지막으로 폼을 선택해서 오른쪽에 objectName을 지정해주자. 이것은 대화 상자의 클래스 이름이 된다. 그리고 아래에서 windowTitle을 찾아서 대화상자의 제목을 설정해주자.
그리고 저장(Ctrl + S)을 해서 디자인한 대화 상자를 저장해주면 완료가 된다.
이로써 아주 간단하게 대화 상자를 생성할 수 있었다. 이전에는 이 작업을 모두 코드로 타이핑 해야 했지만, 간단하게 마우스로 대화 상자 디자인을 보면서 할 수 있었다.
이 외에 내용들은 책에도 문서를 참고하라고 되어 있으므로 문서를 통해서 더 자세한 설명과 Custom(사용자) 위젯을 만들 수도 있을 것이다.
이것으로 디자인 내용에 대해서는 마치고 다음 글에서 이를 파이썬에서 사용하는 방법을 설명하겠다.
댓글 없음:
댓글 쓰기