Aplikasi Menggambar PySide versi 3

BelajarPython - Assalamualaikum wr. wb.

Hy temen - temen... Jumpa lagi ya... Pada kesempatan kali ini, saya akan mencoba untuk meng upgrade versi aplikasi sebelumnya... Yaitu Aplikasi menggambar yang terbuat dari PySide.. Semoga kalian suka dengan tambahan fitur yang akan saya tambahkan kali ini ya... Lalu fitur apa yang akan ditambahkan kali ini? Oke, Langsung saja yuk kita simak sama - sama postingan kali ini...

Pengenalan aplikasi yang akan kita buat.

Pada postingan kali ini saya akan mencoba untuk meng upgrade fitur dari aplikasi menggambar versi sebelumnya.. Yaitu versi 2. Jika kalian ingin membaca atau belum membaca postingan nya, KALIAN Bisa klik disini ya....

Walaupun saya juga telah membuat aplikasi sejenis sebelumnya, namun ada perbedaan... Dimana sebelumnya saya membuat aplikasi ini menggunakan library tkinter.. Jika kalian mau baca kalian BISA KLIK DISINI.. Dan kali ini saya membuat aplikasi menggambar tersebut menggunakan library PySide dengan fungsi dan tampilan yang lebih bagus serta lebih baik...

Pada postingan kali ini, saya akan memposting aplikasi menggambar versi 3.. Dimana pada versi kali ini saya menambahkan 5 jenis penggambaran.. Yaitu ‘Bulat’ untuk menggambar lingkaran, oval dan sejenisnya. ‘kotak’ untuk menggambar persegi 4 seperti kotak, persegi panjang dan sejenisnya. ‘Arc’ untuk menggambar garis stengah lingkaran. ‘Chord’ digunakan untuk menggambar setengah lingkaran padat dengan isi. ‘convex’ yang sama seperti ‘kotak’.

Oya, perlu kalian ketahui, aplikasi ini saya posting dengan berbagai versi. Dan tentu saja, tiap versinya ada penambahan fitur menarik.. Jika kalian ingin membaca daftar isi dan rincian lengkap nya, KALIAN BISA KLIK DISINI ya temen - temen...

Rincian Lengkap Aplikasi Menggambar menggunakan PySide Versi 3.0

Pada segment kali ini, saya akan mencoba untuk memberikan rincian lengkap dari apalikasi menggambar yang saya posting kali ini... seperti yang sudah saya katakan di atas tadi, Aplikasi kali ini menggunakan library PySide. Dimana untuk menjalankannya, tentu saja harus menginstallnya terlebih dahulu... Kalian bisa KLIK DISINI untuk install pyside nya....

Oke, langsung saja yuk kita simak sama - sama rincian lengkap nya di bawah ini...

Nama: mn-Drawing 3.0
Versi: 3.0 | klik disini untuk membaca versi selanjutnya.
Platform: Python 3.x
Modul: PySide. Klik disini untuk menginstallnya.
Baris Code: kurang lebih 176 baris code program.
Terdiri dari: 2 class dan 13 metode.
Fitur: menggambar dan membuat ‘kotak’, ‘lingkaran’, ‘arc’, ‘chord’, dan convex.
syarat menjalankan: install python 3.x dan PySide, punya editor teks atau IDE.
Cara menjalankan: install python 3 dan PySide, copy dan paste code program pada editor atau IDE, simpan dalam file python(ekstensi .py), lalu jalankan.


Kalian juga bisa membuat code program ini menjadi file aplikasi loh.. iya file aplikasi seperti "exe" itu loh.. sehingga, nantinya kita cukup klik dua kali saja untuk menjalankan aplikasi ini... tanpa perlu repot - repot membuka nya di IDLE atau IDE python.. nah seperti apa caranya? cukup mudah kok.. dan saya juga sudah membuatkan tutorialnya.. untuk kalian yang menggunakan windows, KALIAN BISA KLIK DISINI ya temen - temen.. atau jika pada link pertama terlalu rumit, KALIAN BISA MENCOBA CARA INI ya.... dan bagi pengguna linux ? tenang saja.. bisa juga kok membuat file executable nya.. untuk melihat tutorialnya, KALIAN BISA KLIK DISINI temen - temen...

Code program aplikasi Menggambar menggunakan PySide versi 3.0

Nah pada segment kali ini, merupakan segment yang paling penting.. Karena, pada segment kali ini, saya akan memberiikan code program untu membuat aplikasi menggambar versi kali ini.. Biar tidak penasaran, langsung saja yuk kita simak sama - sama code program nya di bawah ini...


from PySide import QtCore, QtGui

