Pembahasan Window Pada PySide

Menampilkan Window

Seperti pada program pertama kita dengan PySide. Menampilkan window perintahnya sangat sederhana sekali. Kita hanya perlu membuat instance dari QtGui.QWidget, mengatur ukuran, lalu memanggil fungsi show(). Dan window pun akan segera ditampilkan ketika program kita dieksekusi.

Seperti ini:

window = QtGui.QWidget()
window.resize(800, 600)
window.setWindowTitle('Jago Ngoding')
window.show()

Akan tetapi window kita akan tampil di pojok kiri atas (itu secara default). Lalu bagaimana kalau kita ingin memindahkannya di tengah?

Menampilkan Window di Tengah Layar

Jawabannya mudah. Sama seperti memindahkan QButton, QLabel, dan lain-lain. QWidget –sebagai parent class– memiliki fungsi move() yang akan menentukan di titik mana widget/window ditampilkan. Misalkan kita menambahkan kode berikut sebelum fungsi show() dipanggil:

...
...
window.move(100, 100)
...
...
window.show()

Maka window kita akan ditampilkan pada titik koordinat x = 100, dan y = 100 berdasarkan koordinat layar.

Berarti, untuk menampilkan window di tengah-tengah layar, kita harus melakukan sedikit perhitungan. Secara garis besar rumusnya sebagai berikut:

koordinatX = (panjangLayar / 2 ) - (panjangWindow / 2)
koordinatY = (tinggiLayar / 2) - (panjangLayar / 2)

Penerapannya secara prosedural:

...
...
frameSize = window.frameSize() # mengambil ukuran window
screenSize = QtGui.QDesktopWidget().screenGeometry() # mengambil ukuran desktop
xPoint = screenSize.width() / 2 - frameSize.width() / 2 # mengambil titik x tengah
yPoint = screenSize.height() / 2 - frameSize.height() / 2 # mengambil titik y tengah
# memindahkan window ke titik x, dan y hasil dari perhitungan di atas
window.move(xPoint, yPoint)

Well, cara di atas cukup simpel. Tapi bisa disederhanakan menjadi seperti berikut menggunakan helper dari PySide.

frameWindow = window.frameGeometry()
centerPoint = QtGui.QDesktopWidget().availableGeometry().center()
frameWindow.moveCenter(centerPoint)
window.move(frameWindow.topLeft())

Anda bisa menggunakan cara yang pertama atau cara yang kedua.

Menutup Window

Cara terbaik untuk menutup window adalah dengan mengklik tombol X pada pojok kanan atas. Atau dengan menekan kombinasi tombol alt+f4. Ini akan memberhentikan aplikasi. Ada pun, di sini kita akan mencoba menutup window secara program tanpa harus menekan tombol X di pojok kanan atas atau dengan menekan tombol alt+f4.

Tambahkan tombol dari kelas QtGui.QPushButton pada window kalian.

button = QtGui.QPushButton('Exit', window)
button.resize(button.sizeHint())
button.move(10, 10)

Lalu tambahkan event pada button.

button.clicked.connect(QtCore.QCoreApplication.instance().quit)

Penanganan event pada PySide menggunakan sistem signal dan slot. Ketika suatu event dikerjakan, maka sebuah sinyal akan dipicu, untuk kemudian slot yang diregister akan dieksekusi. Slot ini bisa berupa event bawaan dari Qt, atau pun juga bisa semua fungsi yang bisa dipanggil dari python.

Di atas, ketika tombol exit diklik, signal click akan dipicu. QtCore.QCoreApplication yang menghandle main event loop, dia juga bertanggung jawab memanagemen semua event yang dipicu. Dan fungsi instance() adalah untuk mengambil instance yang sedang aktif saat runtime. Sehingga ketika tombol exit diklik dan signal klik dipicu, fungi quit() akan dipanggil untuk memusnahkan dan menutup window.

Kode Program

Berikut kode program keseluruhannya.

Versi Prosedural

import sys
from PySide import QtGui, QtCore

"""
Jago Ngoding tutorial PySide bahasa Indonesia

author: Ibnu Jakaria
"""

# mendeklrasikan QtGui applikasi
app = QtGui.QApplication(sys.argv)

window = QtGui.QWidget()
icon = QtGui.QIcon('smile.png')

button = QtGui.QPushButton('Exit', window)
button.resize(button.sizeHint())
button.move(10, 10)
button.clicked.connect(QtCore.QCoreApplication.instance().quit)

window.resize(800, 600)
window.setWindowTitle('Belajar PySide')
window.setWindowIcon(icon)

# frameSize = window.frameSize()
# screenSize = QtGui.QDesktopWidget().screenGeometry()
# xPoint = screenSize.width() / 2 - frameSize.width() / 2
# yPoint = screenSize.height() / 2 - frameSize.height() / 2
# window.move(xPoint, yPoint)

frameWindow = window.frameGeometry()
centerPoint = QtGui.QDesktopWidget().availableGeometry().center()
frameWindow.moveCenter(centerPoint)
window.move(frameWindow.topLeft())

window.show()

sys.exit(app.exec_())

Versi OOP

import sys
from PySide import QtGui, QtCore

"""
Jago Ngoding tutorial PySide berbahasa Indonesia

author: Ibnu Jakaria
"""

class Jendela(QtGui.QWidget):

  def __init__(self):
    super(Jendela, self).__init__()

    self.icon = QtGui.QIcon('smile.png')
    self.siapkanUI()
    self.tampilkanDitengah()

  def siapkanUI(self):
    self.resize(800, 600)
    self.setWindowTitle('Jago Ngoding')
    self.setWindowIcon(self.icon)
    self.siapkanTombol()

  def tampilkanDitengah (self):
    # frameSize = self.frameSize()
    # screenSize = QtGui.QDesktopWidget().screenGeometry()
    # xPoint = screenSize.width() / 2 - frameSize.width() / 2
    # yPoint = screenSize.height() / 2 - frameSize.height() / 2
    # self.move(xPoint, yPoint)

    frameWindow = self.frameGeometry()
    centerPoint = QtGui.QDesktopWidget().availableGeometry().center()
    frameWindow.moveCenter(centerPoint)
    self.move(frameWindow.topLeft())

  def siapkanTombol(self):
    self.button = QtGui.QPushButton('Exit', self)
    self.button.resize(self.button.sizeHint())
    self.button.move(10, 10)
    self.button.clicked.connect(QtCore.QCoreApplication.instance().quit)

app = QtGui.QApplication(sys.argv)
jendela = Jendela()
jendela.show()
sys.exit(app.exec_())