LAPORAN WORKSHOP SISTEM ANTARMUKA

Novanna Rahma Zani – 1103181047

PRAKTIKUM 5
Judul : Lab5 – Serial Communication between 2 PC’s
Tanggal : 5 Mei 2020

TUJUAN
Mahasiswa dapat menggunakan SerialPort class untuk mengirim dan menerima data antar PC.

PENDAHULUAN
Pada workshop sebelumnya, anda telah mencoba dua aplikasi yang saling berkomunikasi
didalam sebuah PC menggunakan kabel virtual. Teknik ini sangat berguna untuk melakukan
evaluasi apakah aplikasi yang kita bangun telah bekerja dengan benar, dalam kasus pertukaran
datanya. Setelah aplikasi yang anda buat lolos uji, saatnya mencoba untuk bertukar data dengan
PC yang lain. Untuk workshop kali ini, anda akan mencoba melakukan tukar data antar PC
menggunakan port serial. Bila PC atau laptop anda tidak mempunyai port serial (hanya port
USB), maka anda membutuhkan bantuan konverter USB-ke-Serial seperti ditunjutkkan oleh
Gambar 1.

Gambar 1. Konverter USB ke serial.

Sebelum port serial dapat digunakan, aplikasi akan memilih menggunakan port serial
yang mana, kemudian melakukan inisialisasi seperti kecepatan yang digunakan, jenis parity yang
digunakan, jumlah data bit yang dipakai, dan jumlah stop bit yang digunakan. Setelah itu,
barulah port serial dibuka dan siap digunakan untuk mengirim atau menerima data.
PERALATAN
1. Dua unit komputer dengan Visual Studio 2012
2. Kabel USB-Serial
3. Kabel ekstensi serial
 Novanna Rahma Zani - 1103181047

PROSEDUR PERCOBAAN
1. Membuka dan menjalankan aplikasi yang telah dibuat (yang bertujuan untuk mengirim
dan
menerima data) pada workshop sebelumnya.
2. Memasang konverter USB-ke-Serial pada PC yang digunakan, dan memasang juga pada
PC
lain yang digunakan untuk bertukar data. Menggunakan kabel ekstensi serial untuk
menghubungkan kedua kabel konverter tersebut.
3. Melakukan pengiriman data pada PC anda, jika tidak ada yang salah, maka pada PC lain
yang terhubung akan menerima data yang dikirimkan.

HASIL PERCOBAAN
5a. Hasil Percobaan Sesuai Prosedur Modul 5
1. Membuka dan menjalankan aplikasi yang telah dibuat (yang bertujuan untuk mengirim
dan
menerima data) pada workshop sebelumnya.
 Simulasi

Gambar 2. Tampilan aplikasi Lab4

2. Memasang konverter USB-ke-Serial pada PC yang digunakan, dan memasang juga pada
PC
 Novanna Rahma Zani - 1103181047

lain yang digunakan untuk bertukar data. Menggunakan kabel ekstensi serial untuk
menghubungkan kedua kabel konverter tersebut.
 Novanna Rahma Zani - 1103181047

(a) (b)
Gambar 3. (a) Konfigurasi 3-wire cross cable Connector DB9 Female
(b) konverter USB-ke-Serial pada 2 PC yang akan berkomunikasi

3. Melakukan pengiriman data pada PC anda, jika tidak ada yang salah, maka pada PC lain
yang terhubung akan menerima data yang dikirimkan.

Gambar 4. PC1 dengan COM2

Gambar 5. PC2 dengan COM1

 Novanna Rahma Zani - 1103181047

TUGAS
5b. Tugas 1
Membuat aplikasi pertama pada PC anda, untuk mensimulasikan sebuah (satu) tombol
kendali dari sebuat peralatan. Jika tombol ditekan, maka text akan berganti dari “ON” ke
“OFF”, dan seterusnya. Jika tersebut ditekan, maka aplikasi akan mengirimkan data ke port
serial. Data yang dikirimkan adalah informasi status tombol, apakah sedang ON atau OFF.
Hasil :

