φυβλαςのβλογ
บล็อกของ phyblas



pyqt เบื้องต้น บทที่ ๑๘: การสร้างและใช้งานหน้าต่างป้อนข้อมูล
เขียนเมื่อ 2021/08/20 09:03
แก้ไขล่าสุด 2021/08/21 21:19

ต่อจาก บทที่ ๑๗

บทนี้จะเป็นเรื่องของ QInputDialog ซึ่งเป็นหน้าต่างที่เด้งขึ้นมาเพื่อใช้สำหรับกรอกข้อมูลสั้นๆลงไป นอกจากนี้จะพูดถึง QColorDialog กับ QFontDialog ซึ่งมีความเกี่ยวข้องกันไปด้วย

QInputDialog นั้นเอาไว้ใช้ใส่ข้อมูลหลายชนิด ขึ้นอยู่กับชนิดข้อมูล

ค่าที่ใส่ ชนิดข้อมูลที่ได้
QInputDialog.getText สายอักขระบรรทัดเดียว str
QInputDialog.getMultiLineText สายอักขระหลายบรรทัด str
QInputDialog.getInt จำนวนเต็ม int
QInputDialog.getDouble จำนวนเลขทศนิยม float
QInputDialog.getItem กล่องเลือกข้อความ str




การสร้างกล่องกรอกข้อความ {QInputDialog.getText}

QInputDialog.getText ไว้ใช้สำหรับป้อนใส่ข้อความสั้นๆบรรทัดเดียว

การสร้างขึ้นมาเขียนดังนี้
QInputDialog.getText(widget_หลัก,ไตเติล,ข้อความอธิบาย)

QInputDialog.getText จะเด้งหน้าต่างขึ้นมาให้กรอกข้อความ แล้วมีปุ่ม ๒​ ปุ่มคือ ok กับ cancel แล้วจะได้ค่าคืนกลับมา ๒​ ตัว ตัวแรกคือสายอักขระข้อความที่พิมพ์ไป ส่วนอีกตังคือค่าที่บอกว่าปุ่ม ok ถูกกดหรือไม่ ถ้ากด ok ก็จะได้ True ถ้ากด cancel ก็จะได้ False

ถ้ามีข้อความที่ต้องการให้มีอยู่ในกล่องตั้งแต่ตอนเริ่มต้นให้ใส่เพิ่มคีย์เวิร์ด text=ข้อความตั้งต้น

ตัวอย่าง ลองให้เริ่มต้นมาขึ้นหน้าต่างให้กรอกข้อความ แล้วให้แสดงข้อความที่พิมพ์ลงไปในหน้าต่าง แต่ถ้ากด cancel ก็ให้ขึ้นว่า "ไม่มีข้อความ"
import sys
from PyQt5.QtWidgets import QApplication,QWidget,QInputDialog,QLabel

qAp = QApplication(sys.argv)
natang = QWidget()
natang.setStyleSheet('font-family: Tahoma; font-size: 18px;')
ss,okemai = QInputDialog.getText(natang,'หน้าต่างกรอกข้อความ','จงกรอกข้อความ',text='^_^')
khokhwam = QLabel('',natang)
khokhwam.setGeometry(10,10,200,80)
if(okemai):
    khokhwam.setText('ข้อความที่เจ้าพิมพ์คือ:\n"'+ss+'"')
else:
    khokhwam.setText('ไม่มีข้อความ')
natang.show()
qAp.exec_()






การสร้างกล่องกรอกข้อความหลายบรรทัด {QInputDialog.getMultiLineText}

QInputDialog.getMultiLineText จะคล้ายกับ QInputDialog.getText แค่สามารถใส่ข้อความได้หลายบรรทัด

ตัวอย่าง ลองให้ใส่ข้อความแล้วเอามานับจำนวนตัวอักษรและบรรทัด
import sys
from PyQt5.QtWidgets import QApplication,QWidget,QInputDialog,QLabel

qAp = QApplication(sys.argv)
natang = QWidget()
natang.setStyleSheet('font-family: Tahoma; font-size: 16px;')
ss,okemai = QInputDialog.getMultiLineText(natang,'เขียนไปเถอะ','เขียนอะไรก็ได้ลงมา')
khokhwam = QLabel('',natang)
khokhwam.setGeometry(10,10,130,70)
if(okemai and ss!=''):
    khokhwam.setText('%d ตัวอักษร\n%d บรรทัด'%(len(ss),len(ss.split('\n'))))
