3강. QSlider 값 전달 예제
0. 학습 목표
이번 단계에서는 QSlider 슬라이더 위젯을 사용하여 Qt의 Signal / Slot 구조를 다시 살펴봅니다.
앞에서는 QPushButton을 기준으로 버튼 클릭 Signal을 학습했습니다.
이번에는 슬라이더 값을 움직일 때 발생하는 valueChanged(int) Signal을 사용합니다.
핵심은 Signal / Slot 구조가 버튼에서만 사용되는 것이 아니라, 슬라이더 같은 다른 위젯에서도 동일하게 동작한다는 점입니다.
| 학습 목표 | 내용 |
| QSlider 이해 | 슬라이더를 움직여 숫자 값을 조절하는 위젯 구조를 이해합니다. |
| valueChanged(int) Signal 이해 | 슬라이더 값이 변경될 때 int 값이 Signal로 전달되는 구조를 이해합니다. |
| 값 전달 구조 이해 | Signal이 발생하면서 값(Data)을 Slot 함수에 자동 전달하는 원리를 이해합니다. |
| Slot 함수 매개변수 이해 | Slot 함수에서 전달된 정수 값을 매개변수로 받아 처리하는 방법을 학습합니다. |
| 다양한 위젯의 Signal / Slot 이해 | Signal / Slot 구조가 버튼 외에도 다양한 위젯에서 동일하게 작동함을 이해합니다. |
이번 단계의 핵심
슬라이더 값을 변경하면 valueChanged(int) Signal이 발생하고, 변경된 숫자 값이 Slot 함수의 매개변수로 자동 전달됩니다.
1. Signal / Slot 개념 이해하기
1.1 QSlider 위젯 이해하기
이번 예제에서는 QSlider를 사용합니다.
QSlider는 막대 위의 손잡이를 움직여 값을 조절하는 위젯입니다.
볼륨 조절, 밝기 조절, 진행률 조절처럼 사용자가 숫자 값을 직접 조절해야 하는 화면에서 자주 사용됩니다.
| 구분 | 설명 |
| QSlider | 막대를 드래그하여 값을 조절하는 위젯입니다. |
| Qt.Horizontal | 슬라이더를 가로 방향으로 표시합니다. |
| Qt.Vertical | 슬라이더를 세로 방향으로 표시합니다. |
| setMinimum() | 슬라이더의 최소값을 설정합니다. |
| setMaximum() | 슬라이더의 최대값을 설정합니다. |
| setValue() | 슬라이더의 초기값을 설정합니다. |
이번 예제에서는 1부터 100까지 움직일 수 있는 가로 방향 슬라이더를 만들고, 초기값은 25로 설정합니다.
슬라이더 이동
↓
슬라이더 값 변경
↓
valueChanged(int) Signal 발생
↓
변경된 숫자 값이 Slot 함수로 전달
1.2 Signal
Signal은 어떤 일이 발생했다는 것을 알려주는 신호입니다.
QSlider에서는 슬라이더 값이 변경될 때마다 valueChanged(int) Signal이 발생합니다.
valueChanged(int) Signal은 단순히 값이 바뀌었다는 사실만 알려주는 것이 아닙니다.
변경된 슬라이더의 현재 값을 int 값으로 함께 전달합니다.
슬라이더 값이 25에서 26으로 변경됨
↓
valueChanged(26) Signal 발생
↓
26이라는 int 값이 Slot 함수로 전달됨| 구분 | 설명 |
| Signal | 어떤 일이 발생했음을 알려주는 신호입니다. |
| valueChanged(int) | 슬라이더 값이 변경될 때 int 값을 함께 전달하는 Signal입니다. |
| 전달 값 | 슬라이더의 현재 숫자 값입니다. |
| 예시 | 슬라이더 값이 50이면 Slot 함수로 50이 전달됩니다. |
1.3 Slot
Slot은 Signal이 발생했을 때 실행되는 함수입니다.
이번 예제에서는 valueChanged(int) Signal이 전달하는 정수 값을 Slot 함수가 매개변수로 받습니다.
def respond_to_slider(data):
print("슬라이더 값 변경 :", data)여기서 data는 valueChanged(int) Signal이 전달한 숫자 값을 받는 매개변수입니다.
사용자가 슬라이더를 움직일 때마다 최신 숫자 값이 data로 자동 전달됩니다.
주의할 점
Signal이 int 값을 전달하는 경우, Slot 함수는 그 값을 받을 수 있도록 매개변수를 준비해야 합니다.
1.4 connect()
connect()는 Signal과 Slot을 연결하는 메서드입니다.
slider.valueChanged.connect(respond_to_slider)
위 코드는 다음과 같은 의미입니다.
slider의 valueChanged(int) Signal이 발생하면
↓
변경된 슬라이더 값이 int로 전달되고
↓
respond_to_slider(data) 함수가 자동으로 실행된다| 개념 | 설명 |
| Signal | 이벤트 발생을 알리는 신호입니다. 예: valueChanged(int) |
| Slot | Signal을 받았을 때 실행되는 함수입니다. |
| data | Signal이 전달한 슬라이더의 현재 숫자 값을 받는 매개변수입니다. |
| connect() | Signal과 Slot을 연결하고, Signal의 값을 Slot으로 전달하는 구조를 만듭니다. |
2. 예제 코드
2.1 실습 준비
이번 예제는 PyCharm에서 진행합니다.
새 Python 프로젝트를 만들고, 프로젝트 가상환경에 PySide6가 설치되어 있는 상태에서 진행합니다.
예제 파일명은 main.py로 작성합니다.
2. PyCharm 프로젝트 생성
1. 일반 프로젝트 생성하기더보기 2. 커스텀 가상환경으로 프로젝트 시작하기 더보기 PyCharm에서 Custom environment를 선택하는 이유 기본 Project venv를 그대로 사용하지 않고, Virtualenv, Conda, Poetry, uv 같
basiclike.tistory.com
2.2 main.py 예제 코드
import sys
from PySide6.QtCore import Qt
from PySide6.QtWidgets import QApplication, QSlider
def respond_to_slider(data):
print("슬라이더 값 변경 :", data)
app = QApplication(sys.argv)
slider = QSlider(Qt.Horizontal)
slider.setMinimum(1)
slider.setMaximum(100)
slider.setValue(25)
slider.valueChanged.connect(respond_to_slider)
slider.show()
sys.exit(app.exec())
이 코드를 실행하면 화면에 가로 방향 슬라이더가 나타납니다.
슬라이더를 움직일 때마다 PyCharm 실행창에 현재 슬라이더 값이 출력됩니다.
슬라이더 값 변경 : 26
슬라이더 값 변경 : 27
슬라이더 값 변경 : 28
2.3 예제에서 확인할 핵심 구조
| 코드 | 의미 |
| QSlider(Qt.Horizontal) | 가로 방향 슬라이더 위젯을 생성합니다. |
| setMinimum(1) | 슬라이더의 최소값을 1로 설정합니다. |
| setMaximum(100) | 슬라이더의 최대값을 100으로 설정합니다. |
| setValue(25) | 슬라이더의 초기값을 25로 설정합니다. |
| valueChanged(int) | 슬라이더 값이 변경될 때 int 값을 전달하는 Signal입니다. |
| respond_to_slider(data) | Signal이 전달한 int 값을 data 매개변수로 받는 Slot 함수입니다. |
| connect() | Signal과 Slot을 연결하고, Signal이 전달한 값을 Slot 함수로 전달합니다. |
2.4 예제 파일
예제 파일은 main.py로 저장합니다.
3. 코드 분석
3.1 주석 포함 전체 코드
import sys # [1] 파이썬 인터프리터 관련 기능을 제공하는 sys 모듈을 가져옴
from PySide6.QtCore import ( # [2] PySide6의 핵심 기능 관련 클래스들 중에서
Qt # - Qt: 방향, 정렬, 키 값 등 Qt에서 사용하는 공통 상수 제공
)
from PySide6.QtWidgets import ( # [3] PySide6의 위젯 관련 클래스들 중에서
QApplication, # - QApplication: 전체 어플리케이션(프로그램)을 관리하는 클래스
QSlider # - QSlider: 값을 조절할 수 있는 슬라이더 위젯 클래스
)
# [4] valueChanged(int) Signal에서 전달된 값을 받을 Slot 함수 정의
# - data 매개변수는 Signal이 전달하는 정수 값을 받음
# - 슬라이더를 움직일 때마다 현재 값이 data로 전달됨
def respond_to_slider(data):
print("슬라이더 값 변경 :", data) # [5] 슬라이더 값이 변경될 때 현재 값을 출력
app = QApplication(sys.argv) # [6] QApplication 객체 생성
# - 모든 Qt GUI 프로그램은 QApplication 객체가 필요함
# - sys.argv: 실행 시 명령줄 인자 리스트
# (예: python main.py arg1 arg2 ...)
# - 일부 Qt/PySide 옵션을 명령줄에서 받을 수 있기 때문에
# 관례적으로 sys.argv를 넣어 줌
slider = QSlider(Qt.Horizontal) # [7] 가로 방향 슬라이더 위젯 생성
# - Qt.Horizontal: 슬라이더를 가로 방향으로 표시
# - Qt.Vertical: 슬라이더를 세로 방향으로 표시할 때 사용
slider.setMinimum(1) # [8] 슬라이더의 최소값을 1로 설정
slider.setMaximum(100) # [9] 슬라이더의 최대값을 100으로 설정
slider.setValue(25) # [10] 슬라이더의 초기값을 25로 설정
slider.valueChanged.connect(respond_to_slider) # [11] Signal과 Slot 연결
# - slider.valueChanged:
# * 슬라이더 값이 변경될 때 발생하는 Signal
# * 변경된 현재 값을 int로 함께 전달함
# - connect(respond_to_slider):
# * valueChanged Signal이 발생하면
# respond_to_slider 함수가 실행되도록 연결
# - Signal이 전달한 int 값은
# respond_to_slider(data)의 data로 자동 전달됨
slider.show() # [12] 슬라이더를 실제로 화면에 보이도록 함
# - show()를 호출해야 화면에 나타남
# - 호출하지 않으면 프로그램은 실행되지만 슬라이더가 보이지 않음
sys.exit(app.exec()) # [13] 이벤트 루프(Event Loop) 시작
# - app.exec():
# * 마우스 클릭, 키보드 입력, 창 닫기 등
# 각종 이벤트를 계속해서 처리하는 루프
# * 사용자가 창을 닫으면 이 함수가 종료되면서
# 종료 코드를 int 값으로 반환
# - sys.exit(...):
# * 반환된 종료 코드를 운영체제에 전달하며
# 프로그램을 깔끔하게 종료
3.2 단계별 분석
1단계: 라이브러리 가져오기
import sys
from PySide6.QtCore import Qt
from PySide6.QtWidgets import QApplication, QSliderPySide6 GUI 프로그램을 만들기 위해 필요한 클래스를 가져옵니다.
| 이름 | 역할 |
| sys | 프로그램 실행 인자와 종료 처리를 위해 사용합니다. |
| Qt | Qt.Horizontal 같은 방향 설정에 사용합니다. |
| QApplication | Qt 애플리케이션 실행 환경을 만듭니다. |
| QSlider | 값을 조절할 수 있는 슬라이더 위젯을 만듭니다. |
2단계: Slot 함수 정의
def respond_to_slider(data):
print("슬라이더 값 변경 :", data)이 함수는 슬라이더 값이 변경되었을 때 실행될 Slot 함수입니다.
이번 예제의 중요한 점은 Slot 함수에 data라는 매개변수가 있다는 것입니다.
valueChanged(int) Signal이 발생하면 변경된 슬라이더 값이 자동으로 data에 전달됩니다.
중요한 점
Slot 함수의 data 값은 개발자가 직접 넣는 값이 아니라, valueChanged(int) Signal이 자동으로 전달해 주는 값입니다.
3단계: QApplication 생성
app = QApplication(sys.argv)모든 Qt GUI 프로그램은 QApplication 객체가 필요합니다.
QApplication은 GUI 프로그램 전체의 실행 환경을 관리합니다.
특히 마우스 클릭, 키보드 입력, 창 닫기 같은 사용자 입력을 처리하는 이벤트 루프와 관련이 있습니다.
4단계: 슬라이더 생성
slider = QSlider(Qt.Horizontal)QSlider 객체를 생성합니다.
Qt.Horizontal을 사용했기 때문에 슬라이더가 가로 방향으로 표시됩니다.
| 설정 | 의미 |
| Qt.Horizontal | 슬라이더를 가로 방향으로 표시합니다. |
| Qt.Vertical | 슬라이더를 세로 방향으로 표시합니다. |
5단계: 슬라이더 값 범위와 초기값 설정
slider.setMinimum(1)
slider.setMaximum(100)
slider.setValue(25)슬라이더가 움직일 수 있는 값의 범위와 처음 표시될 값을 설정합니다.
| 코드 | 설명 |
| setMinimum(1) | 슬라이더의 최소값을 1로 설정합니다. |
| setMaximum(100) | 슬라이더의 최대값을 100으로 설정합니다. |
| setValue(25) | 슬라이더의 초기값을 25로 설정합니다. |
6단계: Signal과 Slot 연결
slider.valueChanged.connect(respond_to_slider)이 코드가 이번 예제의 핵심입니다.
사용자가 슬라이더 이동
↓
슬라이더 값 변경
↓
valueChanged(int) Signal 발생
↓
변경된 int 값 전달
↓
respond_to_slider(data) 함수 실행즉, 사용자가 슬라이더를 움직이면 valueChanged Signal이 발생하고, 변경된 숫자 값이 data 매개변수로 자동 전달됩니다.
이 구조는 버튼의 clicked(bool) 예제와 거의 같습니다.
차이점은 Signal이 전달하는 값의 타입이 bool이 아니라 int라는 점입니다.
| 예제 | Signal | 전달 값 |
| QPushButton | clicked(bool) | True / False |
| QSlider | valueChanged(int) | 슬라이더의 현재 숫자 값 |
7단계: 슬라이더 화면에 표시
slider.show()생성한 슬라이더를 화면에 표시합니다.
위젯을 생성했다고 해서 자동으로 화면에 나타나는 것은 아닙니다.
화면에 표시하려면 show()를 호출해야 합니다.
8단계: 앱 실행
sys.exit(app.exec())app.exec()는 Qt 이벤트 루프를 시작합니다.
이벤트 루프가 실행되어야 GUI 창이 유지되고, 사용자의 슬라이더 이동 이벤트를 계속 처리할 수 있습니다.
4. Qt Designer에서 구현할 때의 구조
4.1 코드 방식과 Designer 방식의 차이
앞의 예제에서는 Python 코드에서 직접 QSlider를 만들었습니다.
slider = QSlider(Qt.Horizontal)
slider.setMinimum(1)
slider.setMaximum(100)
slider.setValue(25)
slider.valueChanged.connect(respond_to_slider)Qt Designer를 사용하는 경우에는 슬라이더를 Designer 화면에서 배치한 뒤, Python 코드에서 해당 슬라이더에 접근합니다.
Designer에서 만든 슬라이더는 보통 다음과 같은 형태로 사용합니다.
self.ui.horizontalSlider따라서 Qt Designer 방식에서는 다음과 같이 Signal과 Slot을 연결합니다.
self.ui.horizontalSlider.valueChanged.connect(self.respond_to_slider)
4.2 Qt Designer 기반 작업 흐름
Qt for Python 프로젝트 생성
↓
Qt Designer에서 Horizontal Slider 배치
↓
form.ui 파일 저장
↓
form.ui 파일을 ui_form.py로 변환
↓
Widget 클래스에서 self.ui.horizontalSlider 접근
↓
self.ui.horizontalSlider.valueChanged.connect(self.respond_to_slider)구조는 코드 방식과 같습니다.
차이점은 슬라이더를 직접 생성하지 않고, Designer에서 만든 슬라이더를 self.ui.horizontalSlider로 가져와 사용한다는 점입니다.
| 구분 | 코드 방식 | Qt Designer 방식 |
| 슬라이더 생성 | QSlider(Qt.Horizontal) | Designer에서 Horizontal Slider 배치 |
| 슬라이더 접근 | slider | self.ui.horizontalSlider |
| Signal / Slot 연결 | slider.valueChanged.connect(respond_to_slider) | self.ui.horizontalSlider.valueChanged.connect(self.respond_to_slider) |
| Slot 함수 | respond_to_slider(data) | respond_to_slider(self, value) |
4.3 GUI Designer 작업
Qt Designer에서 Horizontal Slider를 배치합니다.
슬라이더의 objectName은 예제 기준으로 horizontalSlider라고 가정합니다.
4.4 form.ui를 ui_form.py로 변환하기
Qt Designer에서 만든 form.ui 파일은 그대로 Python 코드에서 사용할 수 없습니다.
일반적으로 다음 명령으로 form.ui → ui_form.py 파일로 변환합니다.
pyside6-uic form.ui -o ui_form.py
변환이 끝나면 ui_form.py 파일이 생성됩니다.
이 파일 안에는 Designer에서 배치한 슬라이더, 버튼, 라벨, 입력창 같은 위젯 정보가 Python 코드로 들어 있습니다.
4.5 ui_form.py 파일 적용하기
Qt Designer 방식에서는 화면 구성을 담당하는 ui_form.py를 가져온 뒤,
Widget 클래스 안에서 슬라이더의 valueChanged Signal과 Slot 메서드를 연결합니다.
import sys
from PySide6.QtWidgets import QApplication, QWidget
from ui_form import Ui_Widget
class Widget(QWidget):
def __init__(self, parent=None):
super().__init__(parent)
self.ui = Ui_Widget()
self.ui.setupUi(self)
# [슬라이더의 valueChanged(int) Signal과 respond_to_slider Slot 연결]
# - self.ui.horizontalSlider:
# Designer에서 배치한 슬라이더 위젯
# - valueChanged(int):
# 슬라이더 값이 변경될 때 발생하는 Signal
# - 변경된 int 값이 respond_to_slider(value)의 value로 자동 전달됨
self.ui.horizontalSlider.valueChanged.connect(self.respond_to_slider)
# [Slot 함수]
# - valueChanged(int) Signal이 전달하는 int 값을 자동으로 받음
# - 클래스 내부 메서드이므로 self 인자를 가짐
def respond_to_slider(self, value):
print("슬라이더 값 변경 :", value)
if __name__ == "__main__":
app = QApplication(sys.argv)
widget = Widget()
widget.show()
sys.exit(app.exec())
4.6 self와 value가 필요한 이유
Qt Designer 방식에서는 슬라이더가 Widget 클래스 내부에서 사용됩니다.
따라서 슬라이더는 self.ui.horizontalSlider 형태로 접근하고, Slot 함수는 self.respond_to_slider 형태로 연결합니다.
또한 valueChanged(int) Signal이 정수 값을 전달하므로, Slot 메서드는 이 값을 받을 매개변수도 함께 가져야 합니다.
중요한 점
클래스 내부 메서드를 Slot으로 연결할 때는 self.respond_to_slider로 연결하고, Signal이 전달하는 값은 value 매개변수로 받습니다.
| 코드 | 설명 |
| self.ui.horizontalSlider | Designer에서 배치한 슬라이더 위젯에 접근합니다. |
| valueChanged | 슬라이더 값이 변경될 때 발생하는 Signal입니다. |
| self.respond_to_slider | Widget 클래스 내부에 정의된 Slot 메서드입니다. |
| value | valueChanged(int) Signal이 전달한 현재 슬라이더 값을 받습니다. |
5. 정리
이번 단계에서는 QSlider의 valueChanged(int) Signal을 사용하여 슬라이더 값이 Slot 함수로 전달되는 구조를 살펴보았습니다.
핵심 흐름은 다음과 같습니다.
슬라이더 이동
↓
슬라이더 값 변경
↓
valueChanged(int) Signal 발생
↓
변경된 int 값 전달
↓
respond_to_slider(data) 함수 실행
↓
전달받은 data 값을 사용| 개념 | 정리 |
| QSlider | 숫자 값을 조절할 수 있는 슬라이더 위젯입니다. |
| valueChanged(int) | 슬라이더 값이 변경될 때 int 값을 함께 전달하는 Signal입니다. |
| Slot 함수의 매개변수 | Signal이 전달한 값을 자동으로 받습니다. |
| connect() | Signal과 Slot을 연결하고, Signal의 값을 Slot 함수로 전달합니다. |
| Signal / Slot 공통 구조 | 버튼, 슬라이더 등 다양한 위젯에서 동일하게 사용됩니다. |
이번 단계에서 기억할 문장
Signal / Slot 구조는 QPushButton뿐만 아니라 QSlider 같은 다양한 위젯에서도 동일하게 동작합니다.
QSlider의 valueChanged(int) Signal은 슬라이더의 현재 값을 Slot 함수에 자동으로 전달합니다.