14
LAPORAN PRAKTIKUM 2.1 “MANIPULASI RGB” Pengolahan Citra JURUSAN TEKNIK INFORMATIKA POLITEKNIK ELEKTRONIKA NEGERI SURABAYA LUSI KURNIA SARI 3D4ITB/2110121049

MANIPULASI RGB

Embed Size (px)

DESCRIPTION

MANIPULASI RGB

Citation preview

Page 1: MANIPULASI RGB

laporan praktikum 2.1 “manipulasi RGB”

JURUSAN TEKNIK INFORMATIKA

LUSI KURNIA SARI 3D4ITB/2110121049

Page 2: MANIPULASI RGB

LAPORAN PRAKTIKUM 2.1“Manipulasi RGB”

PETUNJUK PRAKTIKUM :

1. Buka Visual Studio .Net 2010 2. Pilih File New New Project 3. Pilih Visual C# [Windows Forms Application]. 4. Isi Name dan Solution Name sesuai keinginan misal pada program yang saya

buat dengan nama “Praktikum 2” kemudian tekan tombol [OK]. 5. Setelah muncul form new project, tambahkan 6 Button, 6 PictureBox dan 1

OpenFileDialog. 6. Ubah text Button1 menjadi “Load”. Atur size-mode pada pictureBox1 dengan

StrecthImage. Begitu pula dengan button yang lain yaitu button Layer Red, Layer Green, Layer Blue, GrayScale Red, GreyScale Green, GrayScale Blue, dan Sephia.StretchImage  Menyamakan rasio gambar dengan objek PictureBox, bisa dengan memampatkan lebar atau tinggi. Mungkin gambar yang dihasilkan bisa menyebabkan distorsi untuk membuat gambar yang mempunyai rasio yang sama dengan PictureBox. Makanya untuk memilih jenis SizeMode ini sangat disarankan untuk memilih gambar yang mempunyai perkiraan dimensi yang sama (atau paling tidak mempunyai aspek rasio yang sama). 

7. Aturlah tampilan seperti gambar dibawah ini.

Agar bisa seperti tampilan gambar diatas, ubahlah pada bagian properties – BackgroundImage import gambar sesuai yang diinginkan untuk backround gambar. Untuk mengubah warna button pada properties - BackColor ubah warna pink, agar model button seperti gambar diatas ubah menjadi Flat pada properties – FlatStyle. Kemudian pada pictureBox properties - BackColor ubah menjadi transparent.

8. Tambahkan dua buah object Bitmap sebelum constructor public Form1().

Praktikum 2.1 – Manipulasi RGB Lusi Kurnia Sari (3D4ITB/2110121049)

Page 3: MANIPULASI RGB

Object Bitmap pertama berfungsi untuk menampung gambar asli. Object Bitmap kedua untuk menampung gambar layer warna, layer Grayscale, maupun layer Shepia.

9. a. Double click Button “Load” dan tambahkan program berikut :

Analisa Program :

Fungsi yang tidak mengembalikan nilai load_Click adalah fungsi yang akan dijalankan ketika tombol dengan nama btnLoad diberikan event click. Terbukti fungsi ini memiliki 2 parameter sender dan EventArgs. Di dalamnya terdapat variabel d bertipe DialogResult. D ini akan diisi dengan status pemilihan yang diberikan oleh user melalui object openFileDialog1.ShowDialog(). Jadi file gambarnya sendiri akan disimpan ke dalam object openFileDialog1. Kemudian diberikan pengecekan, jika d adalah "pilihan user berupa tombol" OK, maka variabel File bertipe Image yang tadinya kosong akan diisi dengan FileName dari objek openFileDialog1. Kemudian gambar dalam variabel File tersebut akan ditampilkan di pictureBox1.

b. Double click pada Button Layer Red dan tambahkan program berikut:

Analisa Program :

Program di atas bertujuan untuk menampilkan gambar Layer Red. Sebelumnya, inisialisasi terlebih dahulu komponen image hasil (objBitmap1) dengan image asal (objBitmap) kemudian menentukan panjang dan lebar dari image asal. Setelah diperoleh panjang dan lebar, proses berikutnya adalah membaca data RGB dari pixel(x,y) image asal dengan menggunakan fungsi objBitmap.GetPixel(x,y). Setelah dilakukan proses membaca data pada tiap pixel gambar. Dengan data tersebut dapat dilakukan manipulasi terhadap gambar. Pada program ini dilakukan manipulasi dengan menampilkan salah satu komponen warna R yaitu merah. Oleh karena itu terdapat variable wr untuk menampung komponen warna merah. Kemudian menampilkan layer warna merah dari sebuah gambar dengan mengubah nilai warna selain yang diinginkan dengan nilai 0. Dan warna yang diinginkan tetap dengan nilai aslinya.

Dan dilanjutkan dengan memberikan nilai warna RGB pada pixel(x,y) dalam objBitmap1 dengan menggunakan fungsi objBitmap1.SetPixel(x,y,new_w).

Praktikum 2.1 – Manipulasi RGB Lusi Kurnia Sari (3D4ITB/2110121049)

Page 4: MANIPULASI RGB

Jalankan program kemudian tekan tombol load untuk memilih gambar dari hardisk. Kemudian tekan tombol Layer Red. Maka gambar akan tercopy Layer warna merah pada PictureBox2.

c. Double click pada Button Layer Green dan tambahkan program berikut:

Analisa Program :

Program di atas bertujuan untuk menampilkan gambar Layer Green. Sebelumnya, inisialisasi terlebih dahulu komponen image hasil (objBitmap1) dengan image asal (objBitmap) kemudian menentukan panjang dan lebar dari image asal. Setelah diperoleh panjang dan lebar, proses berikutnya adalah membaca data RGB dari pixel(x,y) image asal dengan menggunakan fungsi objBitmap.GetPixel(x,y). Setelah dilakukan proses membaca data pada tiap pixel gambar. Dengan data tersebut dapat dilakukan manipulasi terhadap gambar. Pada program ini dilakukan manipulasi dengan menampilkan salah satu komponen warna G yaitu hijau. Oleh karena itu terdapat variable wg untuk menampung komponen warna hijau. Kemudian menampilkan layer warna hijau dari sebuah gambar dengan mengubah nilai warna selain yang diinginkan dengan nilai 0. Dan warna yang diinginkan tetap dengan nilai aslinya.

Dan dilanjutkan dengan memberikan nilai warna RGB pada pixel(x,y) dalam objBitmap1 dengan menggunakan fungsi objBitmap1.SetPixel(x,y,new_w).

Jalankan program kemudian tekan tombol load untuk memilih gambar dari hardisk. Kemudian tekan tombol Layer Green. Maka gambar akan tercopy Layer warna hijau pada PictureBox3.

Praktikum 2.1 – Manipulasi RGB Lusi Kurnia Sari (3D4ITB/2110121049)

Page 5: MANIPULASI RGB

d. Double click pada Button Layer Blue dan tambahkan program berikut:

Analisa Program :

Program di atas bertujuan untuk menampilkan gambar Layer Blue. Sebelumnya, inisialisasi terlebih dahulu komponen image hasil (objBitmap1) dengan image asal (objBitmap) kemudian menentukan panjang dan lebar dari image asal. Setelah diperoleh panjang dan lebar, proses berikutnya adalah membaca data RGB dari pixel(x,y) image asal dengan menggunakan fungsi objBitmap.GetPixel(x,y). Setelah dilakukan proses membaca data pada tiap pixel gambar. Dengan data tersebut dapat dilakukan manipulasi terhadap gambar. Pada program ini dilakukan manipulasi dengan menampilkan salah satu komponen warna B yaitu biru. Oleh karena itu terdapat variable wb untuk menampung komponen warna biru. Kemudian menampilkan layer warna biru dari sebuah gambar dengan mengubah nilai warna selain yang diinginkan dengan nilai 0. Dan warna yang diinginkan tetap dengan nilai aslinya.

Dan dilanjutkan dengan memberikan nilai warna RGB pada pixel(x,y) dalam objBitmap1 dengan menggunakan fungsi objBitmap1.SetPixel(x,y,new_w).

Jalankan program kemudian tekan tombol load untuk memilih gambar dari hardisk. Kemudian tekan tombol Layer Blue. Maka gambar akan tercopy Layer warna biru pada PictureBox4.

Praktikum 2.1 – Manipulasi RGB Lusi Kurnia Sari (3D4ITB/2110121049)

Page 6: MANIPULASI RGB

e. Double click pada Button GrayScale Red dan tambahkan program berikut:

Analisa Program :

Program di atas bertujuan untuk menampilkan gambar GrayScale Red. Sebelumnya, inisialisasi terlebih dahulu komponen image hasil (objBitmap1) dengan image asal (objBitmap) kemudian menentukan panjang dan lebar dari image asal. Setelah diperoleh panjang dan lebar, proses berikutnya adalah membaca data RGB dari pixel(x,y) image asal dengan menggunakan fungsi objBitmap.GetPixel(x,y). Setelah dilakukan proses membaca data pada tiap pixel gambar. Dengan data tersebut dapat dilakukan manipulasi terhadap gambar. Pada program ini dilakukan manipulasi dengan mengubah gambar menjadi GrayScale Merah. Oleh karena itu terdapat variable wr untuk menampung komponen warna merah. Kemudian menampilkan GrayScale Red dari sebuah gambar dengan mengubah nilai warna RGB dengan warna yang diinginkan tetap dengan nilai aslinya. Gambar GrayScale memiliki nilai R, G dan B sama. Kita dapat menyamakan nilai dengan salah satu komponen warna yaitu warna merah

Dan dilanjutkan dengan memberikan nilai warna RGB pada pixel(x,y) dalam objBitmap1 dengan menggunakan fungsi objBitmap1.SetPixel(x,y,new_w).

Jalankan program kemudian tekan tombol load untuk memilih gambar dari hardisk. Kemudian tekan tombol GrayScale Red. Maka gambar akan tercopy GrayScale Red pada PictureBox5.

Praktikum 2.1 – Manipulasi RGB Lusi Kurnia Sari (3D4ITB/2110121049)

Page 7: MANIPULASI RGB

f. Double click pada Button GrayScale Green dan tambahkan program berikut:

Analisa Program :

Program di atas bertujuan untuk menampilkan gambar GrayScale Green. Sebelumnya, inisialisasi terlebih dahulu komponen image hasil (objBitmap1) dengan image asal (objBitmap) kemudian menentukan panjang dan lebar dari image asal. Setelah diperoleh panjang dan lebar, proses berikutnya adalah membaca data RGB dari pixel(x,y) image asal dengan menggunakan fungsi objBitmap.GetPixel(x,y). Setelah dilakukan proses membaca data pada tiap pixel gambar. Dengan data tersebut dapat dilakukan manipulasi terhadap gambar. Pada program ini dilakukan manipulasi dengan mengubah gambar menjadi GrayScale Green. Oleh karena itu terdapat variable wg untuk menampung komponen warna hijau. Kemudian menampilkan GrayScale Green dari sebuah gambar dengan mengubah nilai warna RGB dengan warna yang diinginkan tetap dengan nilai aslinya. Gambar GrayScale memiliki nilai R, G dan B sama. Kita dapat menyamakan nilai dengan salah satu komponen warna yaitu warna hijau.

Dan dilanjutkan dengan memberikan nilai warna RGB pada pixel(x,y) dalam objBitmap1 dengan menggunakan fungsi objBitmap1.SetPixel(x,y,new_w).

Jalankan program kemudian tekan tombol load untuk memilih gambar dari hardisk. Kemudian tekan tombol GrayScale Green. Maka gambar akan tercopy GrayScale Green pada PictureBox6.

Praktikum 2.1 – Manipulasi RGB Lusi Kurnia Sari (3D4ITB/2110121049)

Page 8: MANIPULASI RGB

g. Double click pada Button GrayScale Blue dan tambahkan program berikut:

Analisa Program :

Program di atas bertujuan untuk menampilkan gambar GrayScale Blue. Sebelumnya, inisialisasi terlebih dahulu komponen image hasil (objBitmap1) dengan image asal (objBitmap) kemudian menentukan panjang dan lebar dari image asal. Setelah diperoleh panjang dan lebar, proses berikutnya adalah membaca data RGB dari pixel(x,y) image asal dengan menggunakan fungsi objBitmap.GetPixel(x,y). Setelah dilakukan proses membaca data pada tiap pixel gambar. Dengan data tersebut dapat dilakukan manipulasi terhadap gambar. Pada program ini dilakukan manipulasi dengan mengubah gambar menjadi GrayScale Blue. Oleh karena itu terdapat variable wb untuk menampung komponen warna biru. Kemudian menampilkan GrayScale Blue dari sebuah gambar dengan mengubah nilai warna RGB dengan warna yang diinginkan tetap dengan nilai aslinya. Gambar GrayScale memiliki nilai R, G dan B sama. Kita dapat menyamakan nilai dengan salah satu komponen warna yaitu warna biru.

Dan dilanjutkan dengan memberikan nilai warna RGB pada pixel(x,y) dalam objBitmap1 dengan menggunakan fungsi objBitmap1.SetPixel(x,y,new_w).

Jalankan program kemudian tekan tombol load untuk memilih gambar dari hardisk. Kemudian tekan tombol GrayScale Blue. Maka gambar akan tercopy GrayScale Blue pada PictureBox7.

Praktikum 2.1 – Manipulasi RGB Lusi Kurnia Sari (3D4ITB/2110121049)

Page 9: MANIPULASI RGB

h. Double click pada Button Sephia dan tambahkan program berikut:

Analisa Program :

Program di atas bertujuan untuk menampilkan gambar dengan efek sephia. Sebelumnya, inisialisasi terlebih dahulu komponen image hasil (objBitmap1) dengan image asal (objBitmap) kemudian menentukan panjang dan lebar dari image asal. Setelah diperoleh panjang dan lebar, proses berikutnya adalah membaca data RGB dari pixel(x,y) image asal dengan menggunakan fungsi objBitmap.GetPixel(x,y). Setelah dilakukan proses membaca data pada tiap pixel gambar. Dengan data tersebut dapat dilakukan manipulasi terhadap gambar. Pada program ini dilakukan manipulasi dengan menambahkan efek sephia. Operasi sephia menghasilkan gambar yang berwarna merah kecoklatan. Untuk menghasilkan warna merah kecoklatan pada gambar, sebelumnya pada gambar dilakukan operasi grayscaling, kemudian setelah itu dilakukan perubahan nilai pada R dan G sesuai dengan nilai depth (kedalaman) yang dikehendaki.

Praktikum 2.1 – Manipulasi RGB Lusi Kurnia Sari (3D4ITB/2110121049)

Page 10: MANIPULASI RGB

Fungsi untuk menghasilkan efek sephia seperti dibawah ini :

Di mana w.R, w.G, dan w.B adalah nilai RGB input, wr, wg, dan wb adalah nilai RGB output dan depth adalah nilai kedalaman yang diinginkan.

Dan dilanjutkan dengan memberikan nilai warna RGB pada pixel(x,y) dalam objBitmap1 dengan menggunakan fungsi objBitmap1.SetPixel(x,y,new_w).

Jalankan program kemudian tekan tombol load untuk memilih gambar dari hardisk. Kemudian tekan tombol Sephia. Maka gambar akan tercopy Sephia pada PictureBox8.

Source Code :

using System;using System.Collections.Generic;using System.ComponentModel;using System.Data;using System.Drawing;using System.Linq;using System.Text;using System.Windows.Forms;

namespace Praktikum2{ public partial class Form1 : Form {

Praktikum 2.1 – Manipulasi RGB Lusi Kurnia Sari (3D4ITB/2110121049)

Page 11: MANIPULASI RGB

Bitmap objBitmap; Bitmap objBitmap1; public Form1() { InitializeComponent(); } private void load_Click(object sender, EventArgs e) { DialogResult d = openFileDialog1.ShowDialog(); if (d == DialogResult.OK) { objBitmap = new Bitmap(openFileDialog1.FileName); pictureBox1.Image = objBitmap; } } private void LayerRed_Click(object sender, EventArgs e) { objBitmap1 = new Bitmap(objBitmap); for (int x = 0; x < objBitmap.Width; x++) for (int y = 0; y < objBitmap.Height; y++) { Color w = objBitmap.GetPixel(x, y); int wr = w.R; Color new_w = Color.FromArgb(wr, 0, 0); objBitmap1.SetPixel(x, y, new_w); } pictureBox2.Image = objBitmap1; }

private void LayerGreen_Click(object sender, EventArgs e) { objBitmap1 = new Bitmap(objBitmap); for (int x = 0; x < objBitmap.Width; x++) for (int y = 0; y < objBitmap.Height; y++) { Color w = objBitmap.GetPixel(x, y); int wg = w.G; Color new_w = Color.FromArgb(0, wg, 0); objBitmap1.SetPixel(x, y, new_w); } pictureBox3.Image = objBitmap1; }

private void LayerBlue_Click(object sender, EventArgs e) { objBitmap1 = new Bitmap(objBitmap); for (int x = 0; x < objBitmap.Width; x++) for (int y = 0; y < objBitmap.Height; y++) { Color w = objBitmap.GetPixel(x, y); int wb = w.B; Color new_w = Color.FromArgb(0, 0, wb); objBitmap1.SetPixel(x, y, new_w); } pictureBox4.Image = objBitmap1; }

private void GrayScaleRed_Click(object sender, EventArgs e) { objBitmap1 = new Bitmap(objBitmap); for (int x = 0; x < objBitmap.Width; x++) for (int y = 0; y < objBitmap.Height; y++) { Color w = objBitmap.GetPixel(x, y); int wr = w.R; Color new_w = Color.FromArgb(wr, wr, wr); objBitmap1.SetPixel(x, y, new_w); } pictureBox5.Image = objBitmap1; }

private void GrayScaleGreen_Click(object sender, EventArgs e) {

Praktikum 2.1 – Manipulasi RGB Lusi Kurnia Sari (3D4ITB/2110121049)

Page 12: MANIPULASI RGB

objBitmap1 = new Bitmap(objBitmap); for (int x = 0; x < objBitmap.Width; x++) for (int y = 0; y < objBitmap.Height; y++) { Color w = objBitmap.GetPixel(x, y); int wg = w.G; Color new_w = Color.FromArgb(wg, wg, wg); objBitmap1.SetPixel(x, y, new_w); } pictureBox6.Image = objBitmap1; }

private void GrayScaleBlue_Click(object sender, EventArgs e) { objBitmap1 = new Bitmap(objBitmap); for (int x = 0; x < objBitmap.Width; x++) for (int y = 0; y < objBitmap.Height; y++) { Color w = objBitmap.GetPixel(x, y); int wb = w.B; Color new_w = Color.FromArgb(wb, wb, wb); objBitmap1.SetPixel(x, y, new_w); } pictureBox7.Image = objBitmap1; } private void sephia_Click(object sender, EventArgs e) { int depth = 50; objBitmap1 = new Bitmap(objBitmap); for (int x = 0; x < objBitmap.Width; x++) for (int y = 0; y < objBitmap.Height; y++) { Color w = objBitmap.GetPixel(x, y); int color2 = (w.R + w.G + w.B) / 3; int wr = color2 + (depth * 2); int wg = color2 + depth; int wb = color2; if (wr > 255) { wr = 255; } if (wg > 255) { wg = 255; } if (wb > 255) { wb = 255; } Color new_w = Color.FromArgb(wr, wg, wb); objBitmap1.SetPixel(x, y, new_w); } pictureBox8.Image = objBitmap1; } }}

Hasil Output :

Praktikum 2.1 – Manipulasi RGB Lusi Kurnia Sari (3D4ITB/2110121049)

Page 13: MANIPULASI RGB

Praktikum 2.1 – Manipulasi RGB Lusi Kurnia Sari (3D4ITB/2110121049)