else:
    khokhwam.setText('ไม่มีข้อความ')
natang.show()
qAp.exec_()






การสร้างกล่องกรอกตัวเลขจำนวนเต็ม {QInputDialog.getInt}

QInputDialog.getInt ใช้เมื่อต้องการรับค่าจำนวนเต็ม โดยจะมีช่อง QSpinBox ให้ใส่ค่าตัวเลข

วิธีการสร้าง
QInputDialog.getInt(widget_หลัก,ไตเติล,ข้อความอธิบาย,value=ค่าตั้งต้น,min=ค่าต่ำสุด,max=ค่าสูงสุด,step=ค่าที่เปลี่ยนไปในแต่ละครั้งเมื่อกดปุ่มลูกศร)

ตัวอย่างเช่น ให้กรอกตัวเลข แล้วให้แสดงเครื่องหมายตกใจเป็นจำนวนเท่ากับตัวเลขที่ใส่ลงไปนั้น
import sys
from PyQt5.QtWidgets import QApplication,QWidget,QInputDialog,QLabel

qAp = QApplication(sys.argv)
natang = QWidget()
lek,okemai = QInputDialog.getInt(natang,'','กรอกเลข',value=10)
tokchai = QLabel('',natang)
tokchai.move(10,10)
if(okemai):
    s = ''
    for i in range(lek):
        s += '!'
    tokchai.setText(s)
else:
    tokchai.setText('???')
natang.show()
qAp.exec_()






การสร้างกล่องกรอกตัวเลขทศนิยม {QInputDialog.getDouble}

QInputDialog.getDouble จะคล้ายกับ QInputDialog.getInt แต่ต่างกันตรงที่เป็นเลขทศนิยม

วิธีการสร้างก็คล้ายกับ QInputDialog.getInt แต่สามารถใส่คีย์เวิร์ด decimals เพื่อกำหนดจำนวนตำแหน่งทศนิยมได้
QInputDialog.getDouble(widget_หลัก,ไตเติล,ข้อความอธิบาย,value=ค่าตั้งต้น,min=ค่าต่ำสุด,max=ค่าสูงสุด,step=ค่าที่เปลี่ยนไปในแต่ละครั้งเมื่อกดปุ่มลูกศร,decimals=จำนวนตำแหน่งทศนิยม)

ตัวอย่าง
import sys
from PyQt5.QtWidgets import QApplication,QWidget,QInputDialog,QLabel

qAp = QApplication(sys.argv)
natang = QWidget()
natang.setStyleSheet('font-family: Tahoma; font-size: 16px;')
kha,okemai = QInputDialog.getDouble(natang,'','กรอกค่า',99.99,decimals=3)
khokhwam = QLabel('',natang)
khokhwam.setGeometry(10,10,240,50)
if(okemai):
    khokhwam.setText('100 - %.3f = %.3f\n1000 - %.3f = %.3f'%(kha,100-kha,kha,1000-kha))
else:
    khokhwam.setText('- -"')
natang.show()
qAp.exec_()






การสร้างกล่องกรอกข้อความที่ให้เลือกได้ {QInputDialog.getItem}

QInputDialog.getItem นั้นเอาไว้กรอกข้อมูลสายอักขระเช่นเดียวกับ QInputDialog.getText เพียงแต่จะมี QCombobox ปรากฏขึ้นมาเป็นตัวเลือกให้เลือกได้
QInputDialog.getItem(widget_หลัก,ไตเติล,ข้อความอธิบาย,ลิสต์ของข้อความตัวเลือก,current=ตำแหน่งที่เลือกตอนแรก,editable=แก้ข้อความเอาเองได้หรือไม่)

คีย์เวิร์ด editable จะเป็นตัวกำหนดว่าจะให้แก้ข้อความได้เองด้วยหรือเปล่า ถ้าหากไม่ได้ใส่ editable=False ก็จะเป็นค่าตั้งต้นคือสามารถแก้ข้อความเองได้

ตัวอย่าง ลองสร้างหน้าต่างสำหรับเลือกเมนูอาหารโดยมีตัวเลือกให้ จากนั้นให้แสดงข้อความที่เลือก
import sys
from PyQt5.QtWidgets import QApplication,QWidget,QInputDialog,QLabel