class AreaKanvas(QtGui.QWidget):
    def __init__(self, parent=None):
        super(AreaKanvas, self).__init__(parent)

        self.warnaBeckground = QtCore.Qt.yellow
        self.parent = parent

        self.setAttribute(QtCore.Qt.WA_StaticContents)
        self.scribbling = False
        self.myPenWidth = 1
        self.myPenColor = QtCore.Qt.blue
        self.image = QtGui.QImage()
        self.lastPoint = QtCore.QPoint()


    def mousePressEvent(self, event):

        if event.button() == QtCore.Qt.LeftButton:
            self.lastPoint = event.pos()
            self.pensil = self.lastPoint
            self.scribbling = True

            self.awalX = event.pos().x()
            self.awalY = event.pos().y()

    def mouseMoveEvent(self, event):
        if (event.buttons() & QtCore.Qt.LeftButton) and self.scribbling:
            pilihan = self.parent.getPilihan()
            if pilihan == 'Pensil' or pilihan == 'Penghapus':
                self.drawLineTo(event.pos())
                self.pensil = event.pos()
            self.update()

    def mouseReleaseEvent(self, event):
        if event.button() == QtCore.Qt.LeftButton and self.scribbling:
            self.drawLineTo(event.pos())
            self.scribbling = False
            self.update()

    def paintEvent(self, event):
        painter = QtGui.QPainter(self)
        painter.drawImage(QtCore.QPoint(0, 0), self.image)

    def resizeEvent(self, event):
        if self.width() > self.image.width() or self.height() > self.image.height():
            newWidth = max(self.width() + 128, self.image.width())
            newHeight = max(self.height() + 128, self.image.height())
            self.resizeImage(self.image, QtCore.QSize(newWidth, newHeight))
            self.update()

        super(AreaKanvas, self).resizeEvent(event)

    def drawLineTo(self, endPoint):
        painter = QtGui.QPainter(self.image)
        painter.setPen(QtGui.QPen(self.myPenColor, self.myPenWidth, QtCore.Qt.SolidLine, QtCore.Qt.RoundCap, QtCore.Qt.RoundJoin))
        painter.setBrush(self.warnaBeckground)

        rectangle = QtCore.QRectF(self.awalX, self.awalY, endPoint.x()-self.awalX, endPoint.y()-self.awalY)

        poligon = QtGui.QPolygonF(rectangle)
        startAngle = 30 * 16
        spanAngle = 120 * 16

        pilihan = self.parent.getPilihan()

        if pilihan == 'Kotak' :
            painter.drawRect(rectangle)
        elif pilihan == 'Bulat' :
            painter.drawEllipse(rectangle)
        elif pilihan == 'Arc' :
            painter.drawArc(rectangle, startAngle, spanAngle)
        elif pilihan == 'Chord' :
            painter.drawChord(rectangle, startAngle, spanAngle)
        elif pilihan == 'Convex' :
            painter.drawConvexPolygon(poligon)
        elif pilihan == 'Pensil' :
            painter.drawLine(self.pensil, endPoint)
        elif pilihan == 'Pen' :
            painter.drawLine(self.lastPoint, endPoint)
        elif pilihan == 'Penghapus' :
            r = QtCore.QRectF(self.pensil.x(), self.pensil.y(), 4, 4)
            painter.eraseRect(r)

    def resizeImage(self, image, newSize):
        if image.size() == newSize:
            return

        newImage = QtGui.QImage(newSize, QtGui.QImage.Format_RGB32)
        newImage.fill(QtGui.qRgb(255, 255, 255))
        painter = QtGui.QPainter(newImage)
        painter.drawImage(QtCore.QPoint(0, 0), image)
        self.image = newImage

    def penWidth(self):
        return self.myPenWidth

class MainWindow(QtGui.QMainWindow):
    def __init__(self):
        super(MainWindow, self).__init__()

        widgetInti = QtGui.QWidget()

        self.kanvas = AreaKanvas(self)
        self.mainLayout = QtGui.QVBoxLayout(widgetInti)
        self.kanvas.setMinimumHeight(500)
        self.kanvas.setMinimumWidth(500)
        self.kanvas.setMaximumWidth(500)
        self.kanvas.setMinimumHeight(500)
        self.mainLayout.setContentsMargins(0,0,0,0)
        self.setCentralWidget(widgetInti)

        self.setScroll()
        self.buatToolBar()

        self.setWindowTitle("Painting -> Mn-belajarpython.blogspot.co.id")
        self.resize(700, 650)

    def setScroll(self):
        # mengatur scroll
        self.scrollArea = QtGui.QScrollArea()
        self.scrollArea.setWidget(self.kanvas)
        self.scrollArea.setBackgroundRole(QtGui.QPalette.Mid)
        self.scrollArea.setAlignment(QtCore.Qt.AlignCenter)

        self.mainLayout.addWidget(self.scrollArea)

    def buatToolBar(self):
        self.layoutRadio1 = QtGui.QHBoxLayout()
        self.groupRadio = QtGui.QButtonGroup()

        self.radio = QtGui.QRadioButton('Bulat')
        self.radio1 = QtGui.QRadioButton('Kotak')
        self.radio2 = QtGui.QRadioButton('Arc')
        self.radio3 = QtGui.QRadioButton('Chord')
        self.radio4 = QtGui.QRadioButton('Convex')
        self.radio5 = QtGui.QRadioButton('Pensil')
        self.radio6 = QtGui.QRadioButton('Pen')
        self.radio7 = QtGui.QRadioButton('Penghapus')

        self.groupRadio.addButton(self.radio)
        self.groupRadio.addButton(self.radio1)
        self.groupRadio.addButton(self.radio2)
        self.groupRadio.addButton(self.radio3)
        self.groupRadio.addButton(self.radio4)
        self.groupRadio.addButton(self.radio5)
        self.groupRadio.addButton(self.radio6)
        self.groupRadio.addButton(self.radio7)

        self.radio.setChecked(True)

        self.layoutRadio1.addWidget(self.radio)
        self.layoutRadio1.addWidget(self.radio1)
        self.layoutRadio1.addWidget(self.radio2)
        self.layoutRadio1.addWidget(self.radio3)
        self.layoutRadio1.addWidget(self.radio4)
        self.layoutRadio1.addWidget(self.radio5)
        self.layoutRadio1.addWidget(self.radio6)
        self.layoutRadio1.addWidget(self.radio7)

        self.mainLayout.addLayout(self.layoutRadio1)


    def getPilihan(self):
        return self.groupRadio.checkedButton().text()


