1. 개발 환경 설정
이번 글에서는 이 프로그램의 화면 껍데기를 만들어보겠습니다
1-1. 가상환경 활성화
개발에 필요한 가상환경 설치 및 활성화를 해주시고
# 1. 가상환경 설치
python -m venv venv
# 2.가상환경 활성화
#Window 이용자의 경우
venv/Scripts/activate
#Mac 이용자의 경우
source venv/bin/activate
1-2. 개발에 필요한 라이브러리 설치
pip install pyside6
화면 GUI를 만드는데 필요한 pyside6 라이브러리만 먼저 설치해줍니다
2. Pyside6 GUI 깡통 빈화면 띄워보기
import sys, os
from PySide6.QtWidgets import QWidget,QApplication
class BlogSummarizer(QWidget):
def __init__(self):
super().__init__()
pass
app = QApplication(sys.argv)
window = BlogSummarizer()
window.show()
app.exec()
먼저 필요한 라이브러리을 가져옵니다.
QWidget과 QApplication을 가져오는데
이 두 클래스가 GUI 프로그램의 기본 틀을 만들어줍니다
블로그 서머라이저 클래스는 QWidget을 상속받아 우리가 만들 윈도우 창의 역할을 합니다.
생성자 init 메서드를 실행하고 현재는 pass로 아무 기능도 추가되지 않았지만, 이곳에 버튼, 주소를 입력하는 칸이 추가될거에요
마지막 네줄은 프로그램 창이 화면에 나타나게하는 역할을 합니다.
python app.py
명령어로 프로그램을 실행시켜보면 이런 빈 화면이 생성됩니다 !
3. 프로그램 GUI 완성시키기 (스타일 적용X)
블로그 주소 입력, 요약률 조정, 출처 표기 방식 선택이 가능한 프로그램 GUI를 만듭니다.
(아래 코드는 한줄한줄 Ctrl + Z 하면서 프로그램 실행시켜주자 ㅇㅇ)
import sys, os
from PySide6.QtWidgets import (
QApplication, QWidget, QVBoxLayout, QHBoxLayout, QSpacerItem, QSizePolicy,
QPushButton, QLineEdit, QComboBox, QTextEdit, QLabel, QSlider
)
from PySide6.QtGui import QIcon
from PySide6.QtCore import Qt
OPTIONS = ["요약문 원본만 표시", "출처 맨 상단 표시", "출처 맨 하단 표시"]
class BlogSummarizer(QWidget):
def __init__(self):
super().__init__()
self.init_ui()
def init_ui(self):
self.setWindowTitle("블로그 글 요약 프로그램")
self.setGeometry(200, 200, 450, 600)
# Layouts
layout = QVBoxLayout()
# URL Input
layout.addWidget(QLabel("😃 블로그 주소를 입력해주세요. URL :"))
self.url_input = QLineEdit("https://blog.naver.com/lread90/223169515095")
layout.addWidget(self.url_input)
# Summary Slider
self.slider_label = QLabel("요약률 설정 (기본 50%)")
self.summary_slider = QSlider(Qt.Horizontal)
self.summary_slider.setRange(10, 100)
self.summary_slider.setValue(50)
self.summary_slider.setTickPosition(QSlider.TicksBelow)
self.summary_slider.setTickInterval(10)
self.summary_slider.valueChanged.connect(self.update_slider_label)
layout.addWidget(self.slider_label)
layout.addWidget(self.summary_slider)
# Dropdown
layout.addWidget(QLabel("출처 표기 방식 선택하기"))
self.dropdown = QComboBox()
self.dropdown.addItems(OPTIONS)
layout.addWidget(self.dropdown)
# Buttons
self.run_button = QPushButton("요약 시작하기")
layout.addWidget(self.run_button)
# Summary Text
self.char_count_label = QLabel("원문 글자 수: 0 | 요약본 글자 수: 0")
layout.addWidget(self.char_count_label)
self.summary_text = QTextEdit(readOnly=True, placeholderText="요약 결과가 이곳에 나타납니다.")
layout.addWidget(self.summary_text)
# Copy Button
copy_button = QPushButton("텍스트 복사하기")
layout.addWidget(copy_button)
# Logs
self.log_text = QLineEdit(readOnly=True, placeholderText="작업 로그")
layout.addWidget(self.log_text)
# Bottom Buttons
button_layout = QHBoxLayout()
spacer = QSpacerItem(40, 20, QSizePolicy.Expanding, QSizePolicy.Minimum)
button_layout.addItem(spacer)
layout.addLayout(button_layout)
self.setLayout(layout)
def update_slider_label(self):
value = self.summary_slider.value()
self.slider_label.setText(f"요약률 설정: {value}%")
self.log(f"요약률이 {value}%로 변경되었습니다.")
app = QApplication(sys.argv)
window = BlogSummarizer()
window.show()
sys.exit(app.exec())
1. UI 구성 요소
(1) URL 입력 창
self.url_input = QLineEdit("https://blog.naver.com/lread90/223169515095")
layout.addWidget(self.url_input)
사용자가 블로그 URL을 입력할 수 있는 텍스트 필드입니다.
(2) 요약률 슬라이더
self.summary_slider = QSlider(Qt.Horizontal)
self.summary_slider.setRange(10, 100)
self.summary_slider.setValue(50)
Horizontal = 가로축이란 뜻이죠? 가로로 조절하는 슬라이더가 됩니다.
요약률을 10%에서 100%까지 조정할 수 있는 슬라이더입니다.
(3) 드롭다운 메뉴
self.dropdown = QComboBox()
self.dropdown.addItems(OPTIONS)
OPTIONS 변수 - 리스트 형태로 addItems에 제공하면 됩니다. 콤보박스를 클릭하거나, 콤보박스 아이템을 클릭했을때 아이템이 바뀌는것은 QComboBox에서 알아서 처리해줘서 2줄이면 콤보박스를 사용할 수 있게 됩니다.
출처 표기 방식을 선택할 수 있는 드롭다운 메뉴입니다.
(4) 버튼
- 요약 실행 버튼:
self.run_button = QPushButton("요약 시작하기")
- 텍스트 복사 버튼:
copy_button = QPushButton("텍스트 복사하기")
(5) 텍스트 출력 창
self.summary_text = QTextEdit(readOnly=True, placeholderText="요약 결과가 이곳에 나타납니다.")
요약 결과를 표시하는 텍스트 박스입니다.
(6) 로그 창
self.log_text = QLineEdit(readOnly=True, placeholderText="작업 로그")
작업 로그를 보여주는 필드입니다.
실행 화면
프로그램 실행 시, 다음과 같은 화면이 나타납니다.
이번 시간까지 프로그램의 GUI를 개발했습니다. 다음번 강의에서는 style sheet를 적용해서 프로그램의 UI를 개선시켜보겠습니다.
'파이썬 코딩 기록' 카테고리의 다른 글
당신이 코딩, 개발로 돈 못 버는 3가지 이유 (성공 포르노 껒) (1) | 2024.12.10 |
---|---|
글 요약 프로그램 직접 만드는 방법 (python, pyside6 GUI 만드는법) 2편 (2) | 2024.12.06 |
요약 프로그램 사용방법, 복붙 방지 사이트에서 이용하는 방법 (3) | 2024.11.27 |
[python] 파이썬 실행파일 만들어 판매할 때 서버 써야하는 이유(안하면 정보 다 털립니다) (2) | 2024.11.21 |
OpenAI Python Package Error: 'ChatCompletion' object is not subscriptable - OpenAI 버전 바뀌고 나오는 에러임 (0) | 2024.11.14 |