[Python/GUI] PySide GUI에서 로딩 GIF 이미지 표시하기

 

Pyside6로 GUI 프로그래밍을 하고 있는데, 모드 ON/OFF일 때 상태를 나타내는 인디케이터를 구현해보았다.

 

제스처 모드는 초록색 인디케이터로, 음성 인식은 주황색 인디케이터로 지정해 모드가 켜져 있는지 확인을 쉽게 할 수 있다.

 

하지만, 음성 인식은 실행과 동시에 바로 시작되는게 아니라, 모델을 불러오기까지 시간이 걸리기 때문에 이를 위해 로딩 애니메이션을 넣으면 좋을 것 같았다.

 

1. 먼저 맘에 드는 로딩 애니메이션 GIF를 찾자.

Loading GIF | Tenor

나는 해당 링크에서 쉽게 필요한 GIF를 찾을 수 있었다.

 

2. 다운로드하고, 필요한 경우 Resize 한다.

PyQt, PySide 자체적으로 setFixedSize() 를 가지고 표시되는 이미지 크기를 줄일 수 있지만 해당 이미지가 줄이고자 하는 사이즈보다 큰 경우 잘리게 된다. 따라서 미리 필요한 크기를 대강 정한다음 GIF 이미지를 resize 한다.

Online image resizer. Resize GIF, APNG, WebP, JPG...

여기서 Width, Height에 각각 원하는 픽셀값을 주고 Resize image!를 누르면 된다.

 

3. QMovie 사용해서 로딩 GIF 불러오기

from PySide6.QtGui import QMovie
from PySide6.QtWidgets import QMainWindow, QLabel

...

class MainWindow(QMainWindow):
	def __init__(self):
    	super(MainWindow, self).__init__()
        
        # 로딩 애니메이션 설정
        self.loading_label = QLabel(self)
        self.loading_movie = QMovie('resources/loading.gif')
        self.loading_label.setMovie(self.loading_movie)
        self.loading_label.setFixedSize(22, 22)
        
        ...

 

Resize한 GIF를 프로젝트 디렉토리의 resources/loading.gif 위치에 저장하였다.

QMovie를 사용해서 해당 파일을 불러온 다음, QLabel에 연결시킨다. setMovie() 함수를 사용하였음.

그리고 마지막으로 setFixedSize() 로 크기 조절을 하면 완료.

 

나는 기본적으로 loading_label을 숨겨놓았다가 음성 인식 버튼이 토글 될 때 마다 완전히 켜지기 전까지 동작하도록 해 놓았다.

QLabel은 이렇게 숨길 수 있다.

self.loading_label.hide()

 

이렇게 숨긴 GIF QLabel을 작동할 때는 다음과 같이 코드를 작성한다.

self.loading_label.show()
self.loading_movie.start()

QMovie 객체 start를 하지 않으면 아예 안보임

 

로딩이 다 되었을 경우에 다시 없애줘야 하니까 다음과 같이 코드를 작성한다.

self.loading_movie.stop()
self.loading_label.hide()