ads_header

Program Parkir Sederhana Menggunakan QR Code



Halo guys, tutorial kali ini membahas tentang cara membuat sebuah aplikasi parkir sederhana berbasis web dan android. Jadi, skenarionya adalah pengunjung masuk dan bertemu dengan petugas gerbang masuk, lalu petugas mencatat data kendaraan lalu memberikan struk dengan pola QR Code yang nantinya diberikan kepada petugas gerbang keluar untuk proses pemindaian.





Adapun bahasa pemrograman yang dipakai untuk aplikasi berbasis web adalah PHP dan aplikasi pemrograman android menggunakan java, yang keduanya terhubung dalam satu database yaitu MySQL. Selanjutnya kita buat database terlebih dahulu sebagai contoh saya membuat database dengan nama "barcode_park" dengan satu tabel dengan nama "parkir"



  • id_parkir (int : autoincreament)
  • KodeBarcode : varchar
  • Jenis : varchar
  • Merek : varchar
  • Warna : varchar
  • Plat : varchar
  • JamMasuk : DateTime
  • JamKeluar : DateTime
jika databasenya sudah siap, sekarang siapkan sebuah folder project didalam directory kamu. sebagai contoh saya disini saya beri nama "parkir" didalamnya terdapat 2 file utama yaitu aksi.php dan index.php selebihnya merupakan folder pendukung lainnya. 


Folder "temp" merupakan tempat menyimpan gambar QR Code setelah menyimpan data kendaraan yang masuk. Selanjutnya buka file index.php lalu masukkan kode berikut