Gambar 5. Tugas 1 - PC1 sebagai transmitter

Gambar 6. Tugas 1 – PC2 sebagai receiver

Deskripsi :
Dalam mempelajari komunikasi serial, implementasi menyalakan dan mematikan dengan
button dibuat dalam project smart home. Aplikasi ini berupa pengiriman perintah untuk
menyalakan maupun mematikan lampu di beberapa ruangan. Sesuai perintah tugas 1, aplikasi
ini menyediakan fitur Notifikasi berupa status perintah yang diterima. Sehingga Aplikasi
 Novanna Rahma Zani - 1103181047

penerima (receiver) menerima informasi perintah yang dikirimkan aplikasi pengirim

(transmitter).
Analisa Program :
private void bunifuSwitch1_Click(object sender, EventArgs e)
{
if (serialPort1.IsOpen == true)
{
if (bunifuSwitch1.Value == true)
{
serialPort1.Write("Terrace ON" + "\n\r");
listBox1.Items.Add("Terrace Turn ON!");
}
else
{
serialPort1.Write("Terrace OFF" + "\n\r");
listBox1.Items.Add("Terrace Turn OFF!");
}
}
else
MessageBox.Show("Koneksikan PORT!");
}

 Program melakukan komunikasi dengan pemilihan port dilakukan seperti percobaan lab
4.
 Jika percobaan sebelumnya mengirimkan text dari textbox lalu klik send, pada tugas ini
program yang dikirim berasal dari switch. Dapat dilihat pada program diatas, perintah ini
dilakukan ketika user klik tombol switch. Ketika user klik switch, program memberikan
proteksi terlebih dulu, memastikan user telah mengkoneksikan serial port dengan
if (serialPort1.IsOpen == true) {eksekusi selanjutnya}
else
MessageBox.Show("Koneksikan PORT!");
Setelah itu, perintah apa yang akan dikirimkan mengikuti kondisi awal switch.
bunifuSwitch1.Value == true : Switch bernilai 1 atau on ;
bunifuSwitch1.Value == false : Switch bernilai 0 atau off ;
Lalu terdapat dua perintah yang program lakukan,
serialPort1.Write("Terrace ON" + "\n\r"); => Perintah yang dikirimkan ke receiver.
listBox1.Items.Add("Terrace Turn ON!"); => Text yang akan dicatat di aplikasi transmitter.

Program Lengkap : Lampiran 1.1 Program Lengkap Tugas 1

 Novanna Rahma Zani - 1103181047

5c. Tugas 2
Membuat aplikasi kedua pada PC yang lain, untuk mensimulasikan sebuah (satu) peralatan
yang akan dikendalikan. Aplikasi ini menunggu data serial yang masuk. Jika aplikasi
menerima informasi bahwa tombol kendali dalam posisi ON, maka nyalakan peralatan.
Sebaliknya, jika aplikasi menerima informasi bahwa tombol kendali dalam posisi OFF, maka
matikan peralatan. Peralatan yang dimaksud dapat anda simulasikan dengan sebuah tombol
yang dapat berganti warna.
Hasil :

Gambar 7. Tugas 2 - PC1 sebagai Transmitter

Gambar 8. Tugas 2 - PC2 sebagai Receiver

Deskripsi :
Dalam mempelajari komunikasi serial, implementasi menyalakan dan mematikan dengan
button dibuat dalam project smart home. Aplikasi ini berupa pengiriman perintah untuk
menyalakan maupun mematikan lampu di beberapa ruangan. Sesuai perintah tugas 2, aplikasi
 Novanna Rahma Zani - 1103181047

