☘️

018 QTextBrowser (확장된 글 편집기)

1. 코드

from PyQt5.QtWidgets import QWidget, QApplication, QVBoxLayout, \ QLabel, QPushButton, QTextBrowser, QLineEdit from PyQt5.QtCore import Qt import sys class 확장된글편집기(QWidget): def __init__(self): super().__init__() self.UI초기화() def UI초기화(self): self.line_edit = QLineEdit() self.line_edit.returnPressed.connect(self.addText) self.btn_add = QPushButton('입력') self.btn_add.clicked.connect(self.addText) self.tb = QTextBrowser() self.tb.setAcceptRichText(True) self.tb.setOpenExternalLinks(True) self.tb.append('일반 플래인 텍스트입니다.') self.tb.setAlignment(Qt.AlignCenter) self.btn_clear = QPushButton('지우기') self.btn_clear.clicked.connect(self.clearText) vbox = QVBoxLayout() vbox.addWidget(self.line_edit) vbox.addWidget(self.tb) vbox.addWidget(self.btn_add) vbox.addWidget(self.btn_clear) self.setLayout(vbox) self.setWindowTitle('QTextBrowser') self.setGeometry(300, 300, 300, 400) self.show() def addText(self): text = self.line_edit.text() self.tb.append(text) self.line_edit.clear() def clearText(self): self.tb.clear() 프로그램무한반복 = QApplication(sys.argv) 실행인스턴스 = 확장된글편집기() 프로그램무한반복.exec_()

2. 상세 내용

2.1 QTextBrowser

QTextBrowser는 앞서 배웠던 QTextEdit의 확장형입니다. 여기서는 하이퍼링크, 마크업 언어가 사용가능합니다.
self.line_edit = QLineEdit() self.line_edit.returnPressed.connect(self.addText) self.btn_add = QPushButton('입력') self.btn_add.clicked.connect(self.addText)
  • LineEdit : 한 줄 입력기
  • 입력기에서 Enter를 치거나 (returnPressed) 버튼을 누르면 시그널 발생
 
def addText(self): text = self.line_edit.text() self.tbs.append(text) self.line_edit.clear()
  • 입력기에서 입력된 텍스트를 가져와 TextBrowser에 추가하고(append) 입력된 텍스트를 지움
 
self.tbs = QTextBrowser() self.tbs.setAcceptRichText(True) self.tbs.setOpenExternalLinks(True) self.tbs.append('일반적인 플레인 텍스트입니다.') self.tbs.setAlignment(Qt.AlignCenter) self.btn_clear = QPushButton('지우기') self.btn_clear.clicked.connect(self.ClearText)
  • setAcceptRichText(True) : 리치 텍스트 사용 여부 : 서식있는 텍스트를 사용가능
  • setOpenExternalLinks(True) : 외부링크를 허용하는지에 대한 여부
 
def clearText(self): self.tbs.clear()
  • clear()를 통해 TextBrowser에 있는 텍스트를 전부 지움
 
 

2.2 서식있는 텍스트

아래 내용을 복사해서 붙여 사용해보세요. 해당 언어는 HTML 언어이며, 간단한 튜토리얼 영상도 함께 제공해드립니다.
🖊️
<b>Bold</b> <i>Italic</i> <p style="color: red">Red</p> <p style="color: blue"><b>Blue</b></p> <p style="font-size: 20px"><i>20px<i></p> <p style="font-size: 40px">40px</p> <a href="https://www.naver.com">네이버</a> <a href="https://www.inflearn.com/instructors/19857/courses">제주 코딩베이스 캠프 강의 목록</a> <a href="https://www.youtube.com/channel/UC4GnvNKtuJ4cqWsYjxNxAEQ">저희의 유튜브 입니다.</a> <img src= "img/weniv-licat.png" width ="100" height = "100">
Video preview

3. 실행 화면

notion imagenotion image