안녕하세요.
이전 글은 Qt 설치와 화면 설계에 대해서 했다면, ImageViewer에 실제 코드를 넣어 보아야 합니다. 공개된 소스를 가지고 할 것이기 때문에 구현된 내용에 대해서 간단하게 설명드리겠습니다.
빠르게 보면서 필요한 부분만 읽어 보시면 될 것 같습니다.
1. 화면 코드 (User Interface)
- QMainWindow를 상속받은 MainWindow기반으로 해서 화면이 구성이됩니다. .ui 파일에서 화면 설계를 한 것이 아니라, 코딩으로 화면을 설계를 해두었습니다.
- 상위 두 개의 툴바가 있고 그곳에 메뉴를 생성해주기 위한 QMenu 2개 변수가 2개가 있습니다.
QMenu *fileMenu;
QMenu *viewMenu;
QToolBar *fileToolBar;
QToolBar *viewToolBar;
- 이미지를 보여주기 위한 View 클래스 변수
QGraphicsScene *imageScene;
QGraphicsView *imageView;
- 하단 상태를 표기해주는
QToolBar *fileToolBar;
QToolBar *viewToolBar;
- 위의 변수들을 가지고 화면을 구성하기 위해서 initUI() 함수에서 화면을 생성해주고 있습니다. 메인화면 사이즈를 초기화 등 화면 생성에 필요한 클래스들을 연결시켜 줍니다. 그리고 createAction() 함수를 호출해서 상세한 기능들을 정의합니다.
this->resize(800, 600); // MainWindow
fileMenu = menuBar()->addMenu("&File");
viewMenu = menuBar()->addMenu("&View");
fileToolBar = addToolBar("File");
viewToolBar = addToolBar("View");
...
createAction();
- createAction() 함수에서 하위 메뉴를 생성(Sender)하고 하위 메뉴와 실제 동작할 한 수들을 연결시켜 주는 함수 connect() 함수가 실행됩니다. 그리고 실행 후 단축키 수행하는 함수를 실행합니다.
여기서 openAction 변수는 mainwindow.h 파일에 미리 정의를 해 놓은 것입니다. QAction *openAction;
예) 열기를 클릭할 경우를 위해서,
openAction = new QAction("&Open", this);
fileMenu->addAction(openAction);
fileToolBar->addAction(openAction);
connect(openAction, SIGNAL(triggered(bool)), this, SLOT(openImage()));
2. 구현 (Implementing the functions for the actions)
- Qt 툴 메커니즘 connect라는 것으로 이루어져 있기 때문에 handler와 Signal이라는 것으로 이루어져 있습니다. 위젯을 사용하면 각종 시그널들을 발생합니다. 그러면 시그널과 연결된 slot(함수)들이 수행됩니다.
예) openAction의 connect을 보면
connect(openAction, SIGNAL(triggered(bool)), this, SLOT(openImage()));
triggered(bool)로 되어 있는데 이것은 QAction 선언된 변수에 발생할 수 있는 시그널들이 정의가 되어 있기 때문에 사용하고 있습니다.
qaction.h 내용 중
Q_SIGNALS:
void changed();
void triggered(bool checked = false);
void hovered();
void toggled(bool);
- connect() 함수는 4개 인자로 되어 있고, 쉽게 번역하자면 connect(보내는 객체, 발생 신호, 받는 객체, 수행할 함수) 정도가 되지 않을까 합니다.
3. 기능 구현 함수 설명
- 함수들은 소스를 보면 알 수 있기 때문에 간단하게 설명이 필요한 부부만 추가로 설명해 보겠습니다.
1) 이미지 열기(Opening an Image)
- OpenImage() 함수는 이미지 파일을 불러올 수 있게 다이얼로그 창을 실행해 줍니다. 여기서 setNameFilter 옵션으로 필요한 이미지 확장자만 선택되게 하고, exec로 다이얼로그 창을 실행됩니다. Open을 할 경우 선택된 경로를 포함한 파일리스트가 filePaths에 들어가는데 여기서는 파일 하나만 선택하게 되어 있습니다.
- ShowImage() 함수는 이미지 경로를 QPixmap으로 불러서 VIew 쪽으로 전달하고 있습니다. 그리고 QString 클래스에 %1, %2 인자로 만들어 각종 이미지 정보를 상태 표시줄에 나타내고 있습니다.
QString status = QString("%1, %2x%3, %4 Bytes").arg(path).arg(image.width())
.arg(image.height()).arg(QFile(path).size());
2) 확대와 축소 (Zoom in and out)
- Zoom In과 Zoom out은 간단하게 ImageView에서 제공해 주는 Scale 함수로 가능합니다. 너비와 높이 비율을 넣으면 확대, 축소가 됩니다. 확대하고자 한다면, 120%->1.2 축소한다고 하면 80% ->0.8을 입력하면 됩니다.
imageView->scale(1.2, 1.2);
3) 복사본 저장 (Saving a copy)
- saveAs() 함수에서 먼저 다이얼로그 창을 실행시켜서 저장할 경로와 파일 이름을 획득한 후 QPixmap 클래스의 save()를 통해서 이미지를 저장합니다.
currentImage->pixmap().save(fileNames.at(0));
4) 이전, 다음 이미지 보기 (Navigating in the folder)
- prevImage(), nextImage() 함수를 통해서 현재 이미지의 폴더를 기준으로 해서 이미지 파일 리스트를 만들고 리스트에 인덱스를 움직이게 함으로써 이전, 다음 이미지로 변경되는 것처럼 처리되어 있습니다.
showImage(dir.absoluteFilePath(fileNames.at(idx - 1)));
이것으로 간단한 이미지 뷰어 프로그램이 끝나고 이것을 기반으로 해서 다음 편부터 OpenCV 설치 및 처리 내용 진행됩니다.
감사합니다.
<참고 사이트>
1. Qt-5-and-OpenCV-4-Computer-Vision-Projects book
https://www.packtpub.com/product/qt-5-and-opencv-4-computer-vision-projects/9781789532586
2. Qt-5-and-OpenCV-4-Computer-Vision-Projects – github source chapter 01