- QtoolTip 이란?
툴팁이란 마우스가 특정 아이템 위에 올라갔을 때 뜨는 말풍선이다.
아래 이미지를 보면 마우스가 삼각형 위에 올라갔을 때 뜨는 'Triangle' 말풍선을 볼 수 있다.
이런 말풍선을 Qt에서는 QToolTip으로 쉽게 구현할 수 있게 해준다.
- QToolTip 사용 방법
QToolTip을 사용하는 방법은 크게 2가지가 있다.
먼저 QToolTip을 사용하려면 마우스가 해당 아이템 위에 들어왔다는 마우스 이벤트를 받아야 한다.
여기서, 마우스 이벤트를 받는 방식이 2가지이다.
(1) installeventfilter
위젯에 이벤트 필터를 등록하면 모든 이벤트는 이벤트필터로 가장 먼저 들어온다!
여기에서 필요 없는 이벤트는 리턴해줘서, 다른 위젯에서 받아서 처리하게 된다. <이벤트 메커니즘을 잘 이해하자>
QObject를 상속받은 아이템은 모두 eventFilter 함수를 재구현할 수 있다.
아래와 같이 이벤트를 받고 싶은 아이템에 등록하거나, 나 자신에 이벤트를 등록해서 사용할 수 있다.
// 등록 방법
installEventFilter(this);
// 함수 구현
protected:
virtual bool eventFilter(QObject *watched, QEvent *event);
virtual bool eventFilter(QObject *watched, QEvent *event)
{
Q_UNUSED(watched);
QEvent::Type type = e->type();
if( type == QEvent::ToolTip )
{
// do something
return true;
}
return QWidget::eventFilter(watched, event);
}
(2) enterEvent(QEvent* e)
해당 함수는 QWidget을 상속받은 아이템만 함수를 재구현할 수 있다.
protected:
virtual void enterEvent(QEvent *event);
virtual void leaveEvent(QEvent *event);
virtual void mouseMoveEvent(QMouseEvent *event);
- QToolTip 스타일 변경
다른 여느 위젯과 마찬가지로 stylesheet로 스타일을 변경할 수 있다.
setStyleSheet("QToolTip {"
"max-width: 100px;"
"border: 0px;"
"font-size: 13px;"
"background-color: rgb(255, 255, 255);"
"}");
- QToolTip 이미지 넣는 방법
사실 이 부분때문에 포스팅을 쓰게 됐다. (이번에 처음 알았음)
ToolTip의 멤버 함수를 보면 알 수 있듯이, QString형식의 text만 지정할 수 있다.
그런데 여기 텍스트에 html 형식으로 이미지 아이콘을 넣는 트릭으로 툴팁에 이미지가 나오도록 할 수 있다.
QToolTip::showText(QCursor::pos(), "<img src=':/icon.png'>Message", this, QRect(), 5000);진짜 천재아님? 누구야 이렇게 생각한 사람!
첫 번째 파라미터는 마우스의 현재 위치를 전달해줌으로써, 마우스 옆에 툴팁이 생길 수 있도록 해준다.
마지막 파라미터는 툴팁이 몇초동안 스크린에 띄워줄 것인지를 전달한다. 단위는 msec이다.
근데 우려되는 부분이 있다.
툴팁의 특성상 마우스가 움직일 때마다 마우스의 새로운 위치에 이미지를 그릴텐데, 부하가 있지 않을까?
(물론 크진 않을 것임...)
최적화를 해보자!
QImage icon = QImage(10, 10, QImage::Format_ARGB32);
icon.fill(QColor(255, 0, 0, 100));
QByteArray data;
QBuffer buffer(&data);
icon.save(&buffer, "PNG", 100);
QString html = QString("<img src='data:image/png;base64, %1'>").arg(QString(data.toBase64()));
QToolTip::showText(QCursor::pos(), html, this, QRect(), 5000);바로바로 이미지를 buffer에 저장해두는 것이다!!
그러면 메모리에 저장된 이미지를 보여줄 수 있다!
감~탄~ 멋지다..... 코드....
출처 : https://stackoverflow.com/questions/34296100/use-a-picture-or-image-in-a-qtooltip
