Yapay Zeka Labs: PyQt5 dersleri

PyQt5 dersleri etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster

6 Nisan 2020 Pazartesi

Design2Py Converter v1.5

PyQt5 ile arayüz geliştirirken tasarım yapmak için aşağıdaki şemada görüldüğü gibi 2 yöntem mevcuttur:

1) Kod ile tasarım yapmak,
2) Qt designer ile tasarım yapmak

Genellikle zaman kazandırdığı ve kolay olduğu için Qt Designer ile tasarım yapmayı tercih ediyorum. Qt Designer ile tasarım yapıldığında bu tasarımın Python ile kullanılması gerekmektedir. Bu aşamada da 2 farklı yöntem mevcuttur:

1) Pyuic5 ile hazırlanan tasarım Python kodlarına dönüştürülür.
2) loadUi fonksiyonu ile tasarım Python tarafından çağrılır.

loadUi fonksiyonu kullanıldığında arayüz elemanları proje geliştirirken okunamadığı için kod tamamlama özelliği çalışmıyor. Bu özellik çalışmadığında hem arayüz elemanları nesne adlarıyla çağrılırken hem de arayüz elemanlarının sahip olduğu özellikleri (fonksiyonları) kullanırken zorlanıyorsunuz. Bu sebeple hazırlamış olduğum tasarımı Pyuic5 ile Python kodlarına dönüştürmeyi tercih ediyorum. Pyuic5 dönüştürücüsünün nasıl kullanıldığını Ücretsiz PyQt5 Dersleri eğitim serisinde bulabilirsiniz. Biraz zahmetli, hataya açık ve arayüz geliştirirken vakit alan bir işlem olduğu için bu işlemleri daha kolay yapabilmek adına Design2Py Converter programını geliştirdim. YouTube kanalımda PyQt5 derslerini anlatırken sıklıkla kullandım ve mail aracılığı ile isteyenlere ücretsiz olarak verdim. (Bu yazının yazıldığı tarih itibariyle benden 109 kişi programı istedi. Eğer onlarda verdiğim linki başkalarıyla paylaştıysa gerçek kullanıcı sayısı daha fazla olabilir.) Design2Py Converter v1.3 hakkında detaylı bilgilere buradan ulaşabilirsiniz.

Design2Py Converter v1.3'te Karşılaşılan Hatalar

Programı farklı işletim sistemlerinde çok sayıda kişi kullandı ve geri bildirim olarak aşağıdaki hataları bildirdiler:

1) Farklı PyQt5 versiyonlarında Pyuic5'in farklı yapıda olmasından dolayı bir versiyonda başarılı bir şekilde dönüşüm yaparken (PyQt 5.6 - pyuic5.bat) bir başka versiyonda (PyQt 5.11.3 - pyuic5.exe) dönüşüm yapmaması.
2) Pyuic5 veya Pyrcc5 in bulunduğu klasör yolunu bulmak için ortam değişkenlerine erişmeye çalışıyordum ve bu sebeple programın kapanması.

Yeni özelliklerin olduğu ve bahsedilen hataların olmadığı v1.5 hazırlandı.

Design2Py Converter v1.5'te Yenilikler

1. Dil Desteği

Design2Py Converter v1.5 Türkçe ve İngilizce olmak üzere 2 farklı dilde çalışabilmektedir. Dil tercihi menüden değiştirilebilmektedir.

2. Ayarları Kaydetme-Yükleme Özelliği

Kullanım kolaylığı için getirilen bir özelliktir. Programı kapatmadan önce mevcut ayarlarını (dil tercihi, seçilen sekme (sayfa) ve dosya yolları) kayıt ederseniz ve programı daha sonra açtığınızda kaldığınız yerden devam edebilmek için kaydetmiş olduğunuz ayarları yükleyebilirsiniz. Böylelikle her seferinde dosya yollarını ayarlamak zorunda kalmazsınız.

Ayrıca Programın bulunduğu klasör içerisinde formata uygun (program tarafından oluşturulmuş) init.json adında ayarlar dosyası varsa, Design2Py Converter bu dosyada yer alan ayarlara göre açılacaktır. Bu özellik sayesinde kaydetmiş olduğunuz ayarları tekrar yüklemenize ihtiyaç duymayacaksınız.

3. Yardım Menüsünde Yapılan Değişiklikler

Yardım menüsünde 2 ufak değişiklik yapılmıştır. Daha önce YouTube kanalıma yönlendiren link zaten PyQt5 Dersleri ile YouTube kanalına gidilebildiği için Blog sayfama yönlendirilmiştir ve adı Yapay Zeka Labs Blog olarak değiştirilmiştir. İkinci olarak Sürüm Notları seçeneği ile program ve versiyon hakkında detaylı bilgilere ulaşılması adına bu sayfaya yönlendirme sağlanmıştır.

4. Yapay Zeka Labs Sekmesi

Giriş sekmesinde bulunan Yapay Zeka Labs logosuna tıkladığınızda Yapay Zeka Labs YouTube kanalım açılacaktır.

5. ui-2-py Sekmesi

Programın farklı PyQt5 versiyonlarında Pyuic5'in farklı yapıda olmasından dolayı bir versiyonda başarılı bir şekilde dönüşüm yaparken (PyQt 5.6 - pyuic5.bat) bir başka versiyonda (PyQt 5.11.3 - pyuic5.exe) dönüşüm yapmaması en büyük problemdi ve bu problemden kurtulmak için Pyuic5 bileşeninin kullanımını iptal ettim. Dönüşüm işleri programın içinde gerçekleşmektedir. Bu sekmede kullanıcının yapması gereken tek şey dönüştürmek istediği tasarımı Tasarımı (.ui) Seç butonuna basarak seçmesidir. Önceki versiyonda (v1.3) Python kodlarına dönüştürülen tasarım mevcut tasarım ile aynı klasöre ve tasarım adının sonuna _python eklenerek kaydediliyordu. Kullanıcıya kayıt isminde ve klasör yolunda değişiklik yapma hakkı tanıdım. İsterse Kayıt Yoluna Gözat tuşuna basarak değişiklik yapabilir. Son olarak dönüşüm işlemini gerçekleştirmek için kullanıcının Dönüştür ui -> py tuşuna basması gerekiyor.