<!DOCTYPE html>
<?php
function autonumber($tabel ,$kolom, $lebar=0, $awalan=''){

    $host = "localhost";
    $usr = "youruser";
    $pwd = "yourpasswrod";
    $dbname = "barcode_park";
    $koneksi = mysqli_connect($host, $usr, $pwd, $dbname);
    if(mysqli_connect_error()){
        echo 'database gagal dikoneksikan!'.mysqli_connect_error();
    }

    //proses auto number

    $auto = mysqli_query($koneksi, "select $kolom from $tabel order by $kolom desc limit 1") or die(mysqli_error());
    $jumlah_record = mysqli_num_rows($auto);
    if($jumlah_record == 0)
    $nomor = 1;

    else{
        $row = mysqli_fetch_array($auto);
        $nomor = intval(substr($row[0], strlen($awalan)))+1;
    }
    if($lebar>0)
        $angka = $awalan.str_pad ($nomor, $lebar, "0", STR_PAD_LEFT);
    else
        $angka=$awalan.$nomor;
    return $angka;
}
?>
    <html lang="en">

    <head>
        <title>Aplikasi Parkir</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <!--===============================================================================================-->
        <link rel="icon" type="image/png" href="images/icons/favicon.ico" />
        <!--===============================================================================================-->
        <link rel="stylesheet" type="text/css" href="vendor/bootstrap/css/bootstrap.min.css">
        <!--===============================================================================================-->
        <link rel="stylesheet" type="text/css" href="fonts/font-awesome-4.7.0/css/font-awesome.min.css">
        <!--===============================================================================================-->
        <link rel="stylesheet" type="text/css" href="vendor/animate/animate.css">
        <!--===============================================================================================-->
        <link rel="stylesheet" type="text/css" href="vendor/css-hamburgers/hamburgers.min.css">
        <!--===============================================================================================-->
        <link rel="stylesheet" type="text/css" href="vendor/select2/select2.min.css">
        <!--===============================================================================================-->
        <link rel="stylesheet" type="text/css" href="css/util.css">
        <link rel="stylesheet" type="text/css" href="css/main.css">
        <!--===============================================================================================-->


        <style>
            .page1 {
                width: 100%;
                height: 100%;
            }
            
            .page2 {
                width: 100%;
                height: 100%;
                position: relative;
                margin: 0;
                background: crimson;  /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #3498db, #2c3e50);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #3498db, #2c3e50); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

                font-family: sans-serif;
                font-weight: 100;
            }
            
            .container-contact1 {
                width: 800px;
                padding: 32px;
            }
            
            .form-control {
                display: block;
                width: 100%;
                padding: 0 30px;
                font-size: 15px;
                line-height: 1.25;
                color: #495057;
                background-color: #fff;
                background-image: none;
                background-clip: padding-box;
                border: 1px solid rgba(0, 0, 0, .15);
                border-radius: 25px;
                transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
                margin-bottom: 25px;
                font-family: Montserrat-Bold;
                height: 50px;
            }
            
            .page2.containerr {
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%, -50%);
            }
            
            .fixed_header {
                width: 85%;
                height: auto;
            }
            
            .fixed_header tbody {
                display: block;
                width: 100%;
                overflow: auto;
                height: 400px;
            }
            
            .fixed_header thead tr {
                display: block;
            }
            
            .fixed_header thead {
                background: black;
                color: #fff;
            }
            
            .fixed_header th,
            .fixed_header td {
                padding: 10x;
                text-align: left;
                width: 200px;
            }
            
            table {
                width: 75%;
                border-collapse: collapse;
                overflow: auto;
                table-layout: fixed;
                border-collapse: collapse;
                position: absolute;
                box-shadow: 0 0 20px rgba(0, 0, 0, 0.32);
                top: 55%;
                left: 50%;
                transform: translate(-50%, -50%);
            }
            
            th,
            td {
                padding: 15px;
                background-color: rgba(255, 255, 255, 0);
                color: #fff;
            }
            
            th {
                text-align: left;
            }
            
            thead {
                th {
                    background-color: #55608f;
                }
            }
            
            tbody {
                tr {
                    &:hover {
                        background-color: rgba(255, 255, 255, 0.3);
                    }
                }
                td {
                    position: relative;
                    &:hover {
                        &:before {
                            content: "";
                            position: absolute;
                            left: 0;
                            right: 0;
                            top: -9999px;
                            bottom: -9999px;
                            background-color: rgba(255, 255, 255, 0.2);
                            z-index: -1;
                        }
                    }
                }
            }
            
            .contact1-form-titlee {
                display: block;
                position: absolute;
                font-family: Montserrat-ExtraBold;
                font-size: 47px;
                color: #f5f5f5;
                line-height: 1.2;
                text-align: center;
                text-shadow: 2px 2px #000000b3;
                padding-bottom: 44px;
                top: 20%;
                left: 50%;
                transform: translate(-50%, -50%)
            }

            .contact1-form-titleee {
                display: block;
  font-family: Montserrat-ExtraBold;
  font-size: 30px;
  color: #f5f5f5;
  line-height: 1.2;
  text-shadow: 2px 2px #000000b3;
  text-align: center;
  padding-bottom: 44px;
            }
        </style>
    </head>

    <body>
        <div class="page1">
            <div class="contact1">
                <div class="container-contact1">
                    <div class="contact1-pic js-tilt" data-tilt>
                        <img src="images/com.png" alt="IMG">
                    </div>

                    <form class="contact1-form validate-form" method="POST" action="aksi.php">
                        <span class="contact1-form-titleee">
     Data Kendaraan
    </span>

                        <div class="wrap-input1 validate-input">
                            <input class="input1" type="text" name="KodeBarcode" placeholder="Kode Barcode" value="<?= autonumber(" parkir ", "KodeBarcode ", "4 ", "PARK-") ?> " readonly>
                            <span class="shadow-input1"></span>
                        </div>

                        <div class="wrap-input1 validate-input" data-validate="Valid email is required: ex@abc.xyz">
                            <input onkeyup="this.value = this.value.toUpperCase()"; class="input1" type="text" name="plat" placeholder="Nomor Polisi" required oninvalid="this.setCustomValidity('Plat Belum Diisi')" oninput="this.setCustomValidity('')">
                            <span class="shadow-input1"></span>
                        </div>

                        <div class="wrap-input1 validate-input" data-validate="Subject is required">
                            <input onkeyup="this.value = this.value.toUpperCase()"; class="input1" type="text" name="merek" placeholder="Merek" required oninvalid="this.setCustomValidity('Merek Belum Diisi')" oninput="this.setCustomValidity('')">
                            <span class="shadow-input1"></span>
                        </div>

                        <div class="wrap-input1 validate-input" data-validate="Subject is required">
                            <input onkeyup="this.value = this.value.toUpperCase()"; class="input1" type="text" name="warna" placeholder="Warna" required oninvalid="this.setCustomValidity('Warna Belum Diisi')" oninput="this.setCustomValidity('')">
                            <span class="shadow-input1"></span>
                        </div>

                        <select class="form-control" name="jenis">
                            <option value="MOBIL">MOBIL</option>
                            <option value="MOTOR">MOTOR</option>
                        </select>
                   

                        <div class="container-contact1-form-btn">
                            <input type="submit" class="contact1-form-btn" value="Simpan">
                        </div>
                    </form>
                </div>
            </div>
        </div>

        <div class="page2" id="dataParkir">
            <?php
                $koneksinya = mysqli_connect("localhost","youruser","yourpwd","Barcode_Park") or die(mysqli_error());
                $sqlnya = "SELECT * FROM parkir";
             $querynya = mysqli_query($koneksinya, $sqlnya);
            ?>
                <div class="containerr">
                    <span class="contact1-form-titlee" class="spannya">
     Data Parkir
    </span>
                    <table class="fixed_header">
                        <thead>
                            <tr>
                                <th>Kode Barcode</th>
                                <th>Jenis</th>
                                <th>Merek</th>
                                <th>Warna</th>
                                <th>Plat</th>
                                <th>Jam Masuk</th>
                                <th>Jam Keluar</th>
                            </tr>
                        </thead>
                        <tbody>
                            <?php
                       while($data = mysqli_fetch_array($querynya)){
                        ?>
                                <tr>

                                    <td>
                                        <?php echo $data['KodeBarcode']; ?>
                                    </td>
                                    <td>
                                        <?php echo $data['Jenis']; ?>
                                    </td>
                                    <td>
                                        <?php echo $data['Merek']; ?>
                                    </td>
                                    <td>
                                        <?php echo $data['Warna']; ?>
                                    </td>
                                    <td>
                                        <?php echo $data['Plat']; ?>
                                    </td>
                                    <td>
                                        <?php echo $data['JamMasuk']; ?>
                                    </td>
                                    <td>
                                        <?php echo $data['JamKeluar']; ?>
                                    </td>

                                </tr>
                                <?php
                    }
                    ?>
                        </tbody>
                    </table>
                </div>
        </div>

        <!--===============================================================================================-->
        <script type="text/javascript" async="" src="https://www.google-analytics.com/analytics.js"></script>
        <script src="vendor/jquery/jquery-3.2.1.min.js"></script>
        <!--===============================================================================================-->
        <script src="vendor/bootstrap/js/popper.js"></script>
        <script src="vendor/bootstrap/js/bootstrap.min.js"></script>
        <!--===============================================================================================-->
        <script src="vendor/select2/select2.min.js"></script>
        <!--===============================================================================================-->
        <script src="vendor/tilt/tilt.jquery.min.js"></script>
        <script>
            $('.js-tilt').tilt({
                scale: 1.1
            })
        </script>


        <script async src="https://www.googletagmanager.com/gtag/js?id=UA-23581568-13"></script>
        <script>
            window.dataLayer = window.dataLayer || [];

            function gtag() {
                dataLayer.push(arguments);
            }
            gtag('js', new Date());

            gtag('config', 'UA-23581568-13');
        </script>

        <!--===============================================================================================-->
        <script src="js/main.js"></script>

    </body>

    </html>