qAp = QApplication(sys.argv)
natang = QWidget()
natang.setStyleSheet('font-family: Tahoma; font-size: 19px;')
ss,okemai = QInputDialog.getItem(natang,'','วันนี้อยากกินอะไร',['คัตสึดง','กิวดง','เทนดง'],current=1,editable=False)
khokhwam = QLabel('',natang)
khokhwam.resize(180,50)
if(okemai):
    khokhwam.setText('~^~'+ss+'~^~')
else:
    khokhwam.setText('Zzz')
natang.show()
qAp.exec_()






หน้าต่างสำหรับเลือกสี {QColorDialog.getColor}

QColorDialog เป็นหน้าต่างสำหรับเลือกเอาค่าสี สามารถกดเลือกสีตามที่ต้องการได้ ถ้าใช้ QColorDialog.getColor ก็จะได้ค่าคืนกลับเป็นออบเจ็กต์ QColor

ซึ่งถ้าใช้เมธอดที่ตัวออบเจ็กต์ QColor ที่ได้มานี้ก็จะเอาค่าสีได้ เช่นเมธอด .red, .green, .blue ใช้เอาค่าสีแดง, เขียว, น้ำเงิน

ตัวอย่าง สร้างหน้าต่างเลือกค่าสีแล้วเอาค่าสีแดงเขียวน้ำเงินที่ได้มาแสดง
import sys
from PyQt5.QtWidgets import QApplication,QWidget,QColorDialog,QLabel

qAp = QApplication(sys.argv)
natang = QWidget()
si = QColorDialog.getColor()
khokhwam = QLabel('%d,%d,%d'%(si.red(),si.green(),si.blue()),natang)
khokhwam.setGeometry(8,8,90,30)
natang.show()
qAp.exec_()

จะมีหน้าให้เลือก






หน้าต่างสำหรับเลือกฟอนต์ {QFontDialog.getFont}

QFontDialog เป็นหน้าต่างสำหรับเลือกฟอนต์ตัวอักษร

เมื่อใช้ QFontDialog.getFont จะได้ค่าคืนกลับมา ๒ ตัว ตัวแรกคือออบเจ็กต์ QFont ซึ่งสามารถเอามาใช้ปรับตัวหนังสือได้โดยใช้เมธอด .setFont ดังที่ได้เขียนถึงไปในบทที่ ๕

ส่วนอีกตัวคือค่า True False ที่บอกว่าปุ่ม ok หรือ cancel ถูกกด

ตัวอย่าง เริ่มต้นให้ขึ้นหน้าต่างมาเลือกฟอนต์ แล้วให้แสดงข้อความเป็นฟอนต์ตามที่เลือกไว้
import sys
from PyQt5.QtWidgets import QApplication,QWidget,QFontDialog,QLabel

qAp = QApplication(sys.argv)
natang = QWidget()
font,okemai = QFontDialog.getFont()
if(okemai):
    khokhwam = QLabel('ข้อความ',natang)
    khokhwam.setFont(font)
    khokhwam.setGeometry(5,5,250,200)
natang.show()
qAp.exec_()






สรุปท้ายบท

ในบทนี้ได้แนะนำการใช้ QInputDialog ซึ่งเป็นหน้าต่างสำหรับป้อนข้อมูลแบบต่างๆไปแล้ว นอกจากนี้แล้วก็ยังได้แนะนำ QColorDialog ซึ่งเอาไว้ใช้เลือกสี QFontDialog ซึ่งเอาไว้ใช้สำหรับเลือกฟอนต์ตัวหนังสือ

ซึ่งทั้งหมดนี้เป็นเหมือนแบบฟอร์มสำเร็จรูปที่เตรียมไว้ให้เขียนสั้นและใช้งานได้เร็ว เหมาะกับที่จะนำไปใช้เวลาที่ต้องการให้ขึ้นมาเพื่อป้อนข้อมูลลงไปแบบสั้นๆง่ายๆ

สำหรับในบทต่อไปจะแนะนำ QFileDialog ซึ่งเอาไว้ใช้สำหรับเลือกไฟล์ขึ้นมาเปิดหรือบันทึก



อ่านบทถัดไป >> บทที่ ๑๙