Buna ek olarak Pyuic5'in hangi klasörde olduğunu bulmak için "Ortam Değişkenlerine" erişmeye çalışmamdan kaynaklanan sorunlardan da kurtulmuş oldum.

6. qrc-2-py Sekmesi

"Ortam Değişkenlerine" erişerek Pyuic5 ve Pyrcc5 in bulunduğu klasör yolunu kullanıcıyı yormadan bulmam güzel bir özellikti ancak farklı kullanıcılarda bahsettiğim gibi sorunlara yol açmıştı. Arayüz açılırken kayıtlı ayarlarla açılması ve mevcut ayarların kayıt edilmesi özelliklerini getirerek yine kullanıcıyı yormadan ihtiyaç duyulan klasör yolları otomatik bulunacaktır. Kullanıcının klasör yollarını değiştirmediği sürece sadece bir defa bilgisayarında Pyrcc5'in bulunduğu klasör yolunu bulması gerekecektir. Pyrcc5'e Gözat tuşuna basılarak Pyrcc5 seçildikten sonra Dosyayı (.qrc) Seç tuşuna basılarak Python kodlarına dönüştürülmek istenen Qt Kaynak Dosyası seçilmelidir. Son olarak Python kodlarını elde etmek için Dönüştür qrc->py tuşuna basılmalıdır.

Burada Python kodlarına dönüştürülen Qt kaynak dosyası mevcut Qt kaynak dosyası ile aynı klasöre aynı ismin sonuna _rc eklenerek kaydedilmektedir.

Design2Py Converter v1.5 İndirme Bağlantıları

İşletim Sistemi	Design2Py Converter	Yayınlanma Tarihi
Windows 7-10	v1.5.0	08.04.2020 - 19:34
Ubuntu 16.04	v1.5.0	08.04.2020 - 19:44
Ubuntu 18.04	v1.5.0	09.04.2020 - 00:50
MacOS High Sierra 10.13	v1.5.0	19.05.2020 - 13:40
Raspbian	-	-
Ubuntu Mate	-	-

Test Edilen PyQt5 Versiyonları

Aşağıdaki tabloda Design2Py Converter programının test edildiği ve herhangi bir sorunla karşılaşılmayan PyQt5 versiyonları gösterilmektedir. Benim tek başıma her işletim sistemi için ve her PyQt5 versiyonu için test etmek için vaktim olmadığından sizler de burada yer almayan PyQt5 versiyonları kullanıyorsanız, programın o versiyonlar için de durumunu yorum olarak bildirirseniz tabloyu o bilgiler ışığında güncelleyeceğim.

İşletim Sistemi	Test Edilen PyQt5 Versiyonları
Windows 7-10	5.6.0 - 5.11.3 - 5.13.2
Ubuntu 16.04	5.11.3
Ubuntu 18.04	5.13.1
MacOS High Sierra 10.13	5.11.3
Raspbian	-
Ubuntu Mate	-

20 Şubat 2019 Çarşamba

PyQt5'de Signal - Slot Kavramı

PyQt5 Signal - Slot (İşaret - İşlev) Kavramı

Qt birden çok platformu destekleyen (cross-platform) masaüstü, gömülü sistem ve mobil ortamlar için grafiksel kullanıcı arayüzü geliştirmemizi sağlayan bir araçtır. Qt ile kullanıcı arayüzü geliştirmek için C++ programlama dili kullanılmaktadır. PyQt5, Qt programını Python ile kullanmamızı sağlar. PyQt5 hakkında detaylı açıklamalara önceki yazılarımdan ulaşabilirsiniz:

PyQt5 (pip ile) Windows Kurulumu
PyQt5 ile Grafiksel Kullanıcı Arayüzü Geliştirme

Bu yazıda

Signal-slot nedir ?

Signal-slot mekanizması nasıl çalışır ?

Öntanımlı (Default) işaretler (signal) nedir, nasıl kullanılır ?

Qt Designer ile signal-slot bağlantısı nasıl yapılır ?

Kod yazarak signal-slot bağlantısı nasıl yapılır ?

Kendimiz işaret (signal) tanımlayabilir miyiz ?

Signal-slot bağlantısı nasıl kaldırılır (iptal edilir)?

sorularına cevap bulacağız.

1. Signal - Slot Nedir ? Signal - Slot Mekanizması Nasıl Çalışır ?

Signal, Türkçe'de hem sinyal hem de işaret olarak kullanılmaktadır. Slot kelimesinin ise yuva anlamı vardır. Aslında slot programlama dili açısından düşünüldüğünde fonksiyon olarak kullanılabilir. Fonksiyon da dilimizde yaygın olarak kullanılan bir kelime olmasına karşın Türkçe karşılığı işlev'dir. Signal-Slot yerine işaret-işlev diyebiliriz ancak bu kavram Qt'ye özgü bir kavram olduğu için signal-slot kavramından işaret-işlev olarak bahsedildiğinde anlam karmaşası olabilir. Bu sebeple yazının geri kalan bölümünde signal-slot olarak orijinal hali ile kullanmayı planlıyorum. Signal-Slot bana göre Qt'de dolayısıyla PyQt5'de arayüz geliştirmek için öğrenilmesi gereken en önemli kavram. Signal-Slot yapısı kullanılmadan kullanıcıya sadece yapmış olduğunuz tasarımı verebilirsiniz. Signal-Slot yapısı kullanılmadan yapılan bir arayüz yani tasarım üzerinde kullanıcı hiç bir işlem yapamaz. Kullanıcıya arayüz ile sunulan özelliklerin bir karşılığının olması ancak signal-slot yapısı ile sağlanır.

