728x90

먼저 QPixmap 변수를 만들어 사진 경로를 지정해 줍니다. 저는 온도, 습도, 미세먼지 사진을 넣기 위해 3개의 QPixmap 변수를 생성했습니다. QPixmap을 사용하기 위해서는 QPixmap 헤더파일이 선언되어 있어야 합니다.

QPixmap tempIconPicture, humIconPicture, dustIconPicture;

tempIconPicture.load("/home/pi/Github/DJU_OSP/Raspberry/temperature.png");
humIconPicture.load("/home/pi/Github/DJU_OSP/Raspberry/hum.png");
dustIconPicture.load("/home/pi/Github/DJU_OSP/Raspberry/dust.png");

다음으로 경로를 지정한 QPixmap 변수를 setPixmap 함수를 이용해 원하는 QLabel에 넣어줍니다. 

ui->tempIcon->setPixmap(tempIconPicture.scaled(128,128,Qt::KeepAspectRatio));
ui->humIcon->setPixmap(humIconPicture.scaled(128,128,Qt::KeepAspectRatio));
ui->dustIcon->setPixmap(dustIconPicture.scaled(128,128,Qt::KeepAspectRatio));

scaled에 원하는 사이즈를 넣어주거나 생성한 라벨의 크기에 맞추려면 ui->label->width(), ui->label->height()를 이용해서 크기를 넣어줍니다.

 

Qt::KeepAspectRatio는 주어진 Label의 종횡비에 사진을 맞춰줍니다.

출처 : https://doc.qt.io/archives/qtjambi-4.5.2_01/com/trolltech/qt/core/Qt.AspectRatioMode.html

마지막으로 사진을 가운데 정렬하려면 아래코드를 사용하면 됩니다.

ui->tempIcon->setAlignment(Qt::AlignCenter);
ui->humIcon->setAlignment(Qt::AlignCenter);
ui->dustIcon->setAlignment(Qt::AlignCenter);

마지막으로 실행화면입니다.

텍스트 위에 아이콘 사진들이 추가 되었습니다. 아래 텍스트를 포함한 코드는 아래 링크를 들어가시면 보실 수 있습니다.

https://github.com/psy1064/DJU_OSP/blob/master/Raspberry/dialog.h

https://github.com/psy1064/DJU_OSP/blob/master/Raspberry/dialog.cpp

 

psy1064/DJU_OSP

대전대학교 오픈소스프로젝트. Contribute to psy1064/DJU_OSP development by creating an account on GitHub.

github.com

참고자료 

- https://m.blog.naver.com/PostView.nhn?blogId=hextrial&logNo=221109232458&proxyReferer=https%3A%2F%2Fwww.google.com%2F

 

[Qt] Label을 이용한 이미지 display

Display widgets에 있는 Label을 이용하여 GUI 상에 이미지를 보여줄 수 있다. 먼저 위와 같이 label...

blog.naver.com

 

728x90

+ Recent posts