이번 강좌에서는 PyQt를 이용하여 MacOS의 Spotlight와 유사한 기능을 구현해 보겠습니다. Spotlight는 빠르고 직관적인 검색 기능을 제공하여 사용자가 필요한 자료를 신속하게 찾을 수 있도록 돕습니다. 이를 바탕으로, 우리는 PyQt를 활용하여 검색 바와 결과 리스트를 구현할 것이며, 추가적으로 부드러운 애니메이션 효과를 적용하여 시각적으로 매력적인 UI를 만들겠습니다.
1. PyQt란?
PyQt는 Python 프로그래밍 언어를 위한 Qt 라이브러리의 바인딩입니다. Qt는 C++로 작성된 크로스 플랫폼 애플리케이션 프레임워크로, GUI 애플리케이션 제작에 매우 유용합니다. PyQt는 이 Qt 라이브러리를 파이썬으로 사용할 수 있게 하며, 사용자 인터페이스를 정의하고 애플리케이션의 동작을 제어하는 데 필요한 많은 도구를 제공합니다.
2. 필요한 패키지 설치
PyQt5를 사용하려면 파이썬 환경에 PyQt5 패키지를 설치해야 합니다. pip를 사용하여 아래 명령어로 설치할 수 있습니다.
pip install PyQt53. 기본 구조
PyQt 애플리케이션의 기본 구조는 QApplication 인스턴스, 메인 윈도우, 위젯으로 구성됩니다. 위젯들은 서로 연결되어 애플리케이션의 인터페이스를 형성합니다. 이제 기본 구조를 설정해 보겠습니다.
import sys
from PyQt5.QtWidgets import QApplication, QMainWindow
class MainWindow(QMainWindow):
def __init__(self):
super().__init__()
self.setWindowTitle('Spotlight Clone')
self.setGeometry(100, 100, 800, 500)
if __name__ == '__main__':
app = QApplication(sys.argv)
window = MainWindow()
window.show()
sys.exit(app.exec_())4. 검색 바 구현
Spotlight처럼 검색 기능을 구현하기 위해 검색 바를 먼저 추가해야 합니다. QLineEdit를 사용하여 사용자가 검색어를 입력할 수 있도록 합니다.
from PyQt5.QtWidgets import QLineEdit
class MainWindow(QMainWindow):
def __init__(self):
super().__init__()
self.setWindowTitle('Spotlight Clone')
self.setGeometry(100, 100, 800, 500)
self.search_bar = QLineEdit(self)
self.search_bar.setPlaceholderText('검색어를 입력하세요...')
self.search_bar.setGeometry(20, 20, 760, 40)
5. 검색 결과 리스트 구현
이후 검색어에 따라 결과 목록을 표시할 수 있도록 QListWidget을 사용하여 검색 결과를 표시하는 기능을 추가합니다. 사용자가 입력하는 내용에 따라 결과를 업데이트해야 하므로, QLineEdit의 텍스트 변경 이벤트에 대한 슬롯을 연결합니다.
from PyQt5.QtWidgets import QListWidget
class MainWindow(QMainWindow):
def __init__(self):
super().__init__()
self.setWindowTitle('Spotlight Clone')
self.setGeometry(100, 100, 800, 500)
self.search_bar = QLineEdit(self)
self.search_bar.setPlaceholderText('검색어를 입력하세요...')
self.search_bar.setGeometry(20, 20, 760, 40)
self.results_list = QListWidget(self)
self.results_list.setGeometry(20, 80, 760, 400)
# Connect the textChanged signal to the update_results method
self.search_bar.textChanged.connect(self.update_results)
def update_results(self, text):
# 예시 데이터
items = ['PyQt5 Tutorial', 'Python Programming', 'Data Science', 'Machine Learning']
self.results_list.clear()
if text:
for item in items:
if text.lower() in item.lower():
self.results_list.addItem(item)
6. 애니메이션 효과 적용
이번 강좌의 주요 포인트 중 하나는 부드러운 애니메이션 효과를 적용하는 것입니다. PyQt에서는 QPropertyAnimation을 사용하여 위젯의 속성을 애니메이션화할 수 있습니다. 우리는 검색 바와 결과 리스트에 애니메이션 효과를 추가하여 사용자 경험을 향상시키겠습니다.
from PyQt5.QtCore import QPropertyAnimation, QRect
class MainWindow(QMainWindow):
def __init__(self):
super().__init__()
self.setWindowTitle('Spotlight Clone')
self.setGeometry(100, 100, 800, 500)
self.search_bar = QLineEdit(self)
self.search_bar.setPlaceholderText('검색어를 입력하세요...')
self.search_bar.setGeometry(20, 20, 760, 40)
self.results_list = QListWidget(self)
self.results_list.setGeometry(20, 80, 760, 0) # 초기 높이를 0으로 설정
# Connect the textChanged signal to the update_results method
self.search_bar.textChanged.connect(self.update_results)
def update_results(self, text):
# 예시 데이터
items = ['PyQt5 Tutorial', 'Python Programming', 'Data Science', 'Machine Learning']
self.results_list.clear()
if text:
for item in items:
if text.lower() in item.lower():
self.results_list.addItem(item)
# 애니메이션 효과
self.results_list.setGeometry(20, 80, 760, 0) # 초기 높이를 0으로 설정
self.results_list.show()
self.animate_results_list(400)
else:
self.animate_results_list(0)
def animate_results_list(self, height):
self.animation = QPropertyAnimation(self.results_list, b"geometry")
self.animation.setDuration(300)
self.animation.setStartValue(QRect(20, 80, 760, self.results_list.height()))
self.animation.setEndValue(QRect(20, 80, 760, height))
self.animation.start()
7. 전체 코드
이제까지 설명한 내용을 모두 포함한 전체 코드는 다음과 같습니다.
import sys
from PyQt5.QtWidgets import QApplication, QMainWindow, QLineEdit, QListWidget
from PyQt5.QtCore import QPropertyAnimation, QRect
class MainWindow(QMainWindow):
def __init__(self):
super().__init__()
self.setWindowTitle('Spotlight Clone')
self.setGeometry(100, 100, 800, 500)
self.search_bar = QLineEdit(self)
self.search_bar.setPlaceholderText('검색어를 입력하세요...')
self.search_bar.setGeometry(20, 20, 760, 40)
self.results_list = QListWidget(self)
self.results_list.setGeometry(20, 80, 760, 0) # 초기 높이를 0으로 설정
# Connect the textChanged signal to the update_results method
self.search_bar.textChanged.connect(self.update_results)
def update_results(self, text):
# 예시 데이터
items = ['PyQt5 Tutorial', 'Python Programming', 'Data Science', 'Machine Learning']
self.results_list.clear()
if text:
for item in items:
if text.lower() in item.lower():
self.results_list.addItem(item)
# 애니메이션 효과
self.results_list.setGeometry(20, 80, 760, 0) # 초기 높이를 0으로 설정
self.results_list.show()
self.animate_results_list(400)
else:
self.animate_results_list(0)
def animate_results_list(self, height):
self.animation = QPropertyAnimation(self.results_list, b"geometry")
self.animation.setDuration(300)
self.animation.setStartValue(QRect(20, 80, 760, self.results_list.height()))
self.animation.setEndValue(QRect(20, 80, 760, height))
self.animation.start()
if __name__ == '__main__':
app = QApplication(sys.argv)
window = MainWindow()
window.show()
sys.exit(app.exec_())8. 결론
이번 강좌에서는 PyQt5를 이용하여 MacOS Spotlight와 유사한 검색 기능을 구현해 보았습니다. QLineEdit와 QListWidget을 사용하여 사용자 인터페이스를 구성하였고, QPropertyAnimation을 통해 부드러운 애니메이션 효과를 추가하였습니다. 이 코드 베이스를 바탕으로 추가 기능을 구현하거나, 사용자 인터페이스를 더욱 개선하는 데 활용할 수 있습니다. PyQt의 가능성을 추구하며 여러분의 창의력을 발휘할 수 있기를 바랍니다.
이 강좌를 통해 PyQt 개발의 기초를 다질 수 있기를 바라며, 더 많은 실습과 경험을 통해 더욱 향상된 GUI를 제작하시길 바랍니다.