YOLOv8 Screen Capture Detection App
Tags: beginners, python, ai, indonesia
Published: 2024-07-04 06:25:28

## Tentang Program

Saya mencoba membuat aplikasi pendeteksian di dalam monitor sebagai bentuk skripsi dari perkuliahan saya, dengan cara kerja menangkap bytes yang ada di layar monitor > clone image from bytes > convert numpy array > plot/detect(YOLOv8) > clone image from array > show result.

*Sekedar sharing project, diharapkan saya mendapatkan beberapa masukkan terkait project. Terima kasih sudah membaca.

## Model: YOLOv8
- Mendeteksi tidak pakai helm, sarung tangan dan jacket.

## General User Interface
- Tkinter

## Screen Orientation
- 1680x1050
- 1600x900 (recommended)
- 1440x900
- 1400x1050

## List Button 

1. Play button : menjalankan pendeteksian
2. Pause button : memberhentikan pendeteksian(sebagai limiter while loop).
3. Disable Screen button : Set screen menjadi default(saat awal di buka).
4. Sharpen button : Membuat image menjadi sharpen dengan cv2.
5. Nightvis button : Membuat image menjadi BGR2HLS dengan cv2.
6. Save Button : Untuk sekarang masih save dalam bentuk foto .png (*Next akan di coba update untuk save video .mp4).
7 Update Button : Untuk mengkonfigurasi inference dari model yang sudah di latih (accuracy : imgsz, IoU, Conf).
8. Reset Button : Untuk mengreset konfigurasi inference menjadi nilai default.
9. Quit Button : Untuk keluar dari program.

## Preview Program 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zhyrf2tvbu32ayh5sfga.png)

Kondisi awal mulai

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xtd4hzt6hwysqrrmxmu8.png)

Detect Normal

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3zkankjgnxf4atiap5u4.png)

Detect Sharpen

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fr5sioxof7pqzuoo0q19.png)

Detect Sharpen + Nightvis

## Code
Bagian ini saya akan menjelaskan apa yang saya tulis di dalam code.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nzznhuoqsy8bk58fm2iz.png)

Line 1 - 9 adalah beberapa packages yang dibutuhkan dalam menjalankan program.
1. Multiprocessing < diadakan untuk menghindari program memiliki window lebih dari yang dibuat. (*Masih belum pasti)
2. Ultralytics < untuk pendeteksian pada numpy array yang dimiliki sebagai data.
3. Tkinter < untuk GUI
4. Numpy < numpy array
5. cv2 < untuk konfigurasi image (filter, konversi warna)
6. os.path < untuk pengecekan file pada proses save image agar tidak overwrite.
7. mss < untuk menangkap bytes dari monitor yang digunakan.
8. PIL < untuk mengclone image dari bytes dan dari array.
9. random < untuk membuat angka random 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3bl5i0mdwgzddpppdzuf.png)

wdw adalah window utama yang akan digunakan untuk menampilkan pendeteksian. beberapa variable di set false dikarnakan pendeteksian diawali dengan deteksi normal. setiap variable bisa saja berubah sesuai input user.

window utama memiliki title, dan icon. Hal yang perlu di perhatikan adalah mendapatkan nilai yang sebenarnya dari screen monitor (display orientation) di aplikasi ini saya pakai .winfo_screenwidth() dan .winfo_screenheight(). beberapa variable digunakan untuk starting position, dan lebar, tinggi dari window app.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ateml8al9rme40kbyjpb.png)

karna button divisualisasikan dengan image, maka perlu beberapa image untuk button. variable listwidget digunakan untuk menampung semua button yang sudah dibuat, agar tidak terjadi overwrite.

iou, conf, dan acu variable disiapkan untuk tampungan nilai dari sliders pada aplikasi.

withdraw() untuk menyembunyikan main window (sebagai salah satu cara membuat splash screen).

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zlshypz10i8rgrzlhv0a.png)

