Menyimpan Gambar ke Database MySQL Kodular

Sebelumnya sudah pernah dibahas bagaimana menyimpan data ke database MySQL, namun data yang disimpan masih berupa text saja. Nah pada tutorial kali ini akan membuat aplikasi yang dapat menyimpan gambar ke database MySQL Kodular, dengan tambahan komponen dynamic image untuk menampilkan gambarnya secara dinamis.

Menyimpan Gambar ke Database MySQL Kodular
Menyimpan Gambar ke Database MySQL Kodular

Ketika sedang membuat sebuah aplikasi di Kodular, sering kali kita merasa khawatir jika project yang dibuat tidak dapat dibangun menjadi sebuah aplikasi. Karena Kodular sendiri membatasi ukuran project aplikasi yang dibuat pengguna dengan batasan sebesar 20MB saja.

Jika project aplikasi yang kamu buat memuat banyak gambar ataupun data-data lainnya pada asset aplikasi tentunya akan membuat ukuran project menjadi semakin besar, dengan kata lain kamu harus menyimpan beberapa file baik gambar, musik, video ataupun lainnya ke database agar ukuran project aplikasi yang dibuat tidak terlalu besar.

Ada banyak database yang bisa kamu gunakan untuk menyimpan gambar, namun yang paling umum yaitu menggunakan database firebase dan MySQL. Menyimpan gambar ke database firebase sudah saya bahas sebelumnya, kali ini saya akan menggunakan database MySQL untuk menyimpan data text dan gambar.

Cara Upload Image atau Menyimpan Gambar ke Database MySQL Kodular

Buat database

Pertama-tama membuat databasenya terlebih dahulu, saya menggunakan 000webhost untuk membuat database MySQL. Setelah membuat nama database dilanjut dengan membuat tabel dengan nama tabel “datagb” dan struktur tabel yang dibuat seperti di bawah ini.

struktur tabel di database
Struktur tabel datagb

pada tabel yang saya buat, saya memuat kolom “id” dan “data” dimana pada kolom id saya buat dengan bentuk “auto increment” sehingga id dapat terisi secara otomatis dan pada kolom data saya buat dalam bentuk type text.

Setelah membuat database dan tabel selanjutnya adalah

Upload file php ke hosting

Agar aplikasi yang dibuat dapat menyimpan gambar ke dabatase MySQL diperlukan file php yang berfungsi untuk menghubungkan aplikasi dengan database MySQL. Untuk file php nya dapat kamu dapatkan disini. Jangan lupa untuk merubah nama database dan juga password serta user database pada file koneksi, kemudian upload file php ke hosting.

Simpan file php ke hosting
Simpan file php ke hosting

Upload semua file php termasuk juga file gb.zip ke hosting, jangan lupa untuk mengekstrak file gb.zip di hosting agar nanti terbaca oleh sistem di hosting. Pada file gb.zip didalamnya sudah terdapat file php satu paket lengkap yang berfungsi untuk mengirim gambar ke database MySQL. Setelah upload file php ke hosting selesai langkah selanjutnya adalah

Desain aplikasi

Login ke Kodular untuk dapat melanjutkan proses desain aplikasi, pada desain kali ini saya membuat 2 screen. Screen1 untuk menginput gambar dan Screen2 untuk menampilkan gambar. Berikut di bawah ini adalah desain sederhana yang saya buat.

Desain aplikasi yang dibuat Kodular
Desain aplikasi yang dibuat

untuk menampilkan gambar secara dinamis disini saya menggunakan komponen dynamic image pada screen2, adapun komponen penting yang harus dimasukkan yaitu komponen web yang berguna untuk menghubungkan aplikasi dengan file php di hosting dan melanjutkannya ke database.

Apabila proses pembuatan desain telah selesai dilakukan maka tahap selanjutnya yaitu membuat blok program aplikasi.

Kode program aplikasi menyimpan gambar ke database MySQL Kodular

Dalam proses menyimpan gambar ke database MySQL menggunakan Kodular ini diperlukan perintah agar proses menyimpan gambar ke database MySQL dapat berjalan dengan baik pada aplikasi. Berikut di bawah ini adalah kode program pada aplikasi.

kode awalan dan upload

kode di bawah ini berada pada screen1 yang terdapat program awalan ketika aplikasi berjalan, program awalan ini yaitu program yang harus pertama kali di jalankan pada aplikasi, seperti pada kode dibawah ini ketika aplikasi berjalan aplikasi harus megambil data dari database dan kemudian nanti datanya akan ditampilkan di listview.

kode awalan dan upload gambar ke Mysql database Kodular
kode awalan dan upload gambar

kode menampilkan data ke listview dan kirim value ke screen2

kode menampilkan data ke listview dan kirim value ke screen2 Kodular
kode menampilkan data ke listview dan kirim value ke screen2

Kode program diatas masih berada pada screen1, dimana pada kode ini akan menampilkan data yang sudah didapat dari database ke dalam bentuk listview agar terlihat lebih rapi dan bagus. Selain itu juga ketika data pada listview di klik maka kode program pada listview akan mengirim data gambar ke screen2 untuk menampilkan gambarnya di screen2.

Kode program menampilkan gambar dari database MySQL Kodular

Kode program dibawah ini berada pada screen2, data yang sudah didapat dari database MySQL yang sudah dikirim dari screen1 kemudian akan ditampilkan ke komponen dynamic image untuk memvisualisasikan gambar yang didapat dari database.

kode menampilkan gambar dari database MySQL Kodular
kode menampilkan gambar dari database MySQL Kodular

Build project aplikasi yang dibuat

Setelah proses pembuatan kode blok program selesai maka selanjutnya yaitu menguji aplikasi atau merubahnya dalam bentuk format apk. Berikut dibawah ini adalah dokumentasi dari aplikasi yang dibuat.

Dokumentasi aplikasi

Oke mungkin hanya ini saja tutorial kali ini semoga bermanfaat dan juga jika ada yang tidak dimengerti dapat menuliskan komentar dibawah ini. Sekian terima kasih..

8 comments

    1. tinggal buat kolom baru lagi di tabel yang ada di database yang isinya kriteria dari gambar yang disimpan di database. Lalu tinggal di edit di pemanggilan datanya di baca.php, edit bagian query sql nya menjadi SELECT * FROM namatabel WHERE kriteria=”….”;

      mungkin bagusnya mas belajar fundamentalnya terlebih dahulu untuk sql. Supaya tidak kesulitan.

      1. Yang saya tidak paham susunan Bloknya di kodular.
        umpanya di Screen2, bagian judul diisi kriteria kemudian tambah 1 button untuk proses pencariannya.

        kira2 gimana susunan bloknya. Mohon penjelasannya

        1. Permasalahan yang kamu tanyakan ini cukup kompleks, untuk susunan blok pencarian, kamu bisa cari tutorialnya di youtube atau saya juga pernah buat tutorial Menyimpan data ke google spredsheet kodular yang didalamnya ada proses pencarian data berdasarkan id.

          pada postingan ini, saya hanya memberikan contoh sederhana saja, selebihnya kamu bisa cari atau mengembangkan sendiri dan melihat referensi lainnya di internet.

  1. hallo, kak, saya lg coba praktekin yg kakak buat, tp saya ada kendala, kenapa data judul yg diketik di text box itu gak masuk ke database nya ya?

  2. salam kenal om
    tutorialnya bagus, saya belajar dari om jadi mudah.
    maaf, kalo boleh, apakah om berkenan bagi file aia nya, maklum saya masih kurang faham beberapa penempatan disgn nya.
    trimakasih

Leave a Reply

Your email address will not be published. Required fields are marked *