-----------------------------------------

囧囧囧囧囧囧囧囧囧囧囧囧囧囧囧囧囧囧囧囧囧囧囧囧囧

ดูสถิติของหน้านี้

หมวดหมู่

-- คอมพิวเตอร์ >> เขียนโปรแกรม >> python >> pyqt

ไม่อนุญาตให้นำเนื้อหาของบทความไปลงที่อื่นโดยไม่ได้ขออนุญาตโดยเด็ดขาด หากต้องการนำบางส่วนไปลงสามารถทำได้โดยต้องไม่ใช่การก๊อปแปะแต่ให้เปลี่ยนคำพูดเป็นของตัวเอง หรือไม่ก็เขียนในลักษณะการยกข้อความอ้างอิง และไม่ว่ากรณีไหนก็ตาม ต้องให้เครดิตพร้อมใส่ลิงก์ของทุกบทความที่มีการใช้เนื้อหาเสมอ

สารบัญ

รวมคำแปลวลีเด็ดจากญี่ปุ่น
มอดูลต่างๆ
-- numpy
-- matplotlib

-- pandas
-- manim
-- opencv
-- pyqt
-- pytorch
การเรียนรู้ของเครื่อง
-- โครงข่าย
     ประสาทเทียม
maya
javascript
ความน่าจะเป็น
บันทึกในญี่ปุ่น
บันทึกในจีน
-- บันทึกในปักกิ่ง
-- บันทึกในฮ่องกง
-- บันทึกในมาเก๊า
บันทึกในไต้หวัน
บันทึกในยุโรปเหนือ
บันทึกในประเทศอื่นๆ
เรียนภาษาจีน
qiita
บทความอื่นๆ

บทความแบ่งตามหมวด



ติดตามอัปเดตของบล็อกได้ที่แฟนเพจ

  ค้นหาบทความ

  บทความแนะนำ

รวมรายชื่อนักร้องเพลงกวางตุ้ง
ภาษาจีนแบ่งเป็นสำเนียงอะไรบ้าง มีความแตกต่างกันมากแค่ไหน
ทำความเข้าใจระบอบประชาธิปไตยจากประวัติศาสตร์ความเป็นมา
เรียนรู้วิธีการใช้ regular expression (regex)
หลักการเขียนทับศัพท์ภาษาจีนกวางตุ้ง
การใช้ unix shell เบื้องต้น ใน linux และ mac
หลักการเขียนทับศัพท์ภาษาจีนกลาง
g ในภาษาญี่ปุ่นออกเสียง "ก" หรือ "ง" กันแน่
ทำความรู้จักกับปัญญาประดิษฐ์และการเรียนรู้ของเครื่อง
ค้นพบระบบดาวเคราะห์ ๘ ดวง เบื้องหลังความสำเร็จคือปัญญาประดิษฐ์ (AI)
หอดูดาวโบราณปักกิ่ง ตอนที่ ๑: แท่นสังเกตการณ์และสวนดอกไม้
พิพิธภัณฑ์สถาปัตยกรรมโบราณปักกิ่ง
เที่ยวเมืองตานตง ล่องเรือในน่านน้ำเกาหลีเหนือ
บันทึกการเที่ยวสวีเดน 1-12 พ.ค. 2014
แนะนำองค์การวิจัยและพัฒนาการสำรวจอวกาศญี่ปุ่น (JAXA)
เล่าประสบการณ์ค่ายอบรมวิชาการทางดาราศาสตร์โดยโซวเคนได 10 - 16 พ.ย. 2013
ตระเวนเที่ยวตามรอยฉากของอนิเมะในญี่ปุ่น
เที่ยวชมหอดูดาวที่ฐานสังเกตการณ์ซิงหลง
บันทึกการเที่ยวญี่ปุ่นครั้งแรกในชีวิต - ทุกอย่างเริ่มต้นที่สนามบินนานาชาติคันไซ
หลักการเขียนทับศัพท์ภาษาญี่ปุ่น
ทำไมจึงไม่ควรเขียนวรรณยุกต์เวลาทับศัพท์ภาษาต่างประเทศ
ทำไมถึงอยากมาเรียนต่อนอก
เหตุผลอะไรที่ต้องใช้ภาษาวิบัติ?

ไทย

日本語

中文