Signal-slot kavramını yukarıda yer alan animasyon üzerinden anlatmaya çalışalım. Animasyonun sol üst köşesinde bir kullanıcı yer alıyor, sağ üst köşede ise bizim hazırlamış olduğumuz bir kullanıcı arayüzü olduğunu varsayalım. Kullanıcı, hazırlamış olduğumuz arayüz üzerinde bir eylemde bulunduğunda örneğin bir tuşa bastığında bir sinyal yayınlanır ve bu sinyal bir fonksiyona bağlı ise o fonksiyon çağrılır ve fonksiyon içerisinde yer alan işlem gerçekleştirilir. Arayüzü hazırlayan kişi arayüz elemanları ve fonksiyonlar arasında signal-slot bağlantıları yapar ve kullanıcı arayüz üzerinde bir işlem yaptığında ilgili fonksiyon çağrılır. Signal-slot mekanizması bu şekilde çalışır. Örneklerle birlikte bu kavramı daha iyi anlayacaksınız.

2. Öntanımlı (Default) İşaretler (Signals) Nedir? Öntanımlı İşaretler Nasıl Kullanılır ?

Öntanımlı (default) işaretler Qt tarafından önceden tanımlanmış parçacığa özgü işaretlerdir. Bu hazır işaretler çok rahatlıkla kullanılabilir. Yazının ilerleyen bölümlerinde öntanımlı işaretlerin kullanımını örneklerle daha iyi anlayacaksınız. Örneğin basılabilir tuşun (QPushButton) tıklandı (clicked), basıldı (pressed), bırakıldı (released) gibi öntanımlı işaretleri bulunmaktadır. Bu işaretleri fonksiyonlara bağladığınızda ve kullanıcı bu tuş üzerinde bir eylemde bulunduğunda ilgili fonksiyonlar çalıştırılır.

3. Qt Designer ile Signal - Slot Bağlantısı Nasıl Yapılır ?

Qt Designer ile signal-slot bağlantısı yapmak için öncelikle Qt Designer açılır. Qt Designer içerisinde yer alan menüde bulunan Edit sekmesine tıklanır ve bu sekmede yer alan Edit Signals/Slots seçeneğine tıklanır.

Aynı işlemi F4 tuşuna basarak ya da aşağıdaki şekilde belirtilen tuşa basarak gerçekleştirebilirsiniz.

Signals-slots moduna geçmeden önce 1) arayüz tasarımını tamamlamış olmalısınız ve 2) arayüz üzerinde yer alan parçacıkların hangi işlevleri yapacağını belirlemiş olmanız gerekir. Signal-slot kavramını anlatabilmek için yatay kaydırma butonu (QHorizontalSlider) ve etiket (QLabel) parçacıklarından oluşan aşağıdaki tasarım yapıldı. Burada kaydırma butonunun konumu değiştirtirildiğinde o anki pozisyonunun değeri QLabel da gösterilecektir. Arayüz tasarımını tamamladık ve arayüzde yer alan parçacıkların ne iş yapacakları tanımlandıktan sonra yukarıda anlatıldığı gibi Signals/Slots moduna geçiş yapılır.

Signals-slots modunda iken Yatay Kaydırıcıya (HorizontalSlider) farenin sol tuşu ile tıklanır ve bu tuşa basılı tutularak etiketin (Label) üzerine getirilir ve burada tuş bırakılır. Tuşu bırakır bırakmaz Configure Connection adında yeni bir pencere açılacaktır. Bu pencerenin sol bölümünde yatay kaydırıcıya ait öntanımlı (default) işaretler bulunmaktadır. Biz burada değer değişti (valueChanged(int)) işaretini seçiyoruz. Bu işaret kaydırıcının değeri değiştiğinde işaret yayar. Biz bu işareti bir slot'a yani fonksiyona bağladığımızda kaydırıcının her değeri değiştiğinde bu fonksiyon çağrılacaktır.

İşaret seçimini yaptıktan sonra pencerenin sağ bölümü aktif hale gelir ve burada öntanımlı (default) slot'lar yani fonksiyonlar bulunmaktadır. Hem işaretler için hem de slot'lar için öntanımlı işaret ve slotları kullanabildiğimiz gibi kendi işaret ve fonksiyonlarımızı da Edit butonuna basarak tanımlayabiliriz. Biz burada etiket (Label) için setNum(int) fonksiyonunu seçiyoruz.

Yukarıda yer alan ekran görüntüsünde gördüğünüz gibi yatay kaydırıcının (HorizontalSlider) değeri değiştirildiğinde bu değer etikete (Label) yazdırılmaktadır. Burada basit bir şekilde herhangi bir kod yazmadan Qt Designer ile signal-slot bağlantısı gerçekleştirmiş olduk. Bu yöntem benim tercih ettiğim bir yöntem değil bu yüzden örnek sayısını arttırmadan ve daha fazla detaya girmeden konunun bu kadar yeterli olduğunu düşünüyorum. Kod yazarak signal-slot bağlantısının nasıl yapıldığını bir sonraki bölümde inceleyeceğiz.

4. Kod Yazarak Signal-Slot Bağlantısı Nasıl Yapılır ?

Bu bölümde, yazının başında yer alan şemada gösterilen connect(), @pyqtSlot() ve pyqtSignal fonksiyonlarının kullanımını öğreneceğiz.

4.1. "connect()" Fonksiyonu ile Signal-Slot Bağlantısı

Qt Designer ile Signal-Slot bağlantısı bölümünde anlatılan Yatay kaydırıcı (QHorizontalSlider) ve etiket (QLabel) parçacıklarından oluşan tasarım bu bölümde de kullanılacak.

from PyQt5.QtWidgets import*
from qt_designer_python import Ui_MainWindow


class dersler_7(QMainWindow):

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

        self.ui = Ui_MainWindow()
        self.ui.setupUi(self)

        self.ui.horizontalSlider.valueChanged['int'].connect(self.set_current_value_slot)


    def set_current_value_slot(self, current_index):

        self.ui.label.setText("değer = " + str(current_index))


uygulama = QApplication([])
pencere = dersler_7()
pencere.show()
uygulama.exec_()