Selanjutnya, buka file aksi.php lalu masukkan kode berikut


<?php
//Ini untuk koneksi saja

$user_name = "youruser";
$password  = "yourpwd";
$database  = "barcode_park"; //Tulis sesuai dengan nama database yang digunakan
$host_name = "localhost";

$connect_db=mysql_connect($host_name, $user_name, $password);
$find_db=mysql_select_db($database);
//Akhir koneksi

//Pertama ambil data kiriman dari form
$kode = @$_POST['KodeBarcode'];
$jenis = @$_POST['jenis'];
$plat = @$_POST['plat'];
$warna = @$_POST['warna'];
$merek = @$_POST['merek'];


$sql_simpan = mysql_query ("INSERT into parkir (KodeBarcode, Jenis, Plat, Warna, Merek, JamMasuk) VALUES ('$kode', '$jenis', '$plat', '$warna', '$merek', now())");


include "phpqrcode/qrlib.php"; //<-- LOKASI FILE UTAMA PLUGINNYA

$tempdir = "temp/"; //<-- Nama Folder file QR Code kita nantinya akan disimpan
if (!file_exists($tempdir))#kalau folder belum ada, maka buat.
    mkdir($tempdir);

//lanjutan yang tadi

#parameter inputan
$isi_teks = "$kode";
$namafile = "$kode.png";
$quality = 'H'; //ada 4 pilihan, L (Low), M(Medium), Q(Good), H(High)
$ukuran = 10; //batasan 1 paling kecil, 10 paling besar
$padding = 2;

