PyQT Dersleri - 4

Önceki PyQt yazılarımızda da bahsettiğimiz gibi oluşturduğumuz uygulamalara sistem genelindeki simgeleri (Milky, Oxygen simge setleri gibi) kolayca eklemeyi, ana penceremizin herhangi bir yerine resim ya da bir çizim eklemeyi, ana penceremizde bir düğmeye ya da menüye tıkladığımızda başka bir pencere gelmesini ve gelen pencereyi kaydettirerek bu pencereyle işlem yapmayı anlatan güzel konulardan bahsedeceğiz. Konuların hepsini aynı program üzerinde anlatmaya çalışacağım.

 

Yaptığımız Minik Uygulama

Yazdır düğmesine basarak ekrana herhangi bir yazı, rakam, Özgürlükİçin ve seçtiğimiz bazı işletim sistemlerin isimlerini yazdırmaya yarayan basit bir program. Programdaki amaç, günlük yaşantımızda kullandığımız araçların bazı durumlarda ne kadar kolay yapılabileceğini göstermektir.

 

Ana Penceremizi Oluşturalım

Hemen Qt4 Tasarımcı'yı açarak ekran görüntüsündeki gibi Main Window'u seçerek yeni bir pencere oluşturuyoruz.

Qt4 Tasarımcı ile ana menü oluşturma

Penceremize menü eklemek için oluşturduğumuz pencerede “Buraya Yaz” kısmına “Dosya” yazıp açılan menüdeki “Buraya Yaz” kısmında da “Kapat” yazıp bu menüyü kapatıyoruz. Daha sonra tekrar “Buraya Yaz” kısmından “Ayarlar” yazıp onun alt sekmesine de şekildeki gibi “Yapılandır” yazıp yine boş bir yere tıklayıp sekmeyi kapatıyoruz.

Menü ekleme

Penceremize sol taraftan Input Widgets bölümünden bir tane Line Edit ve bir tanede Spin Box alıp ana pencereye sürüklüyoruz. Item Widget'ten bir tane de List Widget alıyoruz. Display Widgets bölümünden de Label alıp aynı şekilde penceremize sürüklüyoruz. Son olarak Buttons kısmından Push Button alarak resimdeki gibi yerleştiriyoruz.

Uygulamaya çeşitli öğelerin eklenmesi

 

Penceredekilere Simge Eklemek

Simge ekleme işlemiİlk olarak Label'den başlayalım. Hemen Label'e tıklıyoruz. Daha sonra “pixmap” yerine tıklayıp aşağı ok simgesine basarak şekildeki gibi “Choose File” seçeneğini seçiyoruz ve gelen ekrandan eklemek istediğiniz simgeyi label'e ekliyoruz. Ben /usr/share/icons/milky/64x64/places/start-here-kde-2.png adresindeki Pardus logosunu seçtim. Böylece sistemdeki simgeleri kullanmış oldum :).

Push Button'a da aynı yerden, aynı pencereden simge alacağız, fakat “pixmap” yerine “Icon” yazan yerden aynı şekilde /usr/share/icons/ adresinden herhangi bir simge alıyoruz. Yine aynı şekilde Dosya ve Ayarlar yazan yerlere tıklayarak önceki resimdeki “Icon” kısmından simge ekliyoruz. Yine aynı şekilde faremizle MainWindow'a tıklayarak aynı yerden simge ekleyip “WindowTitle” bölümünden penceremize bir başlık verebiliriz.

Daha sonra F4 tuşuna basıp ardından Push Button'a tıklayıp ok işaretini MainWindow'da boş bir alana resimdeki gibi yapıştırın ve F3 tuşuna basarak Sinyal/Slot Düzenlemesini kapatabilirsiniz. Sonrasında yaptığımız programı “mainwindow.ui” ya da başka bir isimde ui biçiminde kaydedelim.

Sinyal slot bağlantıları

 

Uygulamanın Koda Çevrilmesi

Uygulamanın bulunduğu dizinde aşağıdaki komutu kendi oluşturduğunuz .ui dosyasına göre düzenleyip çalıştırıyoruz. Ben mainwindow.ui şeklinde kaydettiğim için komutu şu şekilde veriyorum:

pyuic4 mainwindow.ui -o ui_mainwindow.py

 

Uygulamayı Kodlayalım

Evet, elimizde programın ana kodları var. Bu ana koda hiç dokunmadan “mainwindow.py” isimli bir Python dosyası oluşturuyoruz. mainwindow.py dosyasını açıp en üstüne şunları yapıştırıyoruz.

#!/usr/bin/python
# -*- coding: utf-8 -*-