kumpulan function untuk membuat button, sliders, dan label yang memiliki beberapa parameter yang dibutuhkan. untuk button memerlukan 3 argument : argument pertama image, argument kedua perintah untuk menjalankan function yang di tugaskan pada button, argument ketiga letak frames.
labelinfo hanya 1 argument :  argument untuk pesan string. sliders 3 argument : argument pertama untuk variable yang akan di tampung nilai dari sliders, argument kedua untuk nama sliders, argument ketiga untuk posisi start sesuai default inference argument YOLOv8 Detect.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7us1kn039s902ozyer6w.png)

mengresize semua image yang akan digunakan pada pembuatan button.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7v7t7wwujihg9t8g010r.png)

function yang digunakan untuk membuat window splashscreen, dimana window ini akan tampil diawal saat program dijalankan selama beberapa detik. dan di dalam nya terdapat beberapa kata motivasi untuk tetap hidup dan berjuang.

window ini di tampilkan di tengah layar dengan ketentuan nilai tertentu(tidak adaptive ke berbagai resolusi). Diperlukan pengurangan dengan width dan height dari window splash screen agar window splash screen berada di tengah.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/kzzscm8ydi1gc82ru7hm.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/x2vywpgoigdkqcsxcbqo.png)

semua yang dibutuhkan main window terload up > munculkan splash screen > tunggu 5 detik. splashscreen dihancurkan dan main window ditampilkan kembali.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/30c9aqll6j5nyc26zej7.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/td2c94v8stijeyvs6rpi.png)

Kedua gambar diatas adalah inti dari program dimana program membuat sebuah jaring penangkap bytes dengan mss. starting position jaring top(0), left(0), lebar jaring, tinggi jaring. setelah mendapatkan bytes, clone image dari bytes, dan buat kernel untuk sharpen image.

di normal detection tidak menggunakan kernel, kernel dipakai jika variabel sharpeOn bernilai True. hasil dari clone image > numpy array untuk melakukan pendeteksian YOLO dan plotting > hasil pendeteksian dibuat clone image dari array > kedalam variable yang akan mengupdate image pada label tkinter.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7oly0pss8vergitzqbw1.png)

Untuk perintah tombol start jalankan detect() dan config state dari beberapa tombol "active" / "disable" untuk mengurangi kemungkinan bug yang akan terjadi karna user input.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/uwdtiaukmfol9x0w5ku3.png)

Untuk memberhentikan detect()/sebagai limiter dari while loop(wdw.after()) 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jxsoln8uu9ivip7t41dd.png)

disable button memiliki perintah hampir sama dengan pause, hanya membuat program kembali ke state awal saat dijalankan(layar pendeteksian).

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wd3j1l9r9kuyiu23gq6o.png)

untuk button sharpen dan nightvis bersifat togle dengan tujuan memberikan nilai True / False, yang nantinya akan mempengaruhi detect().

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/y271ns1ufzis5yn10j6z.png)

melakukan pengecekan if dengan nama file, agar tidak terjadi overwrite data dan save image hasil clone image menjadi .png

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/u22odjbf4uns9hjhgdvv.png)

update model ini digunakan ketika button update model di tekan, mengubah nilai default dari imgsz(accuracy), conf, dan iou sesuai input user dari sliders.

*nilai imgsz harus bisa dibagi 2^5 dan menghasilkan int. karna hal ini akan mempengaruhi backbone dari YOLO.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/g63tdf2ue3sr12q0d6v0.png)

Reset model untuk mengembalikan nilai ke default dari model yang sudah diupdate imgsz, Conf, dan IoU.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nfybqt1p0ilv4ofhgqb6.png)

Quit program dengan membalikan layar utama ke initial state dan memberi jeda 3 detik untuk hancurkan window utama lalu exit program.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rwb5h3y4qgnvj0vw7jmm.png)

gambar diatas merupakan kumpulan frame(untuk tata letak) dan widget yang di butuhkan main window untuk melakukan tugas nya dalam mendeteksi. setiap line di eksekusi ketika main window dalam keadaan hide agar saat splash screen dihancurkan dan main window di tampilkan, semua dalam keadaan siap.

## FULL CODE 
https://github.com/Alfin45/YOLOv8-Screen-Capture-Detection-App