QRCode::png($isi_teks,$tempdir.$namafile,$quality,$ukuran,$padding);
?>

    <html lang="en">

    <head>
        <title>Contact V1</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <!--===============================================================================================-->
        <link rel="icon" type="image/png" href="images/icons/favicon.ico" />
        <!--===============================================================================================-->
        <link rel="stylesheet" type="text/css" href="vendor/bootstrap/css/bootstrap.min.css">
        <!--===============================================================================================-->
        <link rel="stylesheet" type="text/css" href="fonts/font-awesome-4.7.0/css/font-awesome.min.css">
        <!--===============================================================================================-->
        <link rel="stylesheet" type="text/css" href="vendor/animate/animate.css">
        <!--===============================================================================================-->
        <link rel="stylesheet" type="text/css" href="vendor/css-hamburgers/hamburgers.min.css">
        <!--===============================================================================================-->
        <link rel="stylesheet" type="text/css" href="vendor/select2/select2.min.css">
        <!--===============================================================================================-->
        <link rel="stylesheet" type="text/css" href="css/util.css">
        <link rel="stylesheet" type="text/css" href="css/main.css">
        <!--===============================================================================================-->

        <style>
            .container-contact1 {
                width: auto;
                border: 5px dotted #7a7777;
                background: #fff;
                border-radius: 15px;
                overflow: hidden;
                display: -webkit-box;
                display: -webkit-flex;
                display: -moz-box;
                display: -ms-flexbox;
                display: grid;
                flex-wrap: wrap;
                justify-content: space-between;
                align-content: center;
                padding: 20px;
            }

            .titlenya{
                color:#333333;
                font-size: 24px;
            }
        </style>
    </head>

    <body>

        <div class="contact1">
            <div class="container-contact1">

                <span class="contact1-form-title titlenya" style="padding-bottom: 20px;font-size:35px">
     <?php echo $kode ?>
    </span>

                <?php echo"<img src='temp/$kode.png' style='width:450px'>"; ?>
     <a href="index.php" class="contact1-form-btn" style="text-decoration:none;border-radius: 15px;">Kembali</a>    

            </div>
        </div>

        <!--===============================================================================================-->
        <script src="vendor/jquery/jquery-3.2.1.min.js"></script>
        <!--===============================================================================================-->
        <script src="vendor/bootstrap/js/popper.js"></script>
        <script src="vendor/bootstrap/js/bootstrap.min.js"></script>
        <!--===============================================================================================-->
        <script src="vendor/select2/select2.min.js"></script>
        <!--===============================================================================================-->
        <script src="vendor/tilt/tilt.jquery.min.js"></script>
        <script>
            $('.js-tilt').tilt({
                scale: 1.1
            })
        </script>

        <!-- Global site tag (gtag.js) - Google Analytics -->
        <script async src="https://www.googletagmanager.com/gtag/js?id=UA-23581568-13"></script>
        <script>
            window.dataLayer = window.dataLayer || [];

            function gtag() {
                dataLayer.push(arguments);
            }
            gtag('js', new Date());

            gtag('config', 'UA-23581568-13');
        </script>

        <!--===============================================================================================-->
        <script src="js/main.js"></script>

    </body>

    </html>

Setelah selesai, coba jalankan index.php melalui browser. tampilannya kurang lebih seperti pada gambar dibawah.


Untuk nomor parkir sifatnya otomatis, jadi setiap transaksi selesai, maka PARK-0001 akan berubah menjadi PARK-0002. seterusnya seperti itu. Setelah mengisi semuanya lalu menekan tombol Simpan maka akan pindah ke halaman selanjutnya untuk menampilkan QR Code.