13 nolu satırda Yatay Kaydırıcının o anki değerini int tipinde değer gönderen "valueChanged" işareti 16 nolu satırda kendi tanımladığımız "set_current_value_slot" fonksiyonuna "connect" ile bağladık. Dikkat ederseniz yazmış olduğumuz slot yani fonksiyon "valueChanged" işaretinden gönderilen int tipindeki yatay kaydırıcının değerini alacak şekilde yazılmıştır. Daha detaylı bilgiye yazının en alt bölümünde yer alan videoyu izleyerek ulaşabilirsiniz.

4.2. @pyqtSlot() ile Sinyal-Slot Bağlantısı Yapma

Burada @pyqtSlot() ile signal-slot bağlantısı yaparken slot'a istediğimiz ismi veremiyoruz. Slot'a vereceğimiz isim aşağıda belirtilen formatta olması gerekir.

on_ nesne_adi_ sinyal_adi()

Bir önceki bölümde "connect()" fonksiyonu ile yapmış olduğumuz bağlantıyı aşağıdaki kodlarda @pyqtSlot() dekoratörü ile yaptık.

from PyQt5.QtWidgets import*
from PyQt5.QtCore import pyqtSlot
from qt_designer_python import Ui_MainWindow


class dersler_7(QMainWindow):

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

        self.ui = Ui_MainWindow()
        self.ui.setupUi(self)

    @pyqtSlot(int)
    def on_horizontalSlider_valueChanged(self, current_index):

        self.ui.label.setText("değer = " + str(current_index))


uygulama = QApplication([])
pencere = dersler_7()
pencere.show()
uygulama.exec_()

2 nolu satırda QtCore modülünden pyqtSlot sınıfını kodlarımıza eklediğimize dikkat ediniz. Daha detaylı bilgiye yazının en alt bölümünde yer alan videoyu izleyerek ulaşabilirsiniz.

Bir İşaret birden fazla Slot'a bağlanabilir

Birden fazla İşaret bir Slot'a bağlanabilir

Bir İşaret başka bir İşaret'e bağlanabilir

4.3. pyqtSignal() ile Sinyal Oluşturma

Bu bölümde pyqtSignal() kullanımına örnek verebilmek için aşağıdaki akış diyagramını gerçekleştiren kodlar yazıldı.

from PyQt5.QtWidgets import*
from PyQt5.QtCore import pyqtSignal
from qt_designer_python import Ui_MainWindow


class dersler_7(QMainWindow):

    my_signal = pyqtSignal(int)

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

        self.ui = Ui_MainWindow()
        self.ui.setupUi(self)

        self.ui.horizontalSlider.valueChanged[int].connect(self.my_signal[int])

        self.my_signal[int].connect(self.my_slot)


    def my_slot(self, current_index):

        self.ui.label.setText("değer = " + str(current_index))


uygulama = QApplication([])
pencere = dersler_7()
pencere.show()
uygulama.exec_()

2 nolu satırda QtCore modülünden pyqtSignal sınıfını kodumuza eklediğimize dikkat ediniz. 8 nolu satırda int tipinde değer gönderen-alan kendi sinyalimizi tanımladık. Yatay kaydırıcının valueChanged sinyalini kendi tanımlamış olduğumuz sinyale 16 nolu satırda bağladık. Bu bağlantı ile bir sinyalin bir başka sinyale bağlanabildiğini görmüş olduk. Son olarak kendi tanımladığımız sinyali yine kendi tanımladığımız slot'a 18 nolu satırda bağladık. Kaydırıcının değeri değiştiğinde valueChanged sinyali yayınlanacak dolayısıyla buna bağlı olan sinyalimiz de yayınlanmış olacak ve kendi sinyalimize bağlı my_slot() fonksiyonu çağrılarak etikte yatay kaydırıcının değeri yazdırılacak. Bu tarz bağlantılar bu uygulama için gereksiz olsa da daha karmaşık arayüzler hazırladığınızda bu tür bağlantılara ihtiyacınız olacak.

Kendi tanımlamış olduğumuz işaretin yayınlanmasını sağlayan emit() fonksiyonu kullanımına örnek verebilmek için aşağıdaki akış diyagramını gerçekleştiren kodlar yazıldı.

from PyQt5.QtWidgets import*
from PyQt5.QtCore import pyqtSignal
from qt_designer_python import Ui_MainWindow


class dersler_7(QMainWindow):

    my_signal = pyqtSignal(int)

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

        self.ui = Ui_MainWindow()
        self.ui.setupUi(self)

        self.ui.horizontalSlider.valueChanged['int'].connect(self.set_current_value_slot)
        self.my_signal[int].connect(self.my_slot)
        
        
    def set_current_value_slot(self, current_index):
        
        self.my_signal.emit(current_index)


    def my_slot(self, current_index):

        self.ui.label.setText("değer = " + str(current_index))


uygulama = QApplication([])
pencere = dersler_7()
pencere.show()
uygulama.exec_()

5. Signal-slot bağlantısı nasıl kaldırılır (iptal edilir)?

Signal-slot bağlantısı yaparken connect() fonksiyonunu kullanarak yazmış olduğumuz ifadenin aynısını disconnect() ifadesiyle yazıyoruz. Eğer disconnect(slot_adi) yazarsak sadece yazmış olduğumuz slot ile bağlantı koparılır. disconnect() fonksiyonunu içerisinde hiçbir ifade yer almayacak şekilde yazarsak belirtilen işaret ile yapılmış olan tüm slot bağlantıları kaldırılır. Signal-slot bağlantısının iptal edilmesi çok sık kullanılan bir yöntem değildir ama arayüz geliştirirken ihtiyaç duyacağınız durumlar olabilir.

Signal-slot mekanizması kolay ve esnek kod yazmamızı sağlayan Qt nin sağlamış olduğu en önemli özelliklerden biridir. Bu yazıda signal-slot kavramını, signal-slot mekanizmasının nasıl çalıştığını, nasıl signal-slot bağlantısının yapıldığını elimden geldiğince anlatmaya çalıştım. Detaylı açıklamalara aşağıdaki videoyu izleyerek ulaşabilirsiniz.

25 Ocak 2019 Cuma