if __name__ == '__main__':

    import sys

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


Nah itu dia temen - temen code program nya.. Gimana ? Cukup panjang kan ? Hehe.. Tapi saya harap dapat kalian pahami dengan mudah ya... Dengan begitu proses belajar kalian akan lebih mudah juga tentunya.. Nah lalu, seperti apakah tampilan yang akan di hasilkan dari code program di atas? Langsung saja yuk kita simak sama - sama tampilannya di bawah ini...



Nah itu dia temen - temen tampilan yang akan di hasilkan dari code program di atas.. Dan disana sudah ada 5 buah objek yang telah saya gambar menggunakan fitur baru  nya ya... Kalian bisa lihat sendiri pada gambar nya.. Karena sudah cuku jelas.. Disana ada ‘bulat’, ‘kotak’, ’Arc’, ‘Chord’, dan ‘convex’.

Penjelasan code program untuk membuat Aplikasi menggambar menggunakan PySide versi 3.0

Nah setelah saya membagikan code programnya, maka selanjutnya saya akan mencoba untuk menjelaskan code program yang sudah saya bagikan di atas tadi.. Hal ini saya lakukan agar dengan harapan dapat mempermudah pemahaman kalian untuk memahami code program tersebut... Oke, Langsung saja yuk kita simak sama penjelasannya di bawah ini....


[NOTE : Teks yang berwarna merah pada penjelasan merupakan "Code program" yang di tambahkan pada versi kali ini. Dan tidak ada di versi sebelumnya]


from PySide import QtCore, QtGui  //digunakan untuk mengimport ‘QtCore’ dan ‘QtGui’  dari library PySide.