from PyQt4 import QtCore
from PyQt4 import QtGui
from ui_mainwindow import Ui_MainWindow
import sys,

Buradaki from ui_mainwindow import Ui_MainWindow satırıyla ui_mainwindow.py dosyasını çağırıyoruz.

class MainWindow(QtGui.QMainWindow, Ui_MainWindow):
def __init__(self):
QtGui.QMainWindow.__init__(self)
self.setupUi(self)
self.statusBar().showMessage(unicode("Hazır\n"))

Yukarıdaki kodu da import sys satırının hemen aşağısına yapıştırıyoruz. Bu kod penceremizi işlevsiz olarak başlatacak.

self.statusBar().showMessage(unicode("Hazır\n")) da açılan pencerenin durum çubuğuna “Hazır” kelimesini yazdıracaktır. Buradaki unicode() Türkçe harfleri sorunsuzca kullanmamızı sağlıyor. Şimdi vereceğim kodlarla penceremizdeki düğmemize görev atayacağız.

@QtCore.pyqtSignature("bool")
def on_pushButton_clicked(self):
spin = str(self.spinBox.text())
liste = self.listWidget
ekle = str(self.lineEdit.text())
liste.addItem(ekle)
liste.addItem(spin)

Buradaki @QtCore.pyqtSignature("bool") ifadesi düğmeyi iki kere tıklamaktan koruyor. def on_pushButton_clicked(self): da bizim düğmemiz pushButton olarak ui_mainwindow.py'de geçtiği için pushButton yazıyoruz ve bu kodla düğmemize görev atıyoruz.

     spin = str(self.spinBox.text())
liste = self.listWidget
ekle = str(self.lineEdit.text())
liste.addItem(ekle)
liste.addItem(spin)

Bu kodları grup olarak incelersek spin, liste, ve ekle kelimeleri ile Qt araçlarına değişken atadık. liste.addItem() ile eklemek istediğimizi yazdık. Bu kodun içine ekle ve spin yazarak spinBox ve lineEdit'e yazılanı düğmemiz aracılığıyla listWidget'a yazdırabileceğiz.

Şimdi sıra geldi menülere. Menü için de şu kodları kullanacağız:

  @QtCore.pyqtSignature("bool")
   def on_actionKapat_triggered(self):
       self.close()

Evet yine @QtCore.pyqtSignature("bool") bu kodu kullandık. Ve yukarıda da bahsettiğim gibi def on_actionKapat_triggered(self): ile istediğimiz aracı ekledik. Yani Dosya menüsünün altındaki Kapat'a işlev verdik. Self.close() ile penceremizi kapatmayı sağladık ve menü için  _triggred(self) kullandığımıza dikkat edelim.

listWidget eklemeAyarlar menüsü için de Qt tasarımcıdan “Main Window” yerine “Dialog without Buttons” seçeneğini seçip bir diyalog oluşturuyoruz. Bu diyalog penceresini Ayarlar olarak kullanacağız. Benim bu pencerede kullanmak istediğim Check Box ve Combo Box araçlarıdır. Resimdeki gibi araçları alın ve pencerenin üzerine şekildeki gibi sürükleyin. Check Box aracına çift tıklayarak yazmak istediğiniz şeyi girin. Ben “Özgürlükİçin'i Ekle” yazdım. Çünkü listWidget'a “Özgürlük İçin'i Ekle”yi yazdıracağım.

Daha sonra resimdeki gibi Combo Box'a çift tıklayarak eklemek istediğiniz isimleri yazıyoruz. Bu isimlere resim eklemek için yine ekran görüntüsündekileri yapmalısınız.

Combo Box ayarları

Ekran görüntüsündeki gibi bir İşletim Sistemini seçip eklemek istediğimiz simge varsa penceredeki Properties düğmesine tıklamalısınız. Aşağıdaki ekran görüntüsündeki gibi ve önceden de bahsettiğim gibi istediğimiz simgeyi ekliyoruz.

Simge seçme

Ben yine Pardus logosunu koydum :)

Sinyal slot bağlantılarıSonra pencerede iken F4 tuşuna basıp Sinyal/Slot ayarlarını şekildeki gibi düzenlemelisiniz. Burada Kaydet düğmesini clicked() > accept() şeklinde seçmelisiniz. Çünkü böyle yaparsak penceredeki tüm şekilleri kaydeder. Bizim istediğimiz de zaten kaydetmesidir. Kapat düğmesini de clicked > close() seçeneğini seçmeniz yeterli. Yine düğmelere resim eklemek için yukarıdaki dediklerimi uygulamalısınız.