QR Code ini kita asumsikan sebagai struk yang diberikan kepada pengunjung. Selanjutnya kita buat aplikasi berbasis android yang akan digunakan oleh petugas gerbang keluar untuk melakukan pemindaian pada QR Code yang didapatkan sebelumnya.





Setelah membuat project baru, buka bagian dependencies lalu tambahkan library yang dibutuhkan.


implementation 'com.journeyapps:zxing-android-embedded:3.4.0'
implementation 'com.google.zxing:core:3.2.1'
implementation files('libs/mysql-connector')

Pastikan kamu sudah menyimpan library mysql-connector kedalam folder libs (nama_project/app/libs) dan pastikan nama filenya sama.

selanjutnya buka activity_main.xml untuk mendesain layout aplikasi android, lalu masukkan kode berikut


<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/scr"
    android:focusable="true"
    android:focusableInTouchMode="true"
    android:fillViewport="true">

    <RelativeLayout
        android:layout_width="match_parent"
        android:id="@+id/frag1"
        android:background="#fff"
        android:layout_height="match_parent">

        <LinearLayout
            android:layout_width="match_parent"
            android:id="@+id/atass"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <LinearLayout
                android:id="@+id/collapsing_tool_bar_layout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content">

                <LinearLayout
                    android:id="@+id/atasnya"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:background="#123"
                    android:orientation="vertical"
                    android:padding="20dp">

                    <TextView
                        android:id="@+id/kodeBarcode"
                        android:drawableLeft="@drawable/ic_text_subject_grey600_24dp"
                        android:drawablePadding="10dp"
                        android:layout_marginBottom="10dp"
                        android:autoLink="email|web|map"
                        android:text=""
                        android:layout_width="match_parent"
                        android:textIsSelectable="true"
                        android:layout_height="wrap_content"
                        android:textColor="#f5f5f5"
                        android:textSize="17dp" />

                    <TextView
                        android:id="@+id/jenisKendara"
                        android:drawableLeft="@drawable/ic_text_subject_grey600_24dp"
                        android:drawablePadding="10dp"
                        android:layout_marginBottom="10dp"
                        android:autoLink="email|web|map"
                        android:text=""
                        android:layout_width="match_parent"
                        android:textIsSelectable="true"
                        android:layout_height="wrap_content"
                        android:textColor="#f5f5f5"
                        android:textSize="17dp" />

                    <TextView
                        android:id="@+id/merek"
                        android:drawableLeft="@drawable/ic_text_subject_grey600_24dp"
                        android:drawablePadding="10dp"
                        android:layout_marginBottom="10dp"
                        android:autoLink="email|web|map"
                        android:text=""
                        android:layout_width="match_parent"
                        android:textIsSelectable="true"
                        android:layout_height="wrap_content"
                        android:textColor="#f5f5f5"
                        android:textSize="17dp" />

                    <TextView
                        android:id="@+id/warna"
                        android:drawableLeft="@drawable/ic_text_subject_grey600_24dp"
                        android:drawablePadding="10dp"
                        android:layout_marginBottom="10dp"
                        android:autoLink="email|web|map"
                        android:text=""
                        android:layout_width="match_parent"
                        android:textIsSelectable="true"
                        android:layout_height="wrap_content"
                        android:textColor="#f5f5f5"
                        android:textSize="17dp" />

                    <TextView
                        android:id="@+id/plat"
                        android:drawableLeft="@drawable/ic_text_subject_grey600_24dp"
                        android:drawablePadding="10dp"
                        android:layout_marginBottom="10dp"
                        android:autoLink="email|web|map"
                        android:text=""
                        android:layout_width="match_parent"
                        android:textIsSelectable="true"
                        android:layout_height="wrap_content"
                        android:textColor="#f5f5f5"
                        android:textSize="17dp" />

                    <TextView
                        android:id="@+id/masuk"
                        android:drawableLeft="@drawable/ic_text_subject_grey600_24dp"
                        android:drawablePadding="10dp"
                        android:layout_marginBottom="10dp"
                        android:autoLink="email|web|map"
                        android:text=""
                        android:layout_width="match_parent"
                        android:textIsSelectable="true"
                        android:layout_height="wrap_content"
                        android:textColor="#f5f5f5"
                        android:textSize="17dp" />

                    <TextView
                        android:id="@+id/keluar"
                        android:drawableLeft="@drawable/ic_text_subject_grey600_24dp"
                        android:drawablePadding="10dp"
                        android:layout_marginBottom="10dp"
                        android:autoLink="email|web|map"
                        android:text=""
                        android:layout_width="match_parent"
                        android:textIsSelectable="true"
                        android:layout_height="wrap_content"
                        android:textColor="#f5f5f5"
                        android:textSize="17dp" />

                    <TextView
                        android:id="@+id/lama"
                        android:drawableLeft="@drawable/ic_text_subject_grey600_24dp"
                        android:drawablePadding="10dp"
                        android:layout_marginBottom="10dp"
                        android:autoLink="email|web|map"
                        android:text=""
                        android:layout_width="match_parent"
                        android:textIsSelectable="true"
                        android:layout_height="wrap_content"
                        android:textColor="#f5f5f5"
                        android:textSize="17dp" />
                </LinearLayout>
            </LinearLayout>

            <LinearLayout
                android:layout_width="match_parent"
                android:orientation="horizontal"
                android:background="@color/colorPrimary"
                android:layout_height="50dp">

                <Button
                    android:id="@+id/simpan"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:textColor="@color/colorAccent"
                    android:text="Clean All"/>

            </LinearLayout>

            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="350dp"
                android:id="@+id/anue"
                android:orientation="vertical">

                <ImageView
                    android:id="@+id/qrcode"
                    android:layout_width="match_parent"
                    android:layout_centerInParent="true"
                    android:layout_height="match_parent"
                    android:scaleType="fitXY" />
            </RelativeLayout>
        </LinearLayout>
    </RelativeLayout>