class AreaKanvas(QtGui.QWidget):  //digunakan untuknmembuat class dengan nama ‘AreaKanvas’ yang akan digunakan untuk membuat tempat menggambar Atau kanvasnya. Dengan menurunkan class ‘QtGui.QWidget’
    def __init__(self, parent=None):  //merupakan sebuah konstruktor dari class ‘AreaKanvas’.
        super(AreaKanvas, self).__init__(parent)  //digunakan untuk memanggil super class dari class ‘AreaKanvas’. Super class merupakan class parent atau induk yang menurunkan class ‘AreaKanvas’ ini.

        self.warnaBeckground = QtCore.Qt.yellow  //digunakan untuk mendefinisikan sebuah variabel baru dengan nama ‘warnaBeckground’  dengan isi warna ‘kuning’ yang akan digunakan untuk membuat warna isi dari kotak, lingkaran dan yang lainnya.
        self.parent = parent  //digunakan untuk menampung nilai parameter ‘parent’ kedalam variabel parent.

        self.setAttribute(QtCore.Qt.WA_StaticContents)  //digunakan untuk membuat canvas menjadi static. Yang artinya, walaupun window di perbesar ataupun diperkecil, ukuran kanvas akan tetap dan tak akan berubah.
        self.scribbling = False  //digunakan untuk mendefinisikan variabel baru denan nama ‘scribbling’ yang akan digunakan untuk proses corat coret dengan kursor
        self.myPenWidth = 1  //digunakan untuk mendefinisikan tebal pena yang akan digunakan untuk mencoret kanvas. Dengan nilai 1 dan disimpan kedalam variabel ‘myPenWidth’
        self.myPenColor = QtCore.Qt.blue  //mendefinisikan sebuah variabel baru dengan nama ‘myPenColor’ dengan nilai warna biru. Dan akan digunakan untuk mewarnai pena atau cursor saat mencoret
        self.image = QtGui.QImage()  //digunakan untuk membuat variabel baru dengan nama ‘image’ yang menampung class ‘QtGui.Qimage()’
        self.lastPoint = QtCore.QPoint()  //membuat variabel baru dengan nama ‘lastPoint’ yang menampung class ‘Qpoint’ dan nantinya akan digunakan untuk mendapatkan titik koordinat kursor.

    def mousePressEvent(self, event):  //metode dengan nama ‘mousePressEvent’ yang merupakan sebuah metode yang akan dijalankan otomatis ketika kita meng klik mouse.

        if event.button() == QtCore.Qt.LeftButton:  //digunakan untuk mengecek apakah kita atau user mengklik kiri pada mouse
            self.lastPoint = event.pos()  //digunakan untuk mengubah nilai variabel ‘lastPoint’ menjadi posisi mouse saat diklik.
            self.pensil = self.lastPoint  //digunakan untuk menampung kembali nilai ‘lastPoint’ ke dalam variabel ‘pensil’
            self.scribbling = True  //digunakan untuk mengubah nilai variabel ‘scribbling’ menjadi ‘True’ sebagai penanda kalau mouse telah di klik.

            self.awalX = event.pos().x()  //digunakan untuk membuat atau mengubah nilai variabel ‘awalX’ yang saya isi dengan lokasi titik x mouse saat di klik
            self.awalY = event.pos().y()  //digunakan untuk membuat atau mengubah nilai variabel ‘awalY’ yang saya isi dengan lokasi titik Y mouse saat di klik

    def mouseMoveEvent(self, event):  //digunakan untuk membuat metode dengan nama ‘mouseMoveEvent’ yang akan dijalankan secara otomatis ketika mouse di pindahkan
        if (event.buttons() & QtCore.Qt.LeftButton) and self.scribbling:  //digunakan untuk memengecek apakah mouse sedang di klik kiri dan juga variabel ‘scribbling’ bernilai true
            pilihan = self.parent.getPilihan()  //digunakan untuk mendapatkan pilihan yang dipilih user pada radio button. Dengan cara menjalankan metode dengan nama ‘getPilihan’ yang ada di class ‘MainWindow’ yang sudah saya masukkan sebagai parameter dan ada di variabel ‘parent’
            if pilihan == 'Pensil' or pilihan == 'Penghapus':
                self.drawLineTo(event.pos())  //digunakan untuk memanggil metode dengan nama ‘drawLineTo’ dengan memasukkan posisi mouse terkini sebagai parameter
                self.pensil = event.pos()  //digunakan untuk menampung posisi mouse terkini kedalam variabel ‘pensil.
            self.update()  //digunakan untuk meng update kanvas agar kita bisa langsung melihat gambar atau garis yang di hasilkan.

    def mouseReleaseEvent(self, event):  //digunakan untuk membuat metode dengan nama ‘mouseRealeaseEvent’ yang akan dijalankan secara otomatis ketika mouse dilepas dari klik nya
        if event.button() == QtCore.Qt.LeftButton and self.scribbling:  //digunakan untuk mengecek apakah yang ditekan atau diklik ada tombol kiri pada mouse dan variabel ‘scribbling’ bernilai ‘True’
            self.drawLineTo(event.pos())  //digunakan untuk memanggil metode dengan nama ‘drawLineTo’ dengan parameter posisi kurso saat klik dilepas
            self.scribbling = False  //digunakan untuk mengubah nilai variabel ‘scribbling’ menjadi ‘False’ sebagai pertanda drag telah selesai
            self.rectTerakhir = None  //digunakan untuk mengubah nilai variabel ‘rectTerakhir’ menjadi ‘None’ karena proses menggambar telah selesai.
            self.update()  //digunakan untuk mengupdate window atau kanvas agar hasil menggambar langsung bisa ditampilkan

    def paintEvent(self, event):  //digunakan untuk membuat metode denga nama ‘paintEvent’ yang akan dijalankan secara otomatis ketika kita melakukan proses menggambar.
        painter = QtGui.QPainter(self)  //digunakan untuk memanggil class ‘Qpainter’ dan di tampung ke dalam variabel ‘painter’.
        painter.drawImage(QtCore.QPoint(0, 0), self.image)  //digunakan untuk menggambar apa yang kita gambar pada ‘image’ agar bis di tampilkan pada window

    def resizeEvent(self, event):  //digunakan untuk membuat metode dengan nama ‘resizeEvent’ yang akan dijalankan secara otomatis ketika window aplikasi di ubah ukuran nya
        if self.width() > self.image.width() or self.height() > self.image.height():  //digunakan untuk mengecek apakah lebar window lebih besar dari lebar image yang menjadi lapisan kanvas. Atau tinggi window lebih besar atau lebih tinggi dari tinggi image yang menjadi lapisan kanvas
            newWidth = max(self.width() + 128, self.image.width())  //digunakan untuk membuat variabel baru dengan nama ‘newWidth’ dan menggunakan fungsi ‘max’ yang berfungsi unguk memilih nilai mana yang terbesar. antara lebar window di tambah 128 dengan lebar image.
            newHeight = max(self.height() + 128, self.image.height())  //digunakan untuk membuat variabel baru dengan nama ‘newHeight’ dan menggunakan fungsi ‘max’ yang berfungsi unguk memilih nilai mana yang terbesar. antara tinggi window di tambah 128 dengan tinggi image.
            self.resizeImage(self.image, QtCore.QSize(newWidth, newHeight))  //digunakan untuk memanggil metode dengan nama ‘resizeImage’ dengan memasukkan beberapa parameter ‘image’ dan ‘Qsize’ yang beri nilai yang ada di variabel ‘newWidth’ dan ‘newHeight’ sebagai parameter ‘Qsize’ nya
            self.update()  //digunakan untuk mengupdate aplikasi agar langsung bisa di tampilkan perubahannya.

        super(AreaKanvas, self).resizeEvent(event)  //digunakan ntuk memanggil metode yang ada di class parent dari class ‘AreaKanvas’.

    def drawLineTo(self, endPoint):  //digunakan untuk membuat metode dengan nama ‘drawLineTo’ yagn akan digunakan untuk menggambar garisnya
        painter = QtGui.QPainter(self.image)  //digunakan untuk memanggil class ‘Qpainter’ dengan memasukkan ‘image’  sebagai parameter. Dan disimpan ke dalam variabel ‘painter’
        painter.setPen(QtGui.QPen(self.myPenColor, self.myPenWidth, QtCore.Qt.SolidLine, QtCore.Qt.RoundCap, QtCore.Qt.RoundJoin))  //digunakan untuk mengatur pena yang akan di gunakan. Yang menggunaka class “QPen” sebagai parameter. Dan clas “QPen” sendiri memiliki beberapa 5 parameter. Yaitu ‘myPenColor’ yang sebenarnya merpakan sebuah variabel dengan isi warna. Inisialisasinya ada di code paling atas. ‘myPenColor’ yang sebenarnya merupakan sebuah variabel dengan isi angka yang menentukan ketebalan pena nya. Inisialisasinya ada di code paling atas. ‘QsolidLine’ agar menampilkan garis solid. 
        painter.setBrush(self.warnaBeckground)  //digunakan untuk menentukan warna isian dari kotak, bulat dan objek padat lain. Warnanya adalah yang adalah nilai yang ada di dalam variabel ‘warnaBeckground’.

        rectangle = QtCore.QRectF(self.awalX, self.awalY, endPoint.x()-self.awalX, endPoint.y()-self.awalY)  //digunakan untuk membuat sebuah rectangle yang di definisikan dengan posisi pojok pertama merupakan posisi saat  cursor di klik dan pojok diagonal kedua merupakan posisi saat mouse di lepas dari drag. Posisi awal di dapatkan pada variabel ‘awalX’ dan ‘awalY’. Dan posisi diagonal pojok ke dua di dapatkan dari variabel ‘endpoint.x()’ yang di kurangi dengan variabel ‘awalX’ dan ‘endpoint.y()’ yang dikurangi dengan ‘awalY’.

        poligon = QtGui.QPolygonF(rectangle)  //digunakan untuk mengkonversi kotak atau rectangle yang ada di variabel ‘rectangle’ menjadi sebuah polygon dan disimpan ke dalam variabel ‘poligon’.
        startAngle = 30 * 16  //digunakan untuk membuat sebuah sudut. Dan disimpan ke dalam variabel ‘startAngle’
        spanAngle = 120 * 16  //digunakan untuk membuat sebuah sudut. Dan disimpan ke dalam variabel ‘spanAngle’

 pilihan = self.parent.getPilihan()  //digunakan untuk mendapatkan pilihann dari radio button yang ada di bawah window. Yang merupakan penentu jenis penggambaran. Lalu disimpan ke dalam variabel ‘pilihan’.

        if pilihan == 'Kotak' :  //digunakan untuk mengecek apakah pilihannya ‘kotak’.
            painter.drawRect(rectangle)  //digunakan untuk menggambar sebuah kotak atau rectangle yang lokasi nya sudah di tentukan dan disimpan di dalam variabel ‘rectangle’.
        elif pilihan == 'Bulat' :  //digunakan untuk mengecek apakah pilihannya ‘Bulat’.
            painter.drawEllipse(rectangle)  //digunakan untuk menggambar sebuah ellipse atau bulat yang lokasi nya sudah di tentukan dan disimpan di dalam variabel ‘rectangle’.
        elif pilihan == 'Arc' :  //digunakan untuk mengecek apakah pilihannya ‘Arc’.
            painter.drawArc(rectangle, startAngle, spanAngle)  //digunakan untuk menggambar sebuah Arc atau garis melengkung seperti pelangi yang lokasi nya sudah di tentukan dan disimpan di dalam variabel ‘rectangle’. Dan sudut - sudutnya ada pada variabel ‘startAngle’ dan ‘spanAngle’.
        elif pilihan == 'Chord' :  //digunakan untuk mengecek apakah pilihannya ‘Chord’.
            painter.drawChord(rectangle, startAngle, spanAngle)//digunakan untuk menggambar objek stengah lingkaran yang lokasi nya sudah di tentukan dan disimpan di dalam variabel ‘rectangle’. Dan sudut - sudutnya ada pada variabel ‘startAngle’ dan ‘spanAngle’.
        elif pilihan == 'Convex' :  //digunakan untuk mengecek apakah pilihannya ‘Convex’.
            painter.drawConvexPolygon(poligon)  //digunakan untuk menggambar sebuah poligon. Namun hanya memeliki 4 sudut saja. Sehingga seperti kotak saja. hehe yang lokasi nya sudah di tentukan dan disimpan di dalam variabel ‘rectangle’.
        elif pilihan == 'Pensil' :  //digunakan untuk mengecek apakah pilihannya ‘pensil’.
        painter.drawLine(self.pensil, endPoint)  //digunakan untuk membuat garis dengan posisi kursor sebelum pindah dan lokasi terakhir kursor. Yang ada pada variabel ‘self.pensil’ dan ‘endPoint’.
        elif pilihan == 'Pen' :  //digunakan untuk mengecek apakah pilihannya ‘Pen’.
            painter.drawLine(self.lastPoint, endPoint)  //digunakan untuk membuat garis dengan posisi kursor saat pertama mouse di klik dan lokasi terakhir kursor saat dilepas. Yang ada pada variabel ‘lastPoint’ dan ‘endPoint’.
        elif pilihan == 'Penghapus' :  //digunakan untuk mengecek apakah pilihannya ‘Penghapus’.
            r = QtCore.QRectF(self.pensil.x(), self.pensil.y(), 4, 4)  //digunakan untuk membuat sebuah rectangle dengan lokasi kursor terkini. Yang ada di variabel ‘pensil’. Dan untuk mendapatkan koordinatnya di gunakan ‘pensil.x()’ dan ‘pensil.y()’. Dan panjang dan lebarnya sebanyak 4 pixel. Dan disimpan ke dalam variabel ‘r’.
            painter.eraseRect(r)  //menghapus kanvas di area rectangle yang sudah kita buat tadi. Yang sudah disimpan kedalam variabel ‘r’ sebelumnya.

    def resizeImage(self, image, newSize):  //digunakan untuk membuat metode dengan nama ‘resizeImage’ yang akan di jalankan untuk mengubah ukuran image yang menjadi lapisan kanvas
        if image.size() == newSize:  //digunakan untuk mengecek apakah ukuran ‘image’ adalah sama dengan ukuran baru nya yang ada di variabel ‘newSize’
            return  //digunakan untuk mengembalikan. Dan tidak melanjutkan code program di bawah nya.

        newImage = QtGui.QImage(newSize, QtGui.QImage.Format_RGB32)  //digunakan untuk membuat variabel dengan nama ‘newImage’ yang di isi dengan class ‘QImage’ baru dengan ukuran baru dan format ‘RGB’
        newImage.fill(QtGui.qRgb(255, 255, 255))  //digunakan untuk memberikan warna kanvas menjadi putih.
        painter = QtGui.QPainter(newImage)  //memasukkan image baru yang ada di variabel ‘newImage’ sebagai lapisannya. Dan disimpan ke dalam variabel ‘painter’.
        painter.drawImage(QtCore.QPoint(0, 0), image)  //digunakan untuk  memasukkan image baru dengan ukuran yang baru pula tentunya
        self.image = newImage  //digunakan untuk mengganti nilai yang ada di variabel ‘image’ menjadi image yang baru di variabel ‘newImage’

    def penWidth(self):  //digunakan untukmembuat metode dengan nama ‘penWidth’ yang digunakan untuk mendapatkan nilai ukuran pena
        return self.myPenWidth  //digunakan untuk memberikan atau mengembalikan nilai yang ada di variabel ‘myPenWidth’ yang merupakan penampung ukuran pena