Penceremiz hazır olduğuna göre penceremizi dialog.ui şeklinde kaydedelim. Dosyamızın bulunduğu yerde şu komutu her zamanki gibi veriyoruz.

pyuic4 dialog.ui -o dialog.py

Oluşan diyalog.py dosyasını mainwindow.py ve ui_mainwindow.py dosyasının bulunduğu yerde olduğuna emin olalım.

Tekrar mainwindow.py dosyasını açıp from dialog import Ui_Dialog as Ayarlari kod parçasını from ui_mainwindow import Ui_MainWindow kodunun altına yapıştırıyoruz. Ve ardından bu kodların üstüne aşağıdaki kodları yapıştırıyoruz.

class Ayarlar(QtGui.QDialog, Ayarlari):
   def __init__(self):
       QtGui.QDialog.__init__(self)
       self.setupUi(self)

class MainWindow(QtGui.QMainWindow, Ui_MainWindow):
   def __init__(self):
       QtGui.QMainWindow.__init__(self)
       self.setupUi(self)
       self.statusBar().showMessage(unicode("Hazır\n"))
       self.ayarlar = Ayarlar()

Böylece Ayarlar kısmından Yapılandır'ı seçip penceremizi çağırabileceğiz fakat şimdi çağırsak penceremiz gelemez. Çünkü bu pencereyi hangi tuş ile çağıracağız, yani nereye tıkladığımızda bu pencere gelecek. Bunu da Kapat menüsünü yaptığımız gibi gerçekleştireceğiz. Bunu yapmadan önce self.ayarlar = Ayarlar() ifadesini aşağıdaki kodun altına yapıştırmayı unutmayalım.

class MainWindow(QtGui.QMainWindow, Ui_MainWindow):
   def __init__(self):
       QtGui.QMainWindow.__init__(self)
       self.setupUi(self)
       self.statusBar().showMessage(unicode("Hazır\n"))
       self.ayarlar = Ayarlar()

Evet sıra geldi Yapılandır menüsüne. Kodun hepsini verip birlikte inceleyelim.

  @QtCore.pyqtSignature("bool")
   def on_actionYap_land_r_triggered(self):
       self.ayarlar.exec_()

Bu kod ile diyalog (ayarlar penceresini) çağırabileceğiz. self.ayarlar = Ayarlar() ile self.ayarlar.exec_() kodunu yazabildik. def on_actionYap_land_r_triggered(self): ifadesindeki actionYap_land_r kısmını ui_maiwindow.py dosyasından biliyorduk.

 

Combo Box ve Check Box Kullanımı

Combo Box ve Check Box'ın mantığına kısaca değinip kaldığımız yerden kodlamaya devam edeceğiz. Combo Box kullanımının genel ve ana mantığı şu şekilde. Eğer Combo Box'ta şu yazıyorsa şöyle yap gibi bir mantığı var. Check Box'ın mantığı da; eğer Check Box seçiliyse şöyle yap, seçili değilse şöyle yap seklindedir. Uygulamamıza devam edelim...

ComboBox 'ımıza ve Ceheck Box 'ımıza değişken veriyoruz:

  @QtCore.pyqtSignature("bool")
   def on_pushButton_clicked(self):
       liste = self.listWidget
       cbx = str(self.ayarlar.comboBox.currentText())
       liste.addItem(cbx)
       spin = str(self.spinBox.text())        
       ekle = str(self.lineEdit.text())
       liste.addItem(ekle)
       liste.addItem(spin)
       if(self.ayarlar.checkBox.isChecked() == True):
           liste.addItem(unicode("Özgürlük İçin"))

Bu kodu da mainwindow.py dosyasına kopyalıyoruz. Combo Box ve Check Box kullanırken self.ayarlar.comboBox.... dedik, bunu dememizdeki sebep ComboBox ve Check Box araçları diyalog (ayarlar) penceresinde olmasıdır.

Kodumuzun en alt kısımına programın çalışması için şu satırları eklemeliyiz:

app = QtGui.QApplication(sys.argv)
window = MainWindow()
window.show()
sys.exit(app.exec_())

Uygulamanın son hali

mainwindow.py dosyasının tamamı şuradaki gibi. Dosyaların tamamını ise şuradan indirebilirsiniz.

Elimden geldiğince Combo Box, Spin Box, Check Box, Line Edit kullanımını, Label aracına resim eklemeyi, ana pencereye yeni bir pencere ekleyerek o pencereyi ana pencere üzerinden kullanmayı anlatmaya çalıştım. Üşenmeden bu kadar yazıyı okuduğunuz için teşekkür ederim.

Bir hatamız olduysa affola :).

9 yorum .

yazdır
Son güncelleme: 16 Ağustos 2010