PROCESSING

Editing Image Sederhana dengan Processing

Disini kita membuat tipe data dengan masing – masing fungsi

1. PImage gambar -> digunakan untuk mengambil gambar asli

2. PImage simpanGambar -> digunakan untuk menyimpan gambar yang sudah menjadi sephia

3. String pathgambar -> digunakan untuk mengambil lokasi dari gambar asli

4. Int nosimpan=1 -> digunakan untuk penomoran nama gambar yang disimpan dimulai dari no.1

5. Boolean flag=false -> digunakan untuk pengecekan apakah ada gambar shepia yang sudah

dibuat sebelum disimpan.

6. Di prosedur setup terdapat Size (1150,550) -> untuk membuat form sepanjang 1150 x 550

pixels dengan background warna putih -> background(255).

7. Didalam prosedur draw(), kita membuat garis sebagai pembentuk header dengan ukuran

1000x50 pixels dibagi menjadi 2 header dan bingkai gambar sebesar 1000x500 pixels dibagi

menjadi 2 bingkai. Di dalam kotak header kita tulis text “Gambar Asli” pada posisi (200,25)

dan text “Gambar Hasil Editing” pada posisi (670,25). Keduanya bertipe huruf “Arial” dan

berukuran 20 berwarna hitam, serta aligmentnya rata kiri pada horizontalnya dan rata tengah di

vertikalnya.

Preview gambarnya :

8. Di prosedur draw() kita buat 3 kotak dengan ukuran 100x30 pixels pada posisi kotak ke-1

(1030,60), kotak ke-2 (1030,110), kotak ke-3 (1030,160) dengan warna abu-abu. Kemudian

kita membuat tulisan pada masing-masing kotak, untuk kotak ke-1 bertuliskan “Pilih Gambar”

di posisi (1040,74), kotak ke-2 bertuliskan “Ubah Shepia” di posisi (1040,124), kotak ke-3

bertuliskan “Simpan Gambar” di posisi (1040,174). Ketiga Text bertipe “Arial” berukuran 12

dan berwarna kuning, untuk aligment rata kiri di horizontal dan rata tengah di vertikal.

Preview :

9. Di prosedur draw() kita beri kondisi jika pathgambar tidak sama dengan “null / kosong”, maka

ambil gambar dari pathgambar yang tersimpan. Kemudian tampilkan pada pada jendela di

bingkai ke-1, dengan letak (0,50) dan berukuran 500x500 pixels. Apabila pathgambar sama

dengan “null / kosong” maka tidak melakukan apa-apa.

10. Pada prosedur mousePressed() / ketika mouse di klik, jika letak koordinat x pada mouse

terletak antara 1030<x<1130, maka lakukan hal berikut dibawah ini. Kondisi pertama jika

koordinat y pada mouse terletak antara 60<y<90 / atau dapat dikatakan mouse terletak antara

(1031,61) hingga (1131,89) yaitu kotak ke-1 maka lakukan pemilihan file gambar dengan

prosedure selectInput (prompt,callback) dimana prompt berisi string untuk keterangan user,

dan callback berisi string untuk memanggil fungsi. Disini prompt bertuliskan “Pilih gambar”

dan callback memanggil fungsi “fileSelected”.

11. Disini fungsi fileSelected() dipanggil, jika ada file yang dipilih atau selection bukan sama

dengan “null” maka akan mengambil alamat dari gambar yang dipilih tersebut dan disimpan

dalam variabel pathgambar, maka kondisi di prosedur draw() pathgambar bukan sama dengan

“null” dan gambar akan ditampilkan dan diletakkan pada bingkai ke-1.

Preview :

a. Kotak ke-1 ketika diklik

b. File gambar dipilih

c. File ditampilkan pada bingkai ke-1

Code berikutnya :

12. Pada kondisi ke-2 pada prosedur mousePressed() / mouse ketika diklik, jika koordinat y pada

mouse terletak antara 110<y<140 / atau dapat dikatakan mouse terletak antara (1031,111)

hingga (1131,139) maka akan dilakukan kondisi pertama jika pathgambar==null / tidak ada isi

di variabel pathgambar maka tampilkan pesan dalam bentuk box dengan tulisan “Pilih gambar

terlebih dahulu!!”. Jika kondisi ke-2 atau pathgambar bukan sama dengan null yaitu

pathgambar ada isi alamat gambar, maka lakukan :

1. Flag dari false berubah menjadi true sebagai penanda bahwa ada gambar yang dirubah ke shepia.

2. Membuat image baru dengan nama fotoOlahan yang berukuran sama dengan gambar asli (width,height, RGB) dan sewarna.

3. Membuat looping untuk mendapatkan pixel (x,y) dari gambar asli dengan variabel “i” sebagai “x” dan variabel “j” sebagai “y”. Kemudian menyimpan warna gambar asli per pixel (x,y) kedalam variabel warnaAsli dengan tipe “color”. Lalu membentuk 3 element warna dengan tipe float dimana element ke-1 yaitu merahBaru didapat dari warna merah dari warnaAsli dikali 0.393 kemudian ditambah dengan warna hijau dari warnaAsli dikali 0.769 kemudian ditambah dengan warna biru dari warnaAsli dikali 0.189. Element ke-2 yaitu hijauBaru didapat dari warna merah dari warnaAsli dikali 0.349 kemudian ditambah dengan warna hijau dari warnaAsli dikali 0.686 kemudian ditambah dengan warna biru dari warnaAsli dikali 0.168. Element ke-2 yaitu biruBaru didapat dari warna merah dari warnaAsli dikali 0.272 kemudian ditambah dengan warna hijau dari warnaAsli dikali 0.534 kemudian ditambah dengan warna biru dari warnaAsli dikali 0.131.

4. Setelah ketika 3 element terbentuk (R,G,B) maka membuat warna yang baru bernama warnaOlah bertipe color yang terdiri dari elemet R/red dari element merahBaru, element G/green dari element hijauBaru dan element B/blue dari element biruBaru dan ketiganya dibatasi apabila >255 maka disetel menjadi 255.

5. Kemudian mensetting gambar baru yaitu fotoOlahan dengan komponen titik koordinat pixel (x,y) yaitu didapat dari (i,j) dan warna RGBnya didapat dari warnaOlah.

6. Dilakukan looping dengan perlakuan yang sama hingga sesuai ukuran pixel gambar asli.

7. Setelah looping selesai maka menampilkan gambar baru fotoOlahan di bingkai ke-2 pada koordinat (500,50) dan ukuran 500x500 pixels, lalu membuat gambar baru lagi simpanGambar untuk persiapan jika fotoOlahan yang sudah menjadi shepia ingin disimpan. Gambar baru tersebut seukuran dan sewarna dengan fotoOlahan.

Preview :