</ScrollView>

Tampilan dari kode diatas kurang lebih seperti ini gambar dibawah


Jika sudah selesai kita masuk pada MainActivity.java lalu masukkan kode berikut


import android.content.Intent;
import android.graphics.Bitmap;
import android.graphics.Color;
import android.media.AudioManager;
import android.media.ToneGenerator;
import android.os.AsyncTask;
import android.os.Build;
import android.os.Bundle;
import android.support.annotation.RequiresApi;
import android.support.design.widget.Snackbar;
import android.support.v7.app.AppCompatActivity;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.Button;
import android.widget.FrameLayout;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import android.widget.TextView;
import android.widget.Toast;
import com.google.zxing.BarcodeFormat;
import com.google.zxing.MultiFormatWriter;
import com.google.zxing.WriterException;
import com.google.zxing.common.BitMatrix;
import com.google.zxing.integration.android.IntentIntegrator;
import com.google.zxing.integration.android.IntentResult;
import com.journeyapps.barcodescanner.BarcodeEncoder;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.ResultSet;
import java.sql.ResultSetMetaData;
import java.sql.Statement;
import java.text.SimpleDateFormat;
import java.util.Calendar;
import java.util.Date;

public class MainActivity extends AppCompatActivity{

    String jenisnya,masuknya,keluarnya,platnya,mereknya,warnanya, lamaparkir;
    int totalbayar;
    private static final String url = "jdbc:mysql://192.168.43.93:3306/Barcode_Park";
    private static final String user = "youruser";
    private static final String pass = "yourpwd";