PyQt5 (pip ile) Windows Kurulumu

Qt, çok gelişmiş bir Grafiksel Kullanıcı Arayüz (GKA) (Graphical User Interface, GUI) hazırlama programıdır. Qt ile profesyonel arayüzler hazırlanabilmektedir. Qt'nin bana göre en önemli avantajı birçok işletim sisteminde (Windows, Linux, Mac) kullanılabiliyor olmasıdır. Bu özellik cross-platform olarak geçiyor. Qt'nin ticari ve Açık Kaynak (Open Source) olmak üzere 2 çeşit lisansı mevcuttur. Hobi amaçlı kullanım ücretsizdir. Qt ile yazılım geliştirmek için C++ programlama dilini biliyor olmanız gerekmektedir. C++ programlama dili; son yıllarda kullanım alanı çok hızlı bir şekilde genişleyen, öğrenmesi ve kod yazması kolay olan Python programlama diline göre zor bir programlama dilidir. Python son yıllarda veri bilimi, yapay zeka vb. bir çok alanda çalışan yazılımcıların ilk sıradaki tercihi olmaktadır. Hem Python programlama dilinin nimetlerinden yararlanmak hem de Qt ile arayüz geliştirmek istediğimizde karşımıza PyQt çıkmaktadır. PyQt, Qt'nin mevcut tanımlı özelliklerini Python ile kullanmamızı sağlayan köprü vazifesi gören ayrı bir programdır. Literatürde bu işlem "binding" kelimesi ile tanımlanmaktadır. PyQt Riverbank tarafından geliştirilmiştir. Ticari ve Açık Kaynak (GPL) lisansı vardır. Qt4 kullanımı sağlayan PyQt4 ve son çıkan Qt5 kullanımını sağlayan PyQt5 olmak üzere 2 çeşit Genel PyQt versiyonu vardır. Biz burada PyQt5 kurulumu yapacağız.

1. Önkoşullar

PyQt5 kurulumuna geçmeden Python 3.5 veya daha üst bir Python versiyonunun işletim sisteminize kurulu olması gerekir. Eğer windows işletim sisteminizde Python kurulu değilse Python Windows Kurulumu yazımı okumanızı tavsiye ederim. İlgili yazıda işletim sisteminizde Python'un kurulu olup olmadığını nasıl kontrol edeceğiniz veya hangi Python versiyonunun kurulu olduğunu nasıl öğreneceğinizi bulabilirsiniz. Ayrıca kurulum için kullanmayı planladığımız pip komutunun doğru kullanımı için pip nedir ? pip3 nedir ? nasıl kurulur ? yazımı okuyabilirsiniz.

2. Pip ile PyQt5 Kurulumu

Python programlama dili için yazılım deposu olan PyPI sitesinden pip komutu ile Python paketleri/kütüphaneleri kolay bir şekilde işletim sisteminize kurulur. PyQt5 için aşağıdaki komut çalıştırılarak kurulum gerçekleştirilir.




pip install PyQt5

Kullandığınız pip komutunun işletim sisteminizde yer alan Python versiyonlarından hangisine kurulum yapacağını kontrol ederek doğru Python versiyonu için kurulum yapınız.

Yukarıdaki tablodan görebildiğiniz gibi PyQt5 ile arayüz geliştirmek için 2 farklı seçenek mevcut. Bunlardan birincisi Kod yazarak tasarım ikincisi ise Qt Designer ile tasarım.

3. Qt Designer Kurulumu

Qt Designer ile yapılan tasarım da 2 farklı şekilde; Python kodlarına dönüştürülerek veya Python kodlarıyla birlikte kullanmak üzere Python ortamına yüklenerek kullanılabilir. pip ile yapılan kurulum bize sadece kod yazarak tasarım yapmamızı sağlar. Qt Designer kullanmak için aşağıdaki komut çalıştırılarak Windows işletim sisteminize designer kurulumu gerçekleştirebilirsiniz. Ayrıca bu kurulum ile Qt Designer tasarımını Python kodlarına dönüştüren (pyuic5) dönüştürücüsünün kurulumu da gerçekleştirilir.




pip install pyqt5-tools

Bu komut hakkındaki detaylı bilgiye ve kurulumun tüm detaylarına aşağıda yer alan videoyu izleyerek ulaşabilirsiniz.

22 Ocak 2019 Salı

PyQt5 Ubuntu Kurulumu

1. Pip ile PyQt5 Kurulumu

Linux işletim sistemlerinde Python kurulu gelmektedir. Aşağıdaki komutları çalıştırarak işletim sisteminizde kurulu bulunan Python2 ve Python3 versiyonlarını öğrenebilirsiniz.

python --version

python3 --version

Python programlama dili için yazılım deposu olan PyPI sitesinde PyQt5 paket kurulumu için detaylı açıklamalara ulaşabilirsiniz. Python 3.5 ve üzeri versiyonlar için aşağıdaki komutu çalıştırarak PyQt5 kurulumunu gerçekleştirebilirsiniz.

pip install PyQt5

Kullandığınız pip komutunun işletim sisteminizde yer alan Python versiyonlarından hangisine kurulum yapacağını kontrol ederek doğru Python versiyonu için kurulum yapınız. Bu konuda detaylı bilgiye Pip - Pip3 Nedir ? yazımdan ulaşabilirsiniz.

Yukarıdaki tablodan görebildiğiniz gibi PyQt5 ile arayüz geliştirmek için 2 farklı seçenek mevcut. Bunlardan birincisi Kod yazarak tasarım ikincisi ise Qt Designer ile tasarım.

2. Qt Designer Kurulumu

Qt Designer ile yapılan tasarım da 2 farklı şekilde; Python kodlarına dönüştürülerek veya Python kodlarıyla birlikte kullanmak üzere Python ortamına yüklenerek kullanılabilir. pip ile yapılan kurulum bize sadece kod yazarak tasarım yapmamızı sağlar. Qt Designer kullanmak için aşağıdaki komut çalıştırılarak Ubuntu işletim sisteminize designer kurulumu gerçekleştirebilirsiniz.

