Dialog window adalah window yang selalu berada di layer paling atas. Digunakan untuk menyelesaikan tugas-tugas jangka pendek atau untuk berkomunikasi dengan user untuk hal-hal yang tidak perlu waktu lama [1]. Seperti meminta input dari user, atau untuk meload file dari media penyimpanan, atau untuk konfirmasi aksi-aksi yang berbahaya.
PySide.QtGui.QDialog
adalah kelas utama yang menhandle dialog pada PySide. Bisa berupada modal dan atau modeless. Modal akan mencegah user untuk bisa berinteraksi dengan window utama, sedangkan modeless tidak. Kelas-kelas yang menurunkan kelas PySide.QtGui.QDialog
adalah: QFileDialog
, QErrorMessage
, QColorDialog
, QAbstractPrintDialog
, QPrintDialog
, QAbstractPageSetupDialog
, QPageSetupDialog
, QWizard
, QProgressDialog
, QPrintPreviewDialog
, QMessageBox
, QInputDialog
, QFontDialog
.
Dalam Tutorial PySide kali ini saya insyaallah akan membahas tentang beberapa dialog yang ada pada PySide.
Membuat Window Utama
Kita buat dulu window utama, sebelum mendemonstrasikan dialog pada pyside.
NB: di sini saya menggunakan prosedural style untuk mempermudah tutorial. Versi OOP-nya insyaallah akan saya sertakan di akhir tutorial, seperti biasa.
window = QtGui.QWidget()
window.resize(250, 200)
window.setWindowTitle('Tutorial PySide')
layout = QtGui.QBoxLayout(QtGui.QBoxLayout.TopToBottom, window)
btnMessageDialog = QtGui.QPushButton('Message Dialog')
btnErrorDialog = QtGui.QPushButton('Error Dialog')
btnInputDialog = QtGui.QPushButton('Input Dialog')
btnProgressDialog = QtGui.QPushButton('Progress Dialog')
btnFileDialog = QtGui.QPushButton('File Dialog')
layout.addWidget(btnMessageDialog)
layout.addWidget(btnErrorDialog)
layout.addWidget(btnInputDialog)
layout.addWidget(btnProgressDialog)
layout.addWidget(btnFileDialog)
window.show()
Berikut penampakan window utama kita.
QMessageBox
Buat fungsi showMessageDialog()
untuk menampilkan Message Box dialog. Nanti fungsi ini akan dipanggil jika tombol message dialog ditekan.
def showMessageDialog():
messageBox = QtGui.QMessageBox(window)
messageBox.setWindowTitle('Message Box')
messageBox.setText('Halo, selamat belajar PySide!')
messageBox.exec_()
print('show message dialog')
Daftarkan fungsi di atas sebagai action listener btnMessageDialog
.
btnMessageDialog.clicked.connect(showMessageDialog)
Anda juga bisa menambahkan tombol-tombol lain ke dalam message box dengan mengubah kode di atas menjadi seperti ini:
messageBox = QtGui.QMessageBox(window)
messageBox.setWindowTitle('Message Box')
messageBox.setText('The document has been modified')
messageBox.setInformativeText('Do you want to save your changes?')
messageBox.setStandardButtons(
QtGui.QMessageBox.Save | QtGui.QMessageBox.Discard | QtGui.QMessageBox.Cancel
)
messageBox.setDefaultButton(QtGui.QMessageBox.Save)
Dan fungsi exec_()
dari QMessageBox akan mereturn tombol apa yang ditekan oleh user. Sehingga kita bisa memproses lebih lanjut sesuai dengan aksi user.
result = messageBox.exec_()
if result == QtGui.QMessageBox.Save:
print('tombol save dipilih')
elif result == QtGui.QMessageBox.Discard:
print('tombol discard dipilih')
else:
print('tombol cancel dipilih')
QErrorMessage
Kelas PySide.QtGui.QErrorMessage
menyediakan dialog yang berfungsi untuk menampilkan pesan error. Dan pesan error akan ditampilkan dengan text serta satu checkbox [2].
Buat fungsi showErrorMessageDialog()
untuk menampilkan error message dialog.
def showErrorMessageDialog():
dialog = QtGui.QErrorMessage(window)
dialog.showMessage('Maaf, telah terjadi error :(')
Hubungkan fungsi di atas dengan btnErrorDialog
sehingga akan dipanggil ketika tombol tersebut diklik.
btnErrorDialog.clicked.connect(showErrorMessageDialog)
QInputDialog
Kelas PySide.QtGui.QInputDialog
menyediakan cara yang sederhana untuk menampilkan dialog yang berfungsi untuk mendapatkan single-input dari user [3]. Inputan bisa berupa string, integer, atau pilihan dari sejumlah list.
Ada beberapa helper yang bisa kita gunakan untuk membuat input dialog dengan mudah dan sederhana. Tidak perlu dengan cara membuat instance secara manual seperti dialog-dialoig di atas.
def showInputDialog():
text = QtGui.QInputDialog.getText(
window, 'Masukkan Nama', 'Nama'
)
integer = QtGui.QInputDialog.getInt(
window, 'Masukkan Usia', 'Usia'
)
double = QtGui.QInputDialog.getDouble(
window, 'Masukkan Berat Badan', 'Berat Badan'
)
print('Nama: ', text[0])
print('Usia: ', integer[0])
print('Berat Badan: ', double[0])
Hubungkan fungsi di atas dengan tombol btnInputDialog
.
btnInputDialog.clicked.connect(showInputDialog)
QProgressDialog
Sebuah progress dialog digunakan untuk memberikan informasi kepada user tentang estimasi seberapa lama suatu proses akan dijalankan, juga mengabarkan kepada user bahwasanya aplikasi kita tidak membeku alias nge-blank. Juga memberikan kesempatan kepada user untuk memberhentikan proses yang sedang berjalan [5].
Dalam PySide, PySide.QtGui.QProgressDialog
yang bertugas untuk melakukan hal-hal tersebut.
Tugas-tugas yang biasanya butuh waktu yang lama untuk diproses bisa berupa: membaca banyak file dari media penyimpanan data, mengunggah atau mengunduh file dari internet, menghitung proses matematika yang rumit serta berulang, atau yang semisalnya. Ketika proses-proses tersebut sedang berjalan, sambil lalu kita bisa menampilkan informasi progress kepada user.
Buat fungsi untuk menampilkan progress dialog. Buat instance dari kelas PySide.QtGui.QProgressDialog
, set minimum dan maximum dari proses yang kita akan lakukan.
def showProgressDialog():
dialog = QtGui.QProgressDialog(window)
dialog.setMinimum(0)
dialog.setMaximum(100)
Di bagian atas program, import module time
. Kita akan mengupdate progress dari dialog kita dalam 100 milisecond sekali.
import time
Lalu tambahkan kode berikut untuk mengupdate progress dialog kita.
for i in range(100):
dialog.setValue(i)
time.sleep(.100)
dialog.setValue(dialog.maximum())
NB: ketika value dari progress dialog sama dengan nilai maximumnya, otomatis dia akan menghilang sendiri.
Terakhir, sambungkan fungsi showProgressDialog
ke tombol btnProgressDialog
.
btnProgressDialog.clicked.connect(showProgressDialog)
QFileDialog
Tambahkan fungsi berikut untuk menampilkan file dialog + mengembalikan file-file yang dipilih oleh user.
def showFileDialog():
fileNames = QtGui.QFileDialog.getOpenFileNames(
window, 'Open File', '~/'
)[0]
for fileName in fileNames:
print(fileName)
Jika anda hanya ingin mengambil satu file saja, plus juga ingin membatasi file yang boleh diselect, anda bisa mengubah kode di atas menjadi seperti berikut:
def showFileDialog():
fileName = QtGui.QFileDialog.getOpenFileName(
window, 'Select Image', '~/', 'Images Files(*.jpg *.png *.gif)'
)[0]
print (fileName)
Lalu sambungkan fungsi di atas dengna tombol btnFileDialog
.
btnFileDialog.clicked.connect(showFileDialog)
Kode Program Lengkap
Versi Prosedural
Versi OOP
Demikian tutorial PySide kali ini. Semoga bermanfaat. Dan jika ada yang membingungkan, silakan menulis komentar di bawah :)
Catatan Kaki:
[1] “QDialog”, Pyside v1.07 documentation, https://srinikom.github.io/pyside-docs/PySide/QtGui/QDialog.html, diakses tanggal 2 Oktober 2017
[2] “QErrorMessage”, Pyside v1.07 documentation, https://srinikom.github.io/pyside-docs/PySide/QtGui/QErrorMessage.html, diakses tanggal 2 Oktober 2017
[3] “QInputDialog”, Pyside v1.07 documentation, https://srinikom.github.io/pyside-docs/PySide/QtGui/QInputDialog.html, diakses tanggal 2 Oktober 2017
[4] “QProgressDialog”, Pyside v1.07 documentation, https://srinikom.github.io/pyside-docs/PySide/QtGui/QProgressDialog.html, diakses tanggal 2 Oktober 2017