Qt는 컴퓨터 프로그래밍에서GUI프로그램 개발에 널리 쓰이는 오픈 소스C++개발프레임워크이다. C++와 QML이라는 자체 스크립트 언어를 기반으로 한다. 회사 내부에서는 Qt를 "cute"로 발음하고 있으며 비공식적으로는 "큐티"로 발음한다. Qt는KDE,Qtopia,OPIE에 이용되고 있다.
"Write once, compile anywhere"를 표방하는 크로스 플랫폼 프레임워크이며, 현존하는 주요 플랫폼(Windows, Linux, OSX, Android, iOS 등)을 거의 대부분 지원한다. 초기에는 크로스플랫폼GUI 라이브러리로 시작하였으나, 점점 기능이 확대되어 각종 UI 개발 도구, 번역 작업을 위한 도구와 C++ 개발에 필요한 온갖 기능(UI,XML, 네트워크,SVG, Animation, Container Class 등등)을 제공하는 종합 프레임워크가 되었다
Qt는C++를 주로 사용하지만,파이썬,루비,C,펄,파스칼과도 연동된다. 수많은 플랫폼에서 동작하며, 상당히 좋은 국제화를 지원한다.SQL데이터베이스 접근,XML처리,스레드관리, 단일 크로스 플랫폼 파일 관리API를 제공한다.
void TreeDialog::on_itemClicked(QTreeWidgetItem *item, int column)
{
displayCurrentItem(item, column);
}
displayCurrentItem 함수
void TreeDialog::displayCurrentItem(QTreeWidgetItem *item, int column)
{
if (item) {
ui->labelCurrentItem->setText(item->data(column, Qt::DisplayRole).toString());
}
}
클릭한 데이터 행을 위/아래로 옮기기
아이템 클릭 후, Up 또는 Down 버튼을 누르면, 해당 아이템을 위로 올리거나 아래로 내린다.
enum Direction {
Up = -1,
Down = 1
};
void TreeDialog::on_pushButtonUp_clicked()
{
moveItem(Direction::Up);
}
void TreeDialog::on_pushButtonDown_clicked()
{
moveItem(Direction::Down);
}
void TreeDialog::moveItem(Direction direction)
{
QTreeWidgetItem *item = ui->treeWidget->currentItem();
if (!item)
return;
int row = ui->treeWidget->currentIndex().row();
if ((direction == Direction::Up) && (row <= 0)) // 더 이상 올라갈 곳이 없음
return;
int lastRow = 0;
QTreeWidgetItem *parent = item->parent();
if (parent)
lastRow = parent->childCount() -1;
else
lastRow = ui->treeWidget->topLevelItemCount() - 1;
if ((direction == Direction::Down) && (row == lastRow)) // 더 이상 내려갈 곳이 없음
return;
int upDownIdx = static_cast<int>(direction);
int index;
if (parent) { // 하위 아이템의 경우
index = parent->indexOfChild(item);
QTreeWidgetItem *child = parent->takeChild(index); // 선택된 아이템을 부모에서 분리하고
parent->insertChild(index + upDownIdx, child); // 옮긴 위치에 다시 insert 한다
ui->treeWidget->setCurrentItem(child);
parent->setExpanded(true);
child->setExpanded(true);
}
else { // 최상위 레벨 아이템의 경우
index = ui->treeWidget->indexOfTopLevelItem(item);
QTreeWidgetItem *child = ui->treeWidget->takeTopLevelItem(index); // 선택된 아이템을 부모에서 분리하고
ui->treeWidget->insertTopLevelItem(index + upDownIdx, child); // 옮긴 위치에 다시 insert 한다
ui->treeWidget->setCurrentItem(child);
child->setExpanded(true);
}
}
전체 소스코드
treedialog.h
#ifndef TREEDIALOG_H
#define TREEDIALOG_H
#include <QDialog>
#include <QTreeWidgetItem>
enum Direction {
Up = -1,
Down = 1
};
namespace Ui {
class TreeDialog;
}
class TreeDialog : public QDialog
{
Q_OBJECT
public:
explicit TreeDialog(QWidget *parent = nullptr);
~TreeDialog();
void moveItem(Direction direction);
void displayCurrentItem(QTreeWidgetItem *item, int column);
private slots:
void on_pushButtonAddParent_clicked();
void on_pushButtonAddChild_clicked();
void on_pushButtonDel_clicked();
void on_pushButtonUp_clicked();
void on_pushButtonDown_clicked();
void on_itemClicked(QTreeWidgetItem *item, int column);
private:
Ui::TreeDialog *ui;
};
#endif // TREEDIALOG_H
treedialog.cpp
#include "treedialog.h"
#include "ui_treedialog.h"
#include <QMessageBox>
TreeDialog::TreeDialog(QWidget *parent) :
QDialog(parent),
ui(new Ui::TreeDialog)
{
ui->setupUi(this);
ui->treeWidget->setColumnCount(2); // QTreeWidget을 열을 2개로 설정
// 헤더 설정
QStringList headers;
headers << tr("Col 1") << tr("Col 2");
ui->treeWidget->setHeaderLabels(headers);
// 데이터(아이템) 추가
QTreeWidgetItem *cities = new QTreeWidgetItem(ui->treeWidget); // 첫번째 부모
cities->setText(0, tr("Cities"));
cities->setText(1, tr(" - "));
QTreeWidgetItem *osloItem = new QTreeWidgetItem(cities); // 첫번째 부모의 첫번째 자식(row 1)
osloItem->setText(0, tr("Oslo"));
osloItem->setText(1, tr("No"));
QTreeWidgetItem *seoulItem = new QTreeWidgetItem(cities); // 첫번째 부모의 두번째 자식(row 2)
seoulItem->setText(0, tr("Seoul"));
seoulItem->setText(1, tr("Yes"));
cities->setExpanded(true);
QTreeWidgetItem *colors = new QTreeWidgetItem(ui->treeWidget); // 두번째 부모
colors->setText(0, tr("Colors"));
// 아이템을 수정 가능하게 함 - ItemIsEditable 플래그를 설정해주면 아이템을 더블 클릭시 수정 가능해짐
colors->setFlags(Qt::ItemIsEnabled | Qt::ItemIsEditable | Qt::ItemIsSelectable);
QTreeWidgetItem *redItem = new QTreeWidgetItem(colors); // 두번째 부모의 첫번째 자식(row 1)
redItem->setText(0, tr("Red"));
redItem->setText(1, tr("1"));
redItem->setFlags(Qt::ItemIsEnabled | Qt::ItemIsEditable | Qt::ItemIsSelectable);
QTreeWidgetItem *yellowItem = new QTreeWidgetItem(colors); // 두번째 부모의 두번째 자식(row 1)
yellowItem->setText(0, tr("Yellow"));
yellowItem->setText(1, tr("2"));
yellowItem->setFlags(Qt::ItemIsEnabled | Qt::ItemIsEditable | Qt::ItemIsSelectable);
yellowItem->setHidden(true); // 아이템을 숨김(화면에 표시 안함)
QTreeWidgetItem *greenItem = new QTreeWidgetItem(colors); // 두번째 부모의 첫번째 자식(row 1)
greenItem->setText(0, tr("Green"));
greenItem->setText(1, tr("1"));
greenItem->setFlags(Qt::ItemIsEnabled | Qt::ItemIsEditable | Qt::ItemIsSelectable);
colors->setExpanded(true);
connect(ui->treeWidget, &QTreeWidget::itemClicked, this, &TreeDialog::on_itemClicked);
// ui->treeWidget->setSortingEnabled(true); // 헤더 클릭 시 오름/내림차순 정렬되게 함
displayCurrentItem(ui->treeWidget->currentItem(), 0);
}
TreeDialog::~TreeDialog()
{
delete ui;
}
void TreeDialog::on_pushButtonAddParent_clicked()
{
// 최상위 아이템을 추가함
QTreeWidgetItem *parent = new QTreeWidgetItem(ui->treeWidget);
parent->setText(0, ui->lineEditCol1->text());
parent->setText(1, ui->lineEditCol2->text());
}
void TreeDialog::on_pushButtonAddChild_clicked()
{
// 선택된 아이템 하위에 데이터를 추가함
// QTreeWidget은 SingleSelection만 허용하도록 설정해놓았음
QList<QTreeWidgetItem*> parent = ui->treeWidget->selectedItems();
if (parent.size() > 0) {
QTreeWidgetItem *child = new QTreeWidgetItem(parent[0]);
child->setText(0, ui->lineEditCol1->text());
child->setText(1, ui->lineEditCol2->text());
child->setFlags(Qt::ItemIsEnabled | Qt::ItemIsEditable | Qt::ItemIsSelectable);
parent[0]->setExpanded(true);
}
else {
QMessageBox::information(this, tr("Info"), tr("Please select the parent item"), QMessageBox::Ok);
}
}
void TreeDialog::on_pushButtonDel_clicked()
{
QTreeWidgetItem *item = ui->treeWidget->currentItem();
int index;
if (item) {
QTreeWidgetItem *parent = item->parent();
if (parent) { // 하위 아이템 삭제
index = parent->indexOfChild(item);
delete parent->takeChild(index);
}
else { // 최상위 레벨 아이템 삭제
index = ui->treeWidget->indexOfTopLevelItem(item);
delete ui->treeWidget->takeTopLevelItem(index);
}
}
else {
QMessageBox::information(this, tr("Info"), tr("Please select the item"), QMessageBox::Ok);
}
}
void TreeDialog::on_pushButtonUp_clicked()
{
moveItem(Direction::Up);
}
void TreeDialog::on_pushButtonDown_clicked()
{
moveItem(Direction::Down);
}
void TreeDialog::on_itemClicked(QTreeWidgetItem *item, int column)
{
displayCurrentItem(item, column);
}
void TreeDialog::moveItem(Direction direction)
{
QTreeWidgetItem *item = ui->treeWidget->currentItem();
if (!item)
return;
int row = ui->treeWidget->currentIndex().row();
if ((direction == Direction::Up) && (row <= 0)) // 더 이상 올라갈 곳이 없음
return;
int lastRow = 0;
QTreeWidgetItem *parent = item->parent();
if (parent)
lastRow = parent->childCount() -1;
else
lastRow = ui->treeWidget->topLevelItemCount() - 1;
if ((direction == Direction::Down) && (row == lastRow)) // 더 이상 내려갈 곳이 없음
return;
int upDownIdx = static_cast<int>(direction);
int index;
if (parent) { // 하위 아이템의 경우
index = parent->indexOfChild(item);
QTreeWidgetItem *child = parent->takeChild(index); // 선택된 아이템을 부모에서 분리하고
parent->insertChild(index + upDownIdx, child); // 옮긴 위치에 다시 insert 한다
ui->treeWidget->setCurrentItem(child);
parent->setExpanded(true);
child->setExpanded(true);
}
else { // 최상위 레벨 아이템의 경우
index = ui->treeWidget->indexOfTopLevelItem(item);
QTreeWidgetItem *child = ui->treeWidget->takeTopLevelItem(index); // 선택된 아이템을 부모에서 분리하고
ui->treeWidget->insertTopLevelItem(index + upDownIdx, child); // 옮긴 위치에 다시 insert 한다
ui->treeWidget->setCurrentItem(child);
child->setExpanded(true);
}
}
void TreeDialog::displayCurrentItem(QTreeWidgetItem *item, int column)
{
if (item) {
ui->labelCurrentItem->setText(item->data(column, Qt::DisplayRole).toString());
}
}
어플리케이션을 개발하다 보면 Tree 구조 형태의 데이터를 보여주어야 하는 일들이 있다. (예 : 파일 탐색기 등)
Qt에서는 이러한 Tree 구조 데이터를 보여줄 수 있는 수단으로 QTreeWidget과 QTreeView라는 클래스를 제공한다.
그럼 이 둘의 차이점은 무엇이고, 언제 어떤 클래스를 사용해야 할까?
QTreeWidget과 QTreeView의 차이점
가장 큰 차이는, 데이터가 어디에 저장되는가와 데이터와 뷰의 분리가 가능한가 이다.
QTreeWidget은,
Qt 초기 버전에서 사용되던 클래스로, 데이터가 위젯 내에 존재한다. 사용자는 위젯 내에 존재하는 데이터에 대해 검색과 편집을 수행하고, 어느 시점엔가 변경된 내용을 원본 데이터에 기록하곤 했다.
장점: 이 방식은 이해와 사용이 간단하다.
단점:크기가 큰 데이터 집합은 위젯 내에 데이터를 모두 보유하기 부담스러워지기 시작했고, 동일한 데이터를 둘 이상의 서로 다른 위젯에 출력하고자 하는 상황에는 적합하지 않았다. (같은 데이터를 동시에 두 화면 - 트리 형태로 보여주는 화면과, 테이블 형태로 보여주는 화면 - 에 보여주려고 하면 힘들었다. 데이터가 위젯에 각각 저장되어 있기 때문에 어느 한쪽에서 변경 시 두 화면 사이의 싱크를 맞춰주기가 힘들었음)
QTreeView는,
이러한 QTreeWidget의 단점을 보완하기 위해 만들어진 클래스로, MVC 패턴에서 영감을 받은 모델/뷰 아키텍처의 '뷰' 부분이다. 쉽게 말하면 데이터를 다루는 모델 부분과, 데이터를 화면에 출력하는 뷰 부분을 분리하여 운영하는 것이다.
데이터는 '모델 클래스' 한 곳에서 관리하고, 이 모델에 연결된 여러개의 '뷰 클래스'를 만듦으로써 동일한 데이터를 여러 화면에서 보여주는 것을 가능하게 했다. 따라서 '모델'에서만 데이터를 변경 하면, 여러개의 '뷰'에 동시에 반영이 될 수 있게 된 것이다.
또한, 모델에 아무리 큰 집합의 데이터가 있어도, 각 뷰에서는 자신이 보여줄 부분의 데이터만 가져와서 보여주면 되어 뷰의 성능이 획기적으로 향상되게 된다.
이러한 개념은 QListWidget과 QListView, QTableWidget과 QTableView에도 동일하게 적용된다. (각각 보여지는 형태가 리스트 형태인지, 테이블 형태인지만 달라질 뿐이다.)
QListWidget과 QTableWidget은 데이터를 위젯 내에 저장하고 / QListView와 QTableView는 데이터가 저장된 모델에 연동되어 화면을 보여줄 수 있는 뷰 클래스이다.
언제 어떤 클래스를 사용해야 할까?
QTreeWidget (또는 QListWidget, QTableWidget) 을 사용하는 경우
데이터 집합이 작고, 동시에 여러군데서 보여질 필요 없이,간단히 구현이 필요할 때 사용한다.
데이터 저장/변경/화면에 표시가 하나의 위젯에서 이루어지므로 QTreeView에 비해 상대적으로 구현이 간단하다.
QTreeView (또는 QListView, QTableView) 를 사용하는 경우
QTreeWidget과 반대로, 데이터 집합이 큰 경우, 같은 데이터를 동시에 여러 뷰에서 보여주어야 하는 경우에 적합하다.
(개발 시 데이터를 다루는 '모델' 클래스를 만들고, 뷰와 연동시켜야 한다.)
델리게이트라는 개념을 통해 데이터가 View에서 보여지는 형태를 조금 더 세밀히 조정할 수도 있다.
어느 쪽이든 본인이 개발하는 소프트웨어에 가장 적합한 것을 선택하는 것이 현명한 방법이다.