sudo apt-get install qttools5-dev-tools

Bu komut hakkındaki detaylı bilgiye yazının en alt bölümünde yer alan videoyu izleyerek ulaşabilirsiniz.

3. Pyuic5 Kurulumu

Qt Designer tasarımını Python kodlarına dönüştüren (pyuic5) dönüştürücüsünün kurulumu için aşağıdaki kodlar çalıştırılarak ihtiyaç duyulan kurulumlar yapılır.

sudo apt-get install python3-pyqt5

sudo apt-get install pyqt5-dev-tools

Bu komut hakkındaki detaylı bilgiye yazının en alt bölümünde yer alan videoyu izleyerek ulaşabilirsiniz.

10 Kasım 2018 Cumartesi

PyQt5 Qt Designer ile Matplotlib Kullanımı

PyQt5 ile Grafiksel Kullanıcı Arayüzü (GKA; Graphical User Interface, GUI) tasarımı yapmak için birçok seçeneğimiz var. Bunları 3 başlık altında toplamak mümkün. GUI tasarımını aşağıdaki yöntemlerle gerçekleştirebiliriz.

GUI tasarımını Kod yazarak gerçekleştirme

Qt Designer ile tasarım yapıp tasarımı Python kodlarına çevirme

Qt Designer ile tasarım yapıp bu tasarımı loadUi modülü yardımıyla Python kodlarında kullanmak

Bu yazıda 3 numaralı yöntem ile tasarım yapacağız. Burada PyQt5 kurulumu yaptığınızı varsayıyorum eğer yapmadıysanız PyQt5 kurulumu için aşağıdaki linkte yer alan yazımdan faydalanabilirsiniz.
Windows'a PyQt5 Kurulumu
PyQt5 ile arayüz tasarımının hangi yöntemlerle nasıl yapıldığını detaylı bir şekilde anlattığım yazımı da takip etmenizi öneririm.
PyQt5 ile Grafiksel Kullanıcı Arayüzü (GUI) Geliştirme

Bu yazıda Python programlama dilinde veri görselleştirme aşamasında en yaygın olarak kullanılan matplotlib modülünün Qt Designer ile tasarlanan PyQt5 arayüzünde nasıl kullanılacağından bahsedeceğim. Matplotlib sadece Python 3 ile kullanılmaktadır. Yukarıda PyQt5 kurulum linkini verdiğim yazıda Python 3.5 için kurulum yapmıştık. Aynı Python versiyonu ile Matplotlib kullanmamızda bir sakınca yok, gerekli şartı sağlıyor. Aşağıdaki komutu çalıştırarak Matplotlib kurulumunu kolayca gerçekleştirebilirsiniz.



pip install matplotlib

PyQt5 ve Matplotlib kurulumuna ek olarak NumPy modülünü Matplotlib ile çizdirmek istediğimiz verileri dizi olarak tutmak için kurmanızı tavsiye ederim. Aşağıdaki komutu kullanarak kolayca kurulumu gerçekleştirebilirsiniz.



pip install numpy

İhtiyaç duyulan tüm modüllerin kurulumu gerçekleştirmiş olduk. Matplotlib modlünün PyQt5 ile nasıl kullanılacağı matplotlib'in resmi sitesindeki örneklerde ([1], [2]) gösterilmiş ancak orada kod yazarak bir tasarım yapılmış. Bu sebeple orada var olan kodları tekrar etmemek için Matplotlib modülünün kod yazarak tasarım yapılan PyQt5 arayüzünde kullanımından bahsetmeyeceğim. Qt Designer ile tasarım yapıldığında nasıl kullanılacağından bahsedilmediğinden dolayı bu yazıda Qt Designer ile tasarım yapılan PyQt5 arayüzünde matplotlib modülünün nasıl kullanılacağından bahsedeceğim.

1. Qt Designer ile Tasarım

Adım 1.1.
Qt Designer açılır. Qt Designer'ı Başlat menüsünde yer alan PyQt klasöründen ya da Python kurulumunu yaptığınız klasörde ../Python35/Lib/site-packages/PyQt5 bulabilirsiniz.

Adım 1.2.
Qt Designer açıldığında daha önce hazırladığınız bir tasarımı açabilmenizi ya da yeni bir tasarım oluşturmanızı sağlamak amacıyla bir pencere çıkmaktadır. Burada temel olarak Dialog, Main Window ve Widget seçenekleri mevcut. Dialog kullanıcıdan bir seçenek seçmesini isteyen ya da kullanıcıyı bilgilendiren pencerelerdir. Main Window'da Widget penceresinden farklı olarak Menu (menubar) oluşturabilir ve arayüzün en alt bölümünde statusbar olarak adlandırılan bölümde kullanıcıya bilgilendirme mesajları sunabilirsiniz. Bu pencereden yeni bir tasarım için Main Window seçiyoruz. Siz farklı bir tercihte bulunabilirsiniz.

Adım 1.3.
Tasarlamak istediğimiz arayüzün ekran görüntüsünü aşağıda bulabilirsiniz. Bir tane buton ve bir tane grafikten oluşan, butona basınca grafiği güncelleyen basit bir arayüz. Tasarımın detaylarını yazarak anlatmak çok zor olduğundan yazının sonuna bir video koyacağım oradan bakabilirsiniz.

Adım 1.4.
Push Button ve Widget nesneleri sürükle-bırak yöntemiyle arayüze bırakılır.

Adım 1.5.
Widget üzerinde matplotlib ile üreteceğimiz grafikleri göstereceğiz. Bunun için fare (mouse) Widget'ın üzerindeyken sağ tıklanır ve açılan seçeneklerden Promote to ... seçilir.

Adım 1.6.
Promote to ... seçildikten sonra aşağıda ekran görüntüsünde gösterildiği gibi yeni bir pencere açılacaktır. Bu pencerede Promoted class name: yazan bölüme matplotlib kısaltması olan Mpl ön eki kullanılarak MplWidget yazılır. Siz istediğiniz ismi verebilirsiniz. Buraya yazdığınızda Header file: bölümü otomatik sizin yazdığınız isme göre dolacaktır. Sonra Add butonuna basılır.