class MainWindow(QtGui.QMainWindow):  //digunakan untuk membuat class dengan nama ‘MainWindow’ dengan meng inheritens atau menurunkan class ‘QmainWindow’ yang ada pada QtGui. Dan class ini menjadi window utama yang menjadi tempat kanvas dan tombol - tombol nantinya
    def __init__(self):  //merupakan sebuah construktor dari class ‘MainWindow’
        super(MainWindow, self).__init__()  //digunakan untuk memanggill construktor class parent dari class ‘MainWindow’.

        widgetInti = QtGui.QWidget()  //digunakan untuk meng inisialisasi  variabel dengan nama ‘widgetInti’ yang di isi dengan variabel ‘QWidget’. Dan akan digunakan sebagai tempat kanvasnya di tengah window.

        self.kanvas = AreaKanvas(self)  //digunakan untuk memanggil atau menjalankan class dengan nama ‘AreaKanvas’ dan disimpan ke dalam variabel ‘kanvas’.
        self.mainLayout = QtGui.QVBoxLayout(widgetInti)  //digunakan untuk membuat sebuah layout dengan nama “QVBoxLayout’ dengan parameter ‘widgetInti’. Agar saat di masukkan sebagai layout inti di tengah window, tidak terjadi error. Kemudian di tampung ke dalam variabel ‘mainLayout’.
        self.kanvas.setMinimumHeight(500)  //digunakan untuk membuat ukuran tinggi minimum kanvas sebesar 500
        self.kanvas.setMinimumWidth(500)  //digunakan untuk membuat ukuran lebar minimum kanvas sebesar 500
        self.kanvas.setMaximumWidth(500)  //digunakan untuk membuat ukuran lebar maximum kanvas sebesar 500
        self.kanvas.setMinimumHeight(500)  //digunakan untuk membuat ukuran tinggi maksimum kanvas sebesar 500
        self.mainLayout.setContentsMargins(0,0,0,0)  //digunakan agar tidak ada margin pada layout utama nya. Tujuannya hanya untuk memperbagus saja.
        self.setCentralWidget(widgetInti)  //digunakan untuk memasukkan widget inti sebagai objek di tengah window. Dan tentu saja memasukkan ‘mainLayout’ ke dalamnya. Karena sudah di masukkan sebagai parameter saat meng inisiaisasinya tadi

        self.setScroll()  //digunakan untuk memanggil atau menjalankan metode dengan nama ‘setScroll’ 
        self.buatToolBar()  //digunakan untuk memanggil atau menjalankan metode dengan nama ‘buatToolBar’ 

        self.setWindowTitle("Painting -> Mn-belajarpython.blogspot.co.id"  //digunakan untuk mengubah nama window.
        self.resize(700, 650)  //digunakan untuk mengubah ukuran window menjadi 700x650 pixel

    def setScroll(self):  //digunakan untuk membuat metode dengan nama ‘setScroll’ yang akan digunakan untuk mengatur scroll
        # mengatur scroll  //komentar
        self.scrollArea = QtGui.QScrollArea()  //digunakan untuk mendefinisikan sebuah area yang akan di scroll. Dengan memanggil class ‘QScrollArea’. Dan disimpan ke dalam variabel ‘scrollArea’.
        self.scrollArea.setWidget(self.kanvas)  //digunakan untuk memasukkan canvas kedalam area scroll. Atau bisa juga dikatakan untuk menetapkan kanvas untuk di scroll
        self.scrollArea.setBackgroundRole(QtGui.QPalette.Mid)  //digunakan untuk mengubah warna backgorund nya saja
        self.scrollArea.setAlignment(QtCore.Qt.AlignCenter)  //digunakan untuk membuat canvas agar tampil di tengah window

        self.mainLayout.addWidget(self.scrollArea)  //digunakan untuk memasukkan ‘scrollArea’ yang merupakan variabel penampung tempat yang akan di scroll kedalam variabel ‘mainLayout’.

    def buatToolBar(self):  //digunakan untuk membuat metode dengan nama ‘buatToolBar’ yang tentu saja digunakan untuk membuat Toolbar.
        self.layoutRadio1 = QtGui.QHBoxLayout()  //digunakan untuk membuat sebuah layout. Yaitu ‘QHBoxLyout’. Dan disimpan ke dalam variabel ‘layoutRadio1’.
        self.groupRadio = QtGui.QButtonGroup()  //digunakan untuk membuat sebah Radio button klompok atau grup. Yang digunakan untuk mengelompokkan satuan radio button.  Dan disimpan ke dalam variabel ‘groupRadio’.

        self.radio = QtGui.QRadioButton('Bulat')  //digunakan untuk membuat unit radio button baru dengan nama ‘Bulat’ dan disimpan kedalam variabel ‘radio’
        self.radio1 = QtGui.QRadioButton('Kotak')  //digunakan untuk membuat unit radio button baru dengan nama ‘Kotak’ dan disimpan kedalam variabel ‘radio1’
        self.radio2 = QtGui.QRadioButton('Arc')  //digunakan untuk membuat unit radio button baru dengan nama ‘Arc’ dan disimpan kedalam variabel ‘radio2’
        self.radio3 = QtGui.QRadioButton('Chord')  //digunakan untuk membuat unit radio button baru dengan nama ‘Chord’ dan disimpan kedalam variabel ‘radio3’
        self.radio4 = QtGui.QRadioButton('Convex')  //digunakan untuk membuat unit radio button baru dengan nama ‘Convex’ dan disimpan kedalam variabel ‘radio4’
        Self.radio5 = QtGui.QRadioButton('Pensil')  //digunakan untuk membuat unit radio button baru dengan nama ‘Pensil’ dan disimpan kedalam variabel ‘radio5’
        Self.radio6 = QtGui.QRadioButton('Pen')  //digunakan untuk membuat unit radio button baru dengan nama ‘Pen’ dan disimpan kedalam variabel ‘radio6’
        Self.radio7 = QtGui.QRadioButton('Penghapus')  //digunakan untuk membuat unit radio button baru dengan nama ‘Penghapus’ dan disimpan kedalam variabel ‘radio7’

        self.groupRadio.addButton(self.radio)  //digunakan untuk memasukkan radio button yang ada di dalam variabel ‘radio’ ke dalam pengelompok radio button yang ada di variabel ‘groupRadio’
        self.groupRadio.addButton(self.radio1)  //digunakan untuk memasukkan radio button yang ada di dalam variabel ‘radio1’ ke dalam pengelompok radio button yang ada di variabel ‘groupRadio’
        self.groupRadio.addButton(self.radio2)  //digunakan untuk memasukkan radio button yang ada di dalam variabel ‘radio2’ ke dalam pengelompok radio button yang ada di variabel ‘groupRadio’
        self.groupRadio.addButton(self.radio3)  //digunakan untuk memasukkan radio button yang ada di dalam variabel ‘radio3’ ke dalam pengelompok radio button yang ada di variabel ‘groupRadio’
        self.groupRadio.addButton(self.radio4)  //digunakan untuk memasukkan radio button yang ada di dalam variabel ‘radio4’ ke dalam pengelompok radio button yang ada di variabel ‘groupRadio’
        self.groupRadio.addButton(self.radio5)  //digunakan untuk memasukkan radio button yang ada di dalam variabel ‘radio5’ ke dalam pengelompok radio button yang ada di variabel ‘groupRadio’
        self.groupRadio.addButton(self.radio6)  //digunakan untuk memasukkan radio button yang ada di dalam variabel ‘radio6’ ke dalam pengelompok radio button yang ada di variabel ‘groupRadio’
        self.groupRadio.addButton(self.radio7)  //digunakan untuk memasukkan radio button yang ada di dalam variabel ‘radio7’ ke dalam pengelompok radio button yang ada di variabel ‘groupRadio’

        self.radio.setChecked(True)  //digunakan untuk membuat radio button yang ada di variabel ‘radio’ menjadi yang terpilih.

        self.layoutRadio1.addWidget(self.radio)  //digunakan untuk memasukkan radio button yang ada di variabel ‘radio’ kedalam layout yang ada di variabel ‘layoutRadio1’
        self.layoutRadio1.addWidget(self.radio1)  //digunakan untuk memasukkan radio button yang ada di variabel ‘radio1’ kedalam layout yang ada di variabel ‘layoutRadio1’
        self.layoutRadio1.addWidget(self.radio2)  //digunakan untuk memasukkan radio button yang ada di variabel ‘radio2’ kedalam layout yang ada di variabel ‘layoutRadio1’
        self.layoutRadio1.addWidget(self.radio3)  //digunakan untuk memasukkan radio button yang ada di variabel ‘radio3’ kedalam layout yang ada di variabel ‘layoutRadio1’
        self.layoutRadio1.addWidget(self.radio4)  //digunakan untuk memasukkan radio button yang ada di variabel ‘radio4’ kedalam layout yang ada di variabel ‘layoutRadio1’
        self.layoutRadio1.addWidget(self.radio5)  //digunakan untuk memasukkan radio button yang ada di variabel ‘radio5’ kedalam layout yang ada di variabel ‘layoutRadio1’
        self.layoutRadio1.addWidget(self.radio6)  //digunakan untuk memasukkan radio button yang ada di variabel ‘radio6’ kedalam layout yang ada di variabel ‘layoutRadio1’
        self.layoutRadio1.addWidget(self.radio7)  //digunakan untuk memasukkan radio button yang ada di variabel ‘radio7’ kedalam layout yang ada di variabel ‘layoutRadio1’

        self.mainLayout.addLayout(self.layoutRadio1)  //digunakan untuk memasukkan layout yang ada divariabel ‘layoutRadio1’ kedalam layout utama yang tersimpan ke dalam variabel ‘mainLayout’.

    def getPilihan(self):  //digunakan untuk membuat metode dengan nama ‘getPilihan’ yang digunakan untuk mendapatkan pilihan radio button. Atau radio button yang terpilih.
        return self.groupRadio.checkedButton().text()  //mengembalikan teks yang radio button yang terpilih.

if __name__ == '__main__':  //merupakan code utama yang akan di jalankan. Bisa dikantakan sebagai main method

    import sys  //digunakan untuk mengimport sys.

    app = QtGui.QApplication(sys.argv)  //digunakan untk memanggil ‘Qapplication’ hal ini wajib adanya. Dan disimpan ke dalam variabel ‘app’.
    window = MainWindow()  //digunakan untuk menjalankan class dengan nama ‘MainWindow’. Dan disimpan ke dalam variabel ‘window’.
    window.show()  //digunakan untuk menampilkan window nya

    sys.exit(app.exec_())  //digunakan agar window tidak langsung close saat di jalankan.


Nah itu dia temen - temen penjelasan code programnya.. Semoga dengan penjelasan di atas dapat membuat kalian lebih mudah di pahami.. Tapi mohon maaf ya apabila ada penjelasan yang kurang jelas, atau bakan ada kekeliruan... Mohon kasi pembenaran atau pendapat kalian di kolom komentar ya temen - temen... Biar kita bisa belajar bersama - sama..

Sekali lagi saya ingatkan... Kalian juga bisa membuat code program ini menjadi file aplikasi loh.. iya file aplikasi seperti "exe" itu loh.. sehingga, nantinya kita cukup klik dua kali saja untuk menjalankan aplikasi ini... tanpa perlu repot - repot membuka nya di IDLE atau IDE python.. nah seperti apa caranya? cukup mudah kok.. dan saya juga sudah membuatkan tutorialnya.. untuk kalian yang menggunakan windows, KALIAN BISA KLIK DISINI ya temen - temen.. atau jika pada link pertama terlalu rumit, KALIAN BISA MENCOBA CARA INI ya.... dan bagi pengguna linux ? tenang saja.. bisa juga kok membuat file executable nya.. untuk melihat tutorialnya, KALIAN BISA KLIK DISINI temen - temen...



Oke, sekian dulu ya temen - temen postingan saya kali ini..  Semoga apa yang telah saya sampaikan di atas, dapat memberikan manfaat bagi kita semua.. Jika kalian punya kritik, saran dan pesan bisa kalian sampai kan di kolom komentar maupun laman contact us yang ada di halaman ini...

Oke terimakasih dan sampai di sini dulu ya temen - temen... Sampai jumpa di postingan saya yang lainnya.. Oya, jangan lupa untuk membaca versi - versi yang lainnya... Biar ilmunya juga nambah.. Hehe.. Temikasih sekali lagi dan sekian...

Wassalamualaikum wr. wb.
Previous
Next Post »
Thanks for your comment