Graphical User Interface (GUI) dengan Python #2

Presentasi berjudul: "Graphical User Interface (GUI) dengan Python #2"— Transcript presentasi:

1 Graphical User Interface (GUI) dengan Python #2
Program Digitalent Kominfo: Big Data Analytics Disusun oleh: Astria Nur Irfansyah, PhD 2018

2 Tkinter Rangkuman sebelumnya: Library Python untuk GUI.
Berbasis widget (objek Tk, label, button, dll), yang perlu ditempatkan dengan geometry manager (pack, grid, dan place). Jumlah pengaturan yang bisa dilakukan dalam tkinter: sangat banyak. Untuk lengkapnya, perlu merujuk referensi.

3 Widget: Text “Text” (widget) adalah kotak teks yang bisa diedit.
Syntax: w = tk.Text (master, options, …) parent: parent window options: pilihan pengaturan

4 Membuka file CSV untuk ditampilkan
import tkinter as tk import pandas as pd data = pd.read_csv(' data = data.to_string() utama = tk.Tk() kotak_teks = tk.Text(utama) kotak_teks.insert(tk.INSERT, data) kotak_teks.pack() utama.mainloop()

5 Pengaturan widget text
Menambahkan teks: text.insert(tk.END, "Menambahkan teks di akhir ") text.insert(tk.INSERT, " Menambahkan di kursor") Membaca teks: simpan = text.get(1.0, tk.END)

6 Scroll vertikal pada Text
import tkinter as tk import pandas as pd data = pd.read_csv(' data = data.to_string() utama = tk.Tk() scrollbar = tk.Scrollbar(utama) scrollbar.pack(side=tk.RIGHT, fill=tk.Y) kotak_teks = tk.Text(utama, wrap=tk.WORD, yscrollcommand=scrollbar.set) scrollbar.config(command=kotak_teks.yview) kotak_teks.insert(tk.INSERT, data) kotak_teks.pack() utama.mainloop() 1. Buat widget scrollbar 2. Atur yscrollcommand-nya Text ke method set-nya scrollbar 3. Atur command (scrollbar) agar bekerja untuk yview-nya Text

7 Hasilnya:

8 Widget: Canvas Canvas adalah widget untuk tujuan grafis: Syntax:
Menggambar garis, oval, polygon Gambar (image) Teks Syntax: w = Canvas (master, options, …)

9 Menggambar geometri import tkinter as tk utama = tk.Tk() w = tk.Canvas(utama, width = 400, height = 300) w.pack() w.create_line(0,0, 300,250, fill="green") w.create_arc(20,20, 280,280, start = 0, extent =340, fill="yellow") w.create_polygon(10,290, 10, 200, 200,290, fill="blue") utama.mainloop()

10 Hasilnya:

11 Menambahkan objek button dan image
import tkinter as tk utama = tk.Tk() w = tk.Canvas(utama, width = 400, height = 300) w.pack() # Siapkan file logo.png sendiri citra = tk.PhotoImage(file = "logo.png") w.create_image(10,10, anchor=tk.NW, image = citra) # membuat tombol button = tk.Button(w, text="KELUAR", command=utama.destroy) w.create_window(320,250, anchor=tk.NW, window=button) utama.mainloop()

12 Hasilnya:

13 Menerima input posisi mouse
Memakai prinsip event dan bind. Event bisa berupa: Tombol keyboard ditekan: <char> Mouse diklik: <Button-1> Mouse di-drag: <B1-Motion> dan lain-lain Kejadian (event) tersebut dapat dipasangkan (bind) dengan function pilihan kita.

14 Menerima input posisi mouse
import tkinter as tk def mouse_diklik(event): x = event.x y = event.y w.create_oval(x-10,y-10,x+10,y+10,fill="yellow") utama = tk.Tk() w = tk.Canvas(utama, width = 400, height = 300) w.pack() w.bind("<Button-1>", mouse_diklik) w.create_text(200,150, text="Silakan klik di mana saja.") utama.mainloop() Kode function yang ingin di-bind dengan event klik mouse Binding event klik mouse dengan function yang diinginkan

15 Hasilnya:

16 Animasi sederhana import tkinter as tk def mouse_diklik(event):
x = event.x y = event.y xybaru = (x-10,y-10,x+10,y+10) w.coords(bulatan,xybaru) utama = tk.Tk() w = tk.Canvas(utama, width = 400, height = 300) w.pack() w.bind("<Button-1>", mouse_diklik) bulatan=w.create_oval(190,140, 210,160, fill="yellow") w.create_text(200,150, text="Silakan klik di mana saja.") utama.mainloop()

17 Menampilkan plot dari matplotlib
Prosedur: Figure dibuat dengan matplotlib.figure.Figure Ada dua canvas yang dibuat: Satu dengan tkinter, dengan: tkinter.Canvas Satu dari matplotlib, dengan: FigureCanvasTkAgg Canvas kosong yang dibuat dengan tkinter menjadi wadah bagi canvas-nya matplotlib (FigureCanvasTkAgg), yang diisi dengan figure hasil plot.

18 Plotting matplotlib interaktif di canvas tkinter
import matplotlib as mpl utama = tk.Tk() import numpy as np w = tk.Canvas(utama, width=600, height=500) import tkinter as tk w.pack() from matplotlib.backends.backend_tkagg import FigureCanvasTkAgg canvas = FigureCanvasTkAgg(fig, master=w) def update_plot(): canvas.get_tk_widget().pack(side=tk.TOP, fill=tk.BOTH, expand=1) frek = float(input_frek.get()) y = 1 + np.sin(frek * 2 * np.pi * t) ax.cla() # hapus yang lama # Buat tombol update frekuensi sinus ax.plot(t, y, 'r-') tombol = tk.Button(utama, text="Update frekuensi", command=update_plot) ax.grid() canvas.draw() tombol.pack() print("update") # Buat entry frekuensi sinus # Data for plotting input_frek = tk.Entry(utama, bd=5) frek = 1 input_frek.insert(tk.END, '1') t = np.arange(0.0, 2.0, 0.01) input_frek.pack() y = 1 + np.sin(frek * 2 * np.pi * t)# sinus utama.mainloop() fig = mpl.figure.Figure(figsize = (6,5)) ax = fig.add_axes([0.1,0.1,0.85,0.85])

19 Hasilnya:

20 Tugas: Buatlah GUI yang mampu menampilkan plot dari data file CSV di komputer lokal memanfaatkan file dialog box. Gunakan: tkinter: Canvas, filedialog, button pandas: read_csv matplotlib