Yukarıda bahsedilen adımlar tamamlandıktan sonra Promote butonuna basılır.

Not.
Yukarıda bahsedilen adımlara ek olarak arayüzde bulunan (Promote işlemi yapılan) Widget'ın nesne adı (objectName) Promoted class name değişkeni ile aynı isim yapılır.

Adım 1.7.
Son olarak yapmış olduğumuz tasarımı Ctrl + S tuş kombinasyonu ile .ui uzantılı olarak kaydediyoruz. Bu işlemle birlikte tasarım aşamasında yapılacaklar bitti. Şimdi Python kodlarıyla tasarlamış olduğumuz arayüzü kullanma aşamasına geçebiliriz.

2. Python ile Qt Designer Tasarımını Kullanma

Adım 2.1.
Projemizde toplam 3 tane dosya olacak :

main.py : Qt designer'da tasarladığımız arayüzü yükleyeceğimiz ve üzerinde işlemler yapacağımız ana Python dosyamız.

mplwidget.py : Qt designer'da Promote işlemi yapılan widget ile aynı ismi taşıyan Python dosyamız. Burada matplotlib'in widget'ta kullanılmasını sağlayan işlemler yapılır.

qt_designer.ui : Qt designer'da tasarımı yapılan arayüz dosyası.

# ------------------------------------------------------
# -------------------- mplwidget.py --------------------
# ------------------------------------------------------
from PyQt5.QtWidgets import*

from matplotlib.backends.backend_qt5agg import FigureCanvas

from matplotlib.figure import Figure

    
class MplWidget(QWidget):
    
    def __init__(self, parent = None):

        QWidget.__init__(self, parent)
        
        self.canvas = FigureCanvas(Figure())
        
        vertical_layout = QVBoxLayout()
        vertical_layout.addWidget(self.canvas)
        
        self.canvas.axes = self.canvas.figure.add_subplot(111)
        self.setLayout(vertical_layout)

Yukarıda yer alan kodlar mplwidget.py Python dosyasında yer alan kodlardır. Şimdi adım adım bu kodları açıklayalım.
ilk 3 satır yorum satırıdır. Kodların hangi dosyaya ait olduğunu belirtmek için yazılmıştır.
4 nolu satırda QtWidgets sınıfına ait tüm bileşenler eklenir.
6 nolu satırda Matplotlib modülünden FigureCanvas kodumuza eklenir.
Matplotlib 3 farklı katmandan oluşur ve en alt katmanda Backend, bir üst katmanda Artist ve en üst katmanda Scripting katmanı bulunmaktadır. Matplotlib modlünün yapısı hakkında detaylı bilgiye buradan ulaşabilirsiniz.
Backend katmanında bulunan FigureCanvas resim çizmek için ihtiyaç duyduğumuz kağıt (tuval) gibi düşünülebilir. FigureCanvas Matplotlib sınıfı olmasının yanında aynı zamanda bir QWidget sınıfıdır.
Artist katmanında Matplotlib de gördüğümüz başlık, grafik, x-y ekseni, etiketler vb. bileşenler yer almaktadır.
Script (pyplot) katmanı Matplotlib modülünün kolay kullanımını sağlayan en üst katmandır.
8 nolu satırda Matplotlib modülünden Figure sınıfı kodumuza eklenir.

class MplWidget(QWidget):
    
    def __init__(self, parent = None):

        QWidget.__init__(self, parent)

11 nolu satırda satırda QWidget sınıfından ürettiğimiz, Qt Designer'da Promote işlemi yaptığımız Widget ile aynı isimde MplWidget adında sınıfı tanımlıyoruz. Her sınıfın __init__() fonksiyonu vardır ve sınıf çağrıldığında ilk olarak bu fonksiyon çalıştırılır. self ifadesi bir sınıfta tanımlanan değişkenlerin, fonksiyonların sınıf dışından çağrılabilmesi için o sınıfa ait bir fonksiyon, değişken olduğunu belirtmek için kullanılır. C++ programlama dilinde kullanılan this ifadesi ile aynı kullanıma sahiptir.
15 nolu satır ile üst sınıfın __init__() fonksiyonu çağrılır.

        self.canvas = FigureCanvas(Figure())
        
        vertical_layout = QVBoxLayout()
        vertical_layout.addWidget(self.canvas)
        
        self.canvas.axes = self.canvas.figure.add_subplot(111)
        self.setLayout(vertical_layout)

17 nolu satırda FigureCanvas sınıfından yeni bir nesne tanımlanmaktadır ve nesne adı (object name) "canvas" olarak tanımlanmıştır ve sınıf dışında (main.py dosyasında) ulaşmamız gerekeceğinden bu parçacık self ifadesine atanmıştır.
19 nolu satırda dikey yerleşim düzeni ( QVBoxLayout ) tanımlıyoruz ve 20 nolu satırda addWidget fonksiyonunu kullanarak oluşturduğumuz FigureCanvas nesnesini bu dikey yerleşim planı içerisine ekliyoruz. PyQt'de tasarımlarınızda dikey yerleşim düzeninden ( QVBoxLayout ) farklı olarak Yatay yerleşim düzeni ( QHBoxLayout ) ve Izgara yerleşim düzeni ( QGridLayout ) bulunmaktadır.
22 nolu satırda oluşturduğumuz tuvale (FigureCanvas) yeni bir Axes tanımlıyoruz. Bu işlem için add_subplot fonksiyonunu kullanıyoruz.
23 nolu satırda oluşturduğumuz dikey yerleşim düzenini sınıfımızın (oluşturacağımız arayüzün) yerleşim düzeni olmasını sağlamak için setLayout fonksiyonuyla tanımlıyoruz. Bu satırla birlikte mplwidget.py kodlarının açıklaması bitmiştir.

Adım 2.2.
main.py Python dosyasında yer alan kodlar ve açıklamaları aşağıda yer almaktadır.