    TextView kodeBarcode,jenis_kendara,masuk,keluar,plat,merek,warna,lama;
    ImageView qrcode1;
    Button simpan;
    RelativeLayout rl;



    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.qrcode);
        getSupportActionBar().setTitle("Scan QR Code");
        rl = findViewById(R.id.anue);
        kodeBarcode = findViewById(R.id.kodeBarcode);
        masuk = findViewById(R.id.masuk);
        jenis_kendara = findViewById(R.id.jenisKendara);
        keluar = findViewById(R.id.keluar);
        plat = findViewById(R.id.plat);
        merek = findViewById(R.id.merek);
        warna = findViewById(R.id.warna);
        lama = findViewById(R.id.lama);

        qrcode1 = findViewById(R.id.qrcode);
        simpan = findViewById(R.id.simpan);

        simpan.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {

                    bersih();
            }
        });
    }

    void bersih(){
        kodeBarcode.setText("");
        jenis_kendara.setText("");
        masuk.setText("");
        keluar.setText("");
        plat.setText("");
        warna.setText("");
        merek.setText("");
        lama.setText("");
        qrcode1.setImageBitmap(null);
    }

    private class ConnectMySql extends AsyncTask<String, Void, String> {
        String res = "";

        @Override
        protected void onPreExecute() {
            super.onPreExecute();
//            Toast.makeText(ScanBarcode.this, "Please wait...", Toast.LENGTH_SHORT)
//                    .show();

        }

        @RequiresApi(api = Build.VERSION_CODES.M)
        @Override
        protected String doInBackground(String... params) {
            try {
                Calendar c1 = Calendar.getInstance();
                SimpleDateFormat sdf1 = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
                lamaparkir = sdf1.format(c1.getTime());
                Class.forName("com.mysql.jdbc.Driver");
                Connection con = DriverManager.getConnection(url, user, pass);
                //System.out.println("Databaseection success");
                Statement st = con.createStatement();

                st.executeUpdate("update parkir set JamKeluar = '"+ lamaparkir + "' where KodeBarcode = '" +kodeBarcode.getText().toString().trim()+ "'");
                ResultSet rs = st.executeQuery("select * from parkir where KodeBarcode ="+ "'"+kodeBarcode.getText().toString().trim()+"'");
                ResultSetMetaData rsmd = rs.getMetaData();

                if (rs.next()) {

                    jenisnya = rs.getString(3).toString();
                    mereknya = rs.getString(4).toString();
                    warnanya = rs.getString(5).toString();
                    platnya = rs.getString(6).toString();
                    masuknya = rs.getString(7).toString();
                    keluarnya = rs.getString(8).toString();
                    Snackbar snackbar = Snackbar
                            .make(getCurrentFocus(), "QR Code Terdeteksi", Snackbar.LENGTH_LONG);
                    View sbView = snackbar.getView();
                    sbView.setBackgroundColor(getColor(R.color.colorPrimaryDark));
                    TextView textView = sbView.findViewById(android.support.design.R.id.snackbar_text);
                    textView.setTextColor(Color.WHITE);
                    snackbar.show();
                    ToneGenerator toneGen1 = new ToneGenerator(AudioManager.STREAM_ALARM, 100);
                    toneGen1.startTone(ToneGenerator.TONE_PROP_BEEP,150);

                }
                else{
                    jenisnya= "";
                    mereknya="";
                    warnanya="";
                    platnya="";
                    masuknya="";
                    keluarnya="";
                    Snackbar snackbar = Snackbar
                            .make(getCurrentFocus(), "QR Code Tidak Terdeteksi", Snackbar.LENGTH_LONG);
                    View sbView = snackbar.getView();
                    sbView.setBackgroundColor(getColor(R.color.merah));
                    TextView textView = sbView.findViewById(android.support.design.R.id.snackbar_text);
                    textView.setTextColor(Color.WHITE);
                    snackbar.show();
                    ToneGenerator toneGen1 = new ToneGenerator(AudioManager.STREAM_ALARM, 100);
                    toneGen1.startTone(ToneGenerator.TONE_SUP_ERROR,150);

                }
            } catch (Exception e) {
                e.printStackTrace();
                res = e.toString();
            }
            return res;
        }

        @Override
        protected void onPostExecute(String result) {


            try {
//                NumberFormat formatter = new DecimalFormat("#,##0");
                Calendar c1 = Calendar.getInstance();
                SimpleDateFormat sdf1 = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
               lamaparkir = sdf1.format(c1.getTime());

                SimpleDateFormat format = new SimpleDateFormat("MM/dd/yyyy HH:mm:ss");
                jenis_kendara.setText(jenisnya);
                merek.setText(mereknya);
                warna.setText(warnanya);
                plat.setText(platnya);
                masuk.setText(masuknya);
                keluar.setText(keluarnya);

                Date d1 = format.parse(masuknya.replace("-", "/"));
                Date d2 = format.parse(lamaparkir.replace("-", "/"));

                long diff = d2.getTime() - d1.getTime();

                long diffSeconds = diff / 1000 % 60;
                long diffMinutes = diff / (60 * 1000) % 60;
                long diffHours = diff / (60 * 60 * 1000) % 24;
                long diffDays = diff / (24 * 60 * 60 * 1000);
                lama.setText(String.valueOf(diffHours + " Jam " +diffMinutes+" Menit "+diffSeconds+" Detik"));

            } catch (Exception e) {
                e.printStackTrace();
            }

        }
    }
    @Override
    protected void onActivityResult(int requestCode, int resultCode, Intent data){
        IntentResult result = IntentIntegrator.parseActivityResult(requestCode,resultCode,data);
        if (result != null){
            if (result.getContents() == null){
                Toast.makeText(this,"Barcode Tidak Ada", Toast.LENGTH_SHORT).show();
                qrcode1.setImageBitmap(null);
            }
            else{
               kodeBarcode.setText(result.getContents());
                MultiFormatWriter multiFormatWriter = new MultiFormatWriter();
                    try {
                        rl.requestLayout();
                        qrcode1.requestLayout();
                        rl.getLayoutParams().width = FrameLayout.LayoutParams.MATCH_PARENT;
                        rl.getLayoutParams().height = rl.getWidth();
                        qrcode1.getLayoutParams().width = rl.getWidth();
                        qrcode1.getLayoutParams().height = rl.getWidth();
                        BitMatrix bitMatrix = multiFormatWriter.encode(kodeBarcode.getText().toString(), BarcodeFormat.valueOf(result.getFormatName()), 1000,1000);
                        BarcodeEncoder barcodeEncoder = new BarcodeEncoder();
                        Bitmap bitmap = barcodeEncoder.createBitmap(bitMatrix);
                        qrcode1.setImageBitmap(bitmap);
                    } catch (WriterException e) {
                        Toast.makeText(ScanBarcode.this, e.toString(), Toast.LENGTH_SHORT).show();
                    }

                    try{
                        ConnectMySql connectMySql = new ConnectMySql();
                        connectMySql.execute("");


                    }catch (Exception e){
                        Toast.makeText(ScanBarcode.this, e.toString(), Toast.LENGTH_SHORT).show();
                    }

            }
        }
        else{
            super.onActivityResult(requestCode, resultCode, data);
        }
    }


    public void scanow(){
        IntentIntegrator integrator = new IntentIntegrator(this);
        integrator.setCaptureActivity(Portrait.class);
        integrator.setOrientationLocked(false);
        integrator.setDesiredBarcodeFormats(IntentIntegrator.ALL_CODE_TYPES);
        integrator.setBeepEnabled(false);
        integrator.setPrompt("Scan QR Code");
        integrator.initiateScan();
        bersih();
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.menu_scan, menu);
        return true;
    }
    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        int id = item.getItemId();
        if (id == R.id.scan){
            scanow();
        }
        return super.onOptionsItemSelected(item);
    }
}

