Penjelasan Terstruktur: GUI Color Spaces (HSV & YCrCb)
Dokumen ini menjelaskan setiap deklarasi pada script, disertai snippet kode berformat Python, terurut sesuai alur file.
1) Import Library
Bagian ini mengimpor pustaka yang dibutuhkan: OpenCV untuk pemrosesan citra, Tkinter untuk GUI (termasuk dialog file dan pesan), Pillow untuk mengubah array menjadi gambar yang bisa ditampilkan di Tkinter, NumPy untuk representasi citra, serta os/sys untuk pengelolaan path modul.
import cv2
import tkinter as tk
from tkinter import filedialog, messagebox
from PIL import Image, ImageTk
import numpy as np
import os, sys2) Setup Path Proyek
Menentukan direktori file saat ini dan direktori induk proyek, lalu menambahkannya ke sys.path agar modul internal proyek dapat ditemukan ketika script dijalankan langsung.
_FILE_DIR = os.path.dirname(__file__)
_ROOT_DIR = os.path.abspath(os.path.join(_FILE_DIR, ".."))
if _ROOT_DIR not in sys.path:
sys.path.insert(0, _ROOT_DIR)3) Import Fungsi Pembaca Gambar
Mengimpor fungsi kustom read_image dari modul internal proyek untuk membaca file gambar dengan hasil berupa array RGB secara konsisten.
from common.io import read_image4) Deklarasi Kelas GUI
Mendefinisikan kelas utama aplikasi GUI. Konstruktor menerima jendela Tkinter (root) dan memberi judul pada jendela aplikasi.
class ColorSpacesGUI:
def __init__(self, root):
self.root = root
self.root.title("Color Spaces - HSV & YCrCb")5) State Aplikasi
Menyimpan data citra: img_rgb (asli/RGB), img_hsv (konversi HSV), img_ycc (konversi YCrCb). Variabel photo menampung objek gambar Tkinter terakhir agar tidak dihapus oleh garbage collector.
# State
self.img_rgb: np.ndarray | None = None
self.img_hsv: np.ndarray | None = None
self.img_ycc: np.ndarray | None = None
self.photo: ImageTk.PhotoImage | None = None6) Frame Atas (Tombol & Status)
Membuat frame bagian atas yang memuat tombol 'Buka Gambar…' untuk memilih file serta label status untuk menampilkan jalur file atau pesan singkat.
top = tk.Frame(root)
top.pack(side=tk.TOP, fill=tk.X, padx=8, pady=8)
btn_open = tk.Button(top, text="Buka Gambar...", command=self.open_image)
btn_open.pack(side=tk.LEFT)
self.status = tk.Label(top, text="Tidak ada gambar", anchor="w")
self.status.pack(side=tk.LEFT, padx=10)7) Frame Kontrol (Tombol Kanal)
Menyediakan tombol-tombol untuk menampilkan citra asli dan masing-masing kanal dari HSV maupun YCrCb. Parameter ruang warna dan indeks kanal disuntik melalui lambda.
controls = tk.LabelFrame(root, text="Proses Color Spaces")
controls.pack(side=tk.TOP, fill=tk.X, padx=8, pady=4)
btns = [
("Tampilkan Asli", self.show_original),
("HSV - C1", lambda: self.show_channel("HSV", 0)),
("HSV - C2", lambda: self.show_channel("HSV", 1)),
("HSV - C3", lambda: self.show_channel("HSV", 2)),
("YCrCb - C1", lambda: self.show_channel("YCrCb", 0)),
("YCrCb - C2", lambda: self.show_channel("YCrCb", 1)),
("YCrCb - C3", lambda: self.show_channel("YCrCb", 2)),
]
for text, cmd in btns:
tk.Button(controls, text=text, command=cmd).pack(side=tk.LEFT, padx=4, pady=4)8) Area Judul & Tampilan Gambar
title_label menampilkan judul konteks (mis. 'HSV - C2'). img_label bertindak sebagai kanvas tempat gambar ditampilkan dengan latar abu-abu dan ukuran awal 640×360.
self.title_label = tk.Label(root, text="", font=("Segoe UI", 10, "bold"))
self.title_label.pack(side=tk.TOP, padx=8, pady=(6, 0), anchor="w")
self.img_label = tk.Label(root, bg="#ddd", width=640, height=360)
self.img_label.pack(side=tk.TOP, padx=8, pady=8, fill=tk.BOTH, expand=True)9) Memilih & Membaca Gambar + Pra-Konversi
Menampilkan dialog pilih file, membaca gambar via read_image. Jika berhasil, langsung mengonversi ke HSV dan YCrCb (pra-hitung agar cepat saat kanal dipilih), memperbarui status, lalu menampilkan citra asli.
def open_image(self):
path = filedialog.askopenfilename(
title="Pilih Gambar",
filetypes=[
("Gambar", "*.png;*.jpg;*.jpeg;*.bmp;*.tif;*.tiff"),
("Semua File", "*.*"),
],
)
if not path:
return
try:
self.img_rgb = read_image(path)
except Exception as e:
messagebox.showerror("Gagal Membaca", str(e))
return
# Precompute color spaces
self.img_hsv = cv2.cvtColor(self.img_rgb, cv2.COLOR_RGB2HSV)
self.img_ycc = cv2.cvtColor(self.img_rgb, cv2.COLOR_RGB2YCrCb)
self.status.config(text=path)
self.show_original()10) Menampilkan Citra Asli (RGB)
Memastikan gambar sudah dimuat, kemudian merender citra RGB dengan judul yang sesuai.
def show_original(self):
if self._ensure_image_loaded():
self._render(self.img_rgb, title="Citra Asli (RGB)")11) Menampilkan Kanal HSV/YCrCb
Memilih array ruang warna sesuai parameter, mengekstrak kanal ke-idx, lalu merender kanal tersebut sebagai citra grayscale dengan judul yang informatif.
def show_channel(self, space: str, idx: int):
if not self._ensure_image_loaded():
return
if space == "HSV":
arr = self.img_hsv
elif space == "YCrCb":
arr = self.img_ycc
else:
return
ch = arr[:, :, idx]
name = f"{space} - C{idx+1}"
self._render(ch, title=name)12) Validasi Ketersediaan Gambar
Mencegah aksi dilakukan sebelum gambar dimuat. Jika belum ada gambar, tampilkan informasi kepada pengguna dan hentikan proses.
def _ensure_image_loaded(self) -> bool:
if self.img_rgb is None:
messagebox.showinfo("Info", "Silakan buka gambar terlebih dahulu.")
return False
return True13) Render Gambar ke Label Tkinter
Mengubah array (grayscale atau RGB) menjadi gambar PIL, me-resize proporsional hingga maksimum 960×600, mengonversinya ke PhotoImage untuk Tkinter, lalu menampilkannya pada img_label dan memperbarui judul.
def _render(self, img: np.ndarray, title: str = ""):
# Convert numpy array (RGB or grayscale) to ImageTk and fit to label
if img.ndim == 2:
pil = Image.fromarray(img.astype(np.uint8), mode="L")
else:
pil = Image.fromarray(img.astype(np.uint8))
# Fit to a reasonable max size while keeping aspect ratio
max_w, max_h = 960, 600
pil = self._fit_image(pil, max_w, max_h)
self.photo = ImageTk.PhotoImage(pil)
self.img_label.configure(image=self.photo)
self.title_label.configure(text=title)14) Helper Resize Proporsional
Menghitung faktor skala terbaik agar gambar muat dalam batas lebar/tinggi tanpa merusak rasio. Menggunakan LANCZOS untuk kualitas resize yang halus.
@staticmethod
def _fit_image(im: Image.Image, max_w: int, max_h: int) -> Image.Image:
w, h = im.size
scale = min(max_w / w, max_h / h, 1.0)
new_size = (int(w * scale), int(h * scale))
return im.resize(new_size, Image.Resampling.LANCZOS)15) Entry Point Aplikasi
Menjalankan aplikasi ketika file dieksekusi langsung: membuat jendela Tkinter, menginstansiasi kelas GUI, dan memulai event loop agar antarmuka responsif.
if __name__ == "__main__":
root = tk.Tk()
app = ColorSpacesGUI(root)
root.mainloop()