# ------------------------------------------------------
# ---------------------- main.py -----------------------
# ------------------------------------------------------
from PyQt5.QtWidgets import*
from PyQt5.uic import loadUi

from matplotlib.backends.backend_qt5agg import (NavigationToolbar2QT as NavigationToolbar)

import numpy as np
import random
     
class MatplotlibWidget(QMainWindow):
    
    def __init__(self):
        
        QMainWindow.__init__(self)

        loadUi("qt_designer.ui",self)

        self.setWindowTitle("PyQt5 & Matplotlib Example GUI")

        self.pushButton_generate_random_signal.clicked.connect(self.update_graph)

        self.addToolBar(NavigationToolbar(self.MplWidget.canvas, self))


    def update_graph(self):

        fs = 500
        f = random.randint(1, 100)
        ts = 1/fs
        length_of_signal = 100
        t = np.linspace(0,1,length_of_signal)
        
        cosinus_signal = np.cos(2*np.pi*f*t)
        sinus_signal = np.sin(2*np.pi*f*t)

        self.MplWidget.canvas.axes.clear()
        self.MplWidget.canvas.axes.plot(t, cosinus_signal)
        self.MplWidget.canvas.axes.plot(t, sinus_signal)
        self.MplWidget.canvas.axes.legend(('cosinus', 'sinus'),loc='upper right')
        self.MplWidget.canvas.axes.set_title('Cosinus - Sinus Signal')
        self.MplWidget.canvas.draw()
        

app = QApplication([])
window = MatplotlibWidget()
window.show()
app.exec_()

5 nolu satırda uic modülünde yer alan loadUi fonksiyonu eklenmiştir ve bu fonksiyon 18 nolu satırda .ui uzantılı Qt designer ile yapmış olduğumuz tasarımı yüklemek için kullanılmıştır.
7 nolu satırda grafik üzerinde işlem yapabilmek için Matplotlib modülünden NavigationToolBar2QT koda dahil edilir.
9 nolu satırda NumPy paketi matematiksel işlemler ve dizi işlemlerinde kullanmak için eklenmiştir.
10 nolu satırda Python kurulumu ile birlikte gelen random paketi rastgele sayı üretmek için koda eklenmiştir.
12-16 arası satırları mplwidget.py kodlarını anlatırken açıklamıştım burada tekrar açıklamıyorum. Dikkat edilmesi gereken nokta Qt Designer ile tasarım yaptığınız yapıya göre sınıf tanımlamanız. Biz Qt Designer'da Main Window seçerek tasarım yapmıştık burada da bu sebeple sınıf tanımlamasında QMainWindow kullandık.
18 nolu satırda Qt Designer ile yapılan tasarım yüklenir. Tasarımı kaydettiğiniz ismi ilk parametre olarak vermelisiniz.
20 nolu satırda arayüz penceresine setWindowTitle fonksiyonu ile isim veriyoruz.
22 nolu satırda Qt Designer'da tanımladığımız butonun clicked sinyaline update_graph fonksiyonunu (slot) bağlıyoruz. Signal-slot bağlantısı için önceki yazıma bakabilirsiniz.

24 nolu satırda addToolBar fonksiyonuyla NavigationToolbar arayüze eklenir.

    def update_graph(self):

        fs = 500
        f = random.randint(1, 100)
        ts = 1/fs
        length_of_signal = 100
        t = np.linspace(0,1,length_of_signal)
        
        cosinus_signal = np.cos(2*np.pi*f*t)
        sinus_signal = np.sin(2*np.pi*f*t)

        self.MplWidget.canvas.axes.clear()
        self.MplWidget.canvas.axes.plot(t, cosinus_signal)
        self.MplWidget.canvas.axes.plot(t, sinus_signal)
        self.MplWidget.canvas.axes.legend(('cosinus', 'sinus'),loc='upper right')
        self.MplWidget.canvas.axes.set_title('Cosinus - Sinus Signal')
        self.MplWidget.canvas.draw()
        

app = QApplication([])
window = MatplotlibWidget()
window.show()
app.exec_()

27-43 nolu satırlar arası butona bağlanan update_graph fonksiyonu (slot) yazılmıştır. Kullanıcı butona her bastığında kodumuz bu fonksiyonu çalıştıracaktır.
29-36 satırlar arası NumPy ve random paketlerindeki fonksiyonlar kullanılarak rastgele frekanslarda sinus ve cosinus fonksiyonları üretilmektedir.
38 nolu satırda grafiğe yeni bir çizim yapmadan önce önceki çizimler silinir. Bu işlemi yapmazsak grafikleri üst üste çizer.
39-40 nolu satırlarda üretilen cosinus ve sinus fonksiyonları çizdirilmektedir.
41 nolu satırda çizdirdiğimiz grafikleri ayırt etmek için legend eklenir.
42 nolu satırda grafiğe başlık eklenir.
43 nolu satırda grafiğimiz çizdirilir.
46-49 nolu satırları önceki yazımda açıkladığım için burada tekrar etmiyorum.

Qt Designer ile tasarlanan arayüzde Matplotlib paketini kullanarak nasıl grafik çizdireceğimizi öğrenmiş olduk. Değinmediğimiz birçok özellik olabilir, ancak bunu bir başlagıç olarak kabul ederek daha iyi daha güzel arayüzleri kendi çalışmalarınız için hazırlayabilirsiniz.

Sayfalar

6 Nisan 2020 Pazartesi

Design2Py Converter v1.5

Design2Py Converter v1.5

20 Şubat 2019 Çarşamba

PyQt5'de Signal - Slot Kavramı

PyQt5 Signal - Slot (İşaret - İşlev) Kavramı

25 Ocak 2019 Cuma

PyQt5 (pip ile) Windows Kurulumu

PyQt5 (pip ile) Windows Kurulumu

22 Ocak 2019 Salı

PyQt5 Ubuntu Kurulumu

PyQt5 Ubuntu Kurulumu

10 Kasım 2018 Cumartesi

PyQt5 Qt Designer ile Matplotlib Kullanımı

PyQt5 Qt Designer ile Matplotlib Kullanımı