Jika sudah selesai, kamu perlu memperhatikan potongan kode berikut


private static final String url = "jdbc:mysql://192.168.43.93:3306/Barcode_Park";

Pastikan kamu sudah menghubungkan laptop atau PC kamu dengan hotspot smartphone yang digunakan untuk menjalankan aplikasi berbasis android, lalu masukkan lalu ganti ip address diatas.





Setelah itu, buka folder menu pada project android kalian lalu ubah file menu.xml didalamnya dengan kode berikut


<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    tools:context=".MainActivity">

    <item android:id="@+id/scan"
        android:title="Scan Now"
        android:icon="@drawable/ic_barcode_scan_white_24dp"
        android:orderInCategory="100"
        app:showAsAction="always" />
</menu>

Sampai disini program masih belum dapat dijalankan karena masih ada 1 class lagi yang belum dibuat yaitu Portrait.java class ini berfungsi untuk mengatur pengambilan gambar secara portrait, sekarang buat class Portrait lalu masukkan kode berikut


import com.journeyapps.barcodescanner.CaptureActivity;

public class Portrait extends CaptureActivity {

}

Jika sudah selesai, jangan lupa menambahkan activity class portrait kedalam manifest.xml kemudian tambahkan permisi untuk menggunakan kamera dan jaringan internet


<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.CAMERA"/>

Selanjutnya, jalankan programnya
Untuk lebih jelasnya kamu dapat mengunduh source code disini
Powered by Blogger.