ini menyediakan fitur Notifikasi berupa status perintah yang diterima dan tambahan state
indicator berupa gambar/warna yang berubah mengikuti kondisi perintah. Sehingga Aplikasi
penerima (receiver) menerima informasi perintah dan menampilkan indikator yang
dikirimkan dari aplikasi pengirim (transmitter).
Analisa program :
public partial class Form1 : Form
{
Image TOFF = Properties.Resources.Button_Blank_Gray_icon;
Image TON = Properties.Resources.Button_Blank_Green_icon;
....
Image WOFF = Properties.Resources.Button_Blank_Gray_icon;
Image WON = Properties.Resources.Button_Blank_Green_icon;

public Form1()
{
InitializeComponent();
Terrace.Image = TOFF;
LivingRoom.Image = LOFF;
Kitchen.Image = KOFF;
Workspace.Image = WOFF;
}
Inisialisasi awal gambar dimulai dari definisi nama gambar seperti TOFF, TON dan
sebagainya. Lalu kondisi awalnya dibuat dengan button grey atau tidak aktif seperti
Terrace.Image = TOFF; LivingRoom.Image = LOFF; Kitchen.Image = KOFF;
Workspace.Image = WOFF;
private void timer1_Tick(object sender, EventArgs e) {
if (serialPort1.IsOpen {
if (listBox1.Text.ToUpper() == "Terrace ON") {
Terrace.Image = TON;
}
if (listBox1.Text.ToUpper() == "LivingRoom ON")
{
LivingRoom.Image = LON;
}
Timer dibuat enabled, dan ketika serial port sudah tersambung lalu list box mulai terisi text
seperti pada perintah yang dihasilkan switch button, gambar akan diubah.
listBox1.Text.ToUpper() => Memperhatikan listbox1 text yang berada di paling atas atau
perintah terakhir. Lalu,
{Terrace.Image = TON;}
Merupakan perintah untuk mengubah gambar pada Terrace.Image ; Jika sebelumnya tadi
Image TOFF maka akibat perintah ini Terrace.Image menjadi Image TON.

Program Lengkap : Lampiran 2.1 Program Lengkap Tugas 2

 Novanna Rahma Zani - 1103181047

Lampiran 1.1 Program Lengkap Tugas 1

 Aplikasi Transmitter
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 GUI_Lab4
{
public partial class Form1 : Form
{
public Form1()
{
InitializeComponent();
}

private void Form1_Load(object sender, EventArgs e)

{
String[] portList = System.IO.Ports.SerialPort.GetPortNames();
foreach (String portName in portList)
comboBox1.Items.Add(portName);
}

private void rectangleShape1_Click(object sender, EventArgs e)

{

private void button1_Click(object sender, EventArgs e)

{
serialPort1.PortName = comboBox1.Text;
serialPort1.Open();
Form1.ActiveForm.Text = serialPort1.PortName + " is connected";
button1.Enabled = false;
}

private void button2_Click(object sender, EventArgs e)

{
serialPort1.Close();
Form1.ActiveForm.Text = "Serial Communication";
button2.Enabled = false;
button1.Enabled = true;
}

private void button3_Click(object sender, EventArgs e)

 Novanna Rahma Zani - 1103181047

{
}

private void serialPort1_DataReceived(object sender,

System.IO.Ports.SerialDataReceivedEventArgs e)
{
Tampilkan(serialPort1.ReadExisting());
}

private delegate void TampilkanDelegate(object item);

private void Tampilkan(object item)
{
if (InvokeRequired)
// This is a worker thread so delegate the task.
listBox1.Invoke(new TampilkanDelegate(Tampilkan), item);
else
// This is the UI thread so perform the task.
listBox1.Items.Add(item);
}

private void button4_Click(object sender, EventArgs e)

{
comboBox1.Items.Clear();
string[] myPort;
myPort = System.IO.Ports.SerialPort.GetPortNames();
comboBox1.Items.AddRange(myPort);
}

private void listBox2_SelectedIndexChanged(object sender, EventArgs e)

{

private void TextBox1_TextChanged(object sender, EventArgs e)

{

private void bunifuSwitch1_Click(object sender, EventArgs e)

{
if (serialPort1.IsOpen == true)
{
if (bunifuSwitch1.Value == true)
{
serialPort1.Write("Terrace ON" + "\n\r");
listBox1.Items.Add("Terrace Turn ON!");
}
else
{
serialPort1.Write("Terrace OFF" + "\n\r");
listBox1.Items.Add("Terrace Turn OFF!");
 Novanna Rahma Zani - 1103181047

}
}
else
MessageBox.Show("Koneksikan PORT!");
}

private void bunifuSwitch2_Click(object sender, EventArgs e)

{
if (serialPort1.IsOpen == true)
{
if (bunifuSwitch2.Value == true)
{
serialPort1.Write("LivingRoom ON" + "\n\r");
listBox1.Items.Add("Living Room Turn ON!");
}
else
{
serialPort1.Write("LivingRoom OFF" + "\n\r");
listBox1.Items.Add("Living Room Turn OFF!");
}
}
else
MessageBox.Show("Koneksikan PORT!");

private void bunifuSwitch3_Click(object sender, EventArgs e)

{
if (serialPort1.IsOpen == true)
{
if (bunifuSwitch3.Value == true)
{
serialPort1.Write("Kitchen ON" + "\n\r");
listBox1.Items.Add("Kitchen Turn ON!");
}
else
{
serialPort1.Write("Kitchen OFF" + "\n\r");
listBox1.Items.Add("Kitchen Turn OFF!");
}
}
else
MessageBox.Show("Koneksikan PORT!");
}

private void bunifuSwitch4_Click(object sender, EventArgs e)

{
if (serialPort1.IsOpen == true)
{
if (bunifuSwitch4.Value == true)
{
serialPort1.Write("Workspace ON" + "\n\r");
 Novanna Rahma Zani - 1103181047

listBox1.Items.Add("Workspace Turn ON!");

}
else
{
serialPort1.Write("Workspace OFF!" + "\n\r");
listBox1.Items.Add("Workspace Turn OFF!");
}
}
else
MessageBox.Show("Koneksikan PORT!");
}

private void listBox1_SelectedIndexChanged(object sender, EventArgs e)

{

}
}
}
 Aplikasi Receiver
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 GUI_Lab4
{
public partial class Form1 : Form
{
public Form1()
{
InitializeComponent();
Terrace.Image = TON;
LivingRoom.Image = LOFF;
Kitchen.Image = KON;
Workspace.Image = WOFF;
}

private void Form1_Load(object sender, EventArgs e)

{
String[] portList = System.IO.Ports.SerialPort.GetPortNames();
foreach (String portName in portList)
comboBox1.Items.Add(portName);

private void rectangleShape1_Click(object sender, EventArgs e)

{
 Novanna Rahma Zani - 1103181047

private void button1_Click(object sender, EventArgs e)

{
serialPort1.PortName = comboBox1.Text;
serialPort1.Open();
Form1.ActiveForm.Text = serialPort1.PortName + " is connected";
button1.Enabled = false;
}

private void button2_Click(object sender, EventArgs e)

{
serialPort1.Close();
Form1.ActiveForm.Text = "Serial Communication";
button2.Enabled = false;
button1.Enabled = true;
}

private void serialPort1_DataReceived(object sender,

System.IO.Ports.SerialDataReceivedEventArgs e)
{
Tampilkan(serialPort1.ReadExisting());
}

private delegate void TampilkanDelegate(object item);

private void Tampilkan(object item)
{
if (InvokeRequired)
// This is a worker thread so delegate the task.
listBox1.Invoke(new TampilkanDelegate(Tampilkan), item);
else
// This is the UI thread so perform the task.
listBox1.Items.Add(item);
}

private void button4_Click(object sender, EventArgs e)

{
comboBox1.Items.Clear();
string[] myPort;
myPort = System.IO.Ports.SerialPort.GetPortNames();
comboBox1.Items.AddRange(myPort);
}
}
}
}
 Novanna Rahma Zani - 1103181047

Lampiran 2.1 Program Lengkap Tugas 2

 Aplikasi Transmitter
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 GUI_Lab4
{
public partial class Form1 : Form
{
public Form1()
{
InitializeComponent();
}

private void Form1_Load(object sender, EventArgs e)

{
String[] portList = System.IO.Ports.SerialPort.GetPortNames();
foreach (String portName in portList)
comboBox1.Items.Add(portName);
}

private void rectangleShape1_Click(object sender, EventArgs e)

{

private void button1_Click(object sender, EventArgs e)

{
serialPort1.PortName = comboBox1.Text;
serialPort1.Open();
Form1.ActiveForm.Text = serialPort1.PortName + " is connected";
button1.Enabled = false;
}

private void button2_Click(object sender, EventArgs e)

{
serialPort1.Close();
Form1.ActiveForm.Text = "Serial Communication";
button2.Enabled = false;
button1.Enabled = true;
 Novanna Rahma Zani - 1103181047

private void button3_Click(object sender, EventArgs e)

{
}

private void serialPort1_DataReceived(object sender,

System.IO.Ports.SerialDataReceivedEventArgs e)
{
Tampilkan(serialPort1.ReadExisting());
}

private delegate void TampilkanDelegate(object item);

private void Tampilkan(object item)
{
if (InvokeRequired)
// This is a worker thread so delegate the task.
listBox1.Invoke(new TampilkanDelegate(Tampilkan), item);
else
// This is the UI thread so perform the task.
listBox1.Items.Add(item);
}

private void button4_Click(object sender, EventArgs e)

{
comboBox1.Items.Clear();
string[] myPort;
myPort = System.IO.Ports.SerialPort.GetPortNames();
comboBox1.Items.AddRange(myPort);
}

private void listBox2_SelectedIndexChanged(object sender, EventArgs e)

{

private void TextBox1_TextChanged(object sender, EventArgs e)

{

private void bunifuSwitch1_Click(object sender, EventArgs e)

{
if (serialPort1.IsOpen == true)
{
if (bunifuSwitch1.Value == true)
{
serialPort1.Write("Terrace ON" + "\n\r");
listBox1.Items.Add("Terrace Turn ON!");
}
else
 Novanna Rahma Zani - 1103181047

{
serialPort1.Write("Terrace OFF" + "\n\r");
listBox1.Items.Add("Terrace Turn OFF!");
}
}
else
MessageBox.Show("Koneksikan PORT!");
}

private void bunifuSwitch2_Click(object sender, EventArgs e)

{
if (serialPort1.IsOpen == true)
{
if (bunifuSwitch2.Value == true)
{
serialPort1.Write("LivingRoom ON" + "\n\r");
listBox1.Items.Add("Living Room Turn ON!");
}
else
{
serialPort1.Write("LivingRoom OFF" + "\n\r");
listBox1.Items.Add("Living Room Turn OFF!");
}
}
else
MessageBox.Show("Koneksikan PORT!");

private void bunifuSwitch3_Click(object sender, EventArgs e)

{
if (serialPort1.IsOpen == true)
{
if (bunifuSwitch3.Value == true)
{
serialPort1.Write("Kitchen ON" + "\n\r");
listBox1.Items.Add("Kitchen Turn ON!");
}
else
{
serialPort1.Write("Kitchen OFF" + "\n\r");
listBox1.Items.Add("Kitchen Turn OFF!");
}
}
else
MessageBox.Show("Koneksikan PORT!");
}

private void bunifuSwitch4_Click(object sender, EventArgs e)

{
if (serialPort1.IsOpen == true)
{
 Novanna Rahma Zani - 1103181047

if (bunifuSwitch4.Value == true)
{
serialPort1.Write("Workspace ON" + "\n\r");
listBox1.Items.Add("Workspace Turn ON!");
}
else
{
serialPort1.Write("Workspace OFF!" + "\n\r");
listBox1.Items.Add("Workspace Turn OFF!");
}
}
else
MessageBox.Show("Koneksikan PORT!");
}

private void listBox1_SelectedIndexChanged(object sender, EventArgs e)

{

}
}
}

 Aplikasi Receiver
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 GUI_Lab4
{
public partial class Form1 : Form
{
Image TOFF = Properties.Resources.Button_Blank_Gray_icon;
Image TON = Properties.Resources.Button_Blank_Green_icon;
Image LOFF = Properties.Resources.Button_Blank_Gray_icon;
Image LON = Properties.Resources.Button_Blank_Green_icon;
Image KOFF = Properties.Resources.Button_Blank_Gray_icon;
Image KON = Properties.Resources.Button_Blank_Green_icon;
Image WOFF = Properties.Resources.Button_Blank_Gray_icon;
Image WON = Properties.Resources.Button_Blank_Green_icon;

public Form1()
{
InitializeComponent();
Terrace.Image = TOFF;
LivingRoom.Image = LOFF;
Kitchen.Image = KOFF;
 Novanna Rahma Zani - 1103181047

Workspace.Image = WOFF;
}

private void Form1_Load(object sender, EventArgs e)

{
String[] portList = System.IO.Ports.SerialPort.GetPortNames();
foreach (String portName in portList)
comboBox1.Items.Add(portName);

private void button1_Click(object sender, EventArgs e)

{
serialPort1.PortName = comboBox1.Text;
serialPort1.Open();
Form1.ActiveForm.Text = serialPort1.PortName + " is connected";
button1.Enabled = false;
}

private void button2_Click(object sender, EventArgs e)

{
serialPort1.Close();
Form1.ActiveForm.Text = "Serial Communication";
button2.Enabled = false;
button1.Enabled = true;
}

private void serialPort1_DataReceived(object sender,

System.IO.Ports.SerialDataReceivedEventArgs e)
{
Tampilkan(serialPort1.ReadExisting());
}

private delegate void TampilkanDelegate(object item);

private void Tampilkan(object item)
{
if (InvokeRequired)
// This is a worker thread so delegate the task.
listBox1.Invoke(new TampilkanDelegate(Tampilkan), item);
else
// This is the UI thread so perform the task.
listBox1.Items.Add(item);
}

private void button4_Click(object sender, EventArgs e)

{
comboBox1.Items.Clear();
string[] myPort;
myPort = System.IO.Ports.SerialPort.GetPortNames();
comboBox1.Items.AddRange(myPort);
}
private void timer1_Tick(object sender, EventArgs e)
 Novanna Rahma Zani - 1103181047

{
if (serialPort1.IsOpen)
{
if (listBox1.Text.ToUpper() == "Terrace ON")
{
Terrace.Image = TON;
}

if (listBox1.Text.ToUpper() == "LivingRoom ON")

{
LivingRoom.Image = LON;
}

if (listBox1.Text.ToUpper() == "Kitchen ON")

{
Kitchen.Image = KON;
}

if (listBox1.Text.ToUpper() == "Workspace ON")

{
Workspace.Image = WON;
}

if (listBox1.Text.ToUpper() == "Terrace OFF")

{
Terrace.Image = TOFF;
}

if (listBox1.Text.ToUpper() == "LivingRoom OFF")

{
LivingRoom.Image = LOFF;
}

if (listBox1.Text.ToUpper() == "Kitchen OFF")

{
Kitchen.Image = KOFF;
}

if (listBox1.Text.ToUpper() == "Workspace OFF")

{
Workspace.Image = WOFF;
}
}
}
}
}