Cara Upload Gambar dari Kamera ke Cloudinary dengan Kodular - Tutorial Blok Programming versi DwiAY

Read Time:4 Minute, 8 Second

Artikel kali ini membahas tentang tutorial dalam melakukan upload gambar atau dihasilkan dari tangkapan kamera. Untuk tutorial kali ini, penulis tidak menggunakan blok program Cloudinary bawaan dari Kodular karena memungkinkan belum ada update tentang blok tersebut dari pihak Kodular sejak ada perubahan target Android SDK menjadi versi 33 (Android 13).

Seperti yang diketahui, Permission READ_EXTERNAL_STORAGE ini akan diperketat di Android 13 atau keatas dengan dibuatkan menjadi 3 jenis permission yang berhubungan dengan media yaitu:

READ_MEDIA_IMAGES >>> Memberikan permisi untuk akses internal storage yang dikhususkan untuk image atau gambar.
READ_MEDIA_AUDIO >>> Memberikan permisi untuk akses internal storage yang dikhususkan untuk audio atau suara.
REAS_MEDIA_VIDEO >>> Memberikan permisi untuk akses internal storage yang dikhususkan untuk video.

Kamu membutuhkan extension dari pihak ketiga untuk upload gambar atau foto yang dihasilkan dari tangkapan kamera ke Cloudinary yang dikembangkan oleh Sunny. Extension ini juga berlaku untuk App Inventor, Niotron, dsb. Selain itu, extension memiliki fitur blok program lebih banyak dari blok program bawaan Kodular.

DAPATKAN EXTENSION SUNNY CLOUDINARY

Untuk kali ini, penulis memberikan link unduh extension Cloudinary yang dikembangkan oleh Sunny untuk upload gambar ke Cloudinary.

>>> GET LINK IN HERE <<<

Setelah kamu mengunduh extension tersebut diatas, maka kamu bisa melakukan untuk tambahkan extension tersebut ke dalam project aplikasi Android kamu di Kodular.

PARAMETER UPLOAD CLOUDINARY

Penulis memberikan beberapa parameter untuk sebelum diproses upload gambar ke Cloudinary seperti memberikan nama file secara custom, mendapatkan link URL, dan sebagainya dengan sebagai berikut:

NAMA PARAMETER	FUNGSI	VALUE
folder	Memberikan tempat folder atau direktori yang akan ditampung pada saat upload file media.	STRING isikan nama folder yang ada di Cloudinary kamu.
use_filename	Memberikan nama file yang berdasarkan nama file yang diperoleh dari tangkapan kamera.	BOOLEAN true = menggunakan nama file berdasarkan tangkapan kamera + kode unik. false = menggunakan nama file secara random.
public_id	Memberikan nama file secara custom untuk upload gambar ke Kodular	STRING isikan nama file dengan sesuai kebutuhan.

Penulis memberikan update dari fungsi parameter ini jika sudah menemukan jawabannya.

Sumber Link Asli tentang Parameter dari Cloudinary untuk mengatur atau konfigurasi dalam proses upload file media di bawah ini:

https://cloudinary.com/documentation/image_upload_api_reference

CARA MENGGUNAKAN PARAMETER CLOUDINARY

Kamu bisa menambahkan blok program Dictionary ke dalam blok program Cloudinary Upload yang parameter uploadOptions() yang terdapat di bawah ini:

Untuk implementasinya, kamu bisa melihat blok program secara keseluruhan yang terdapat di bawah ini:

Penulis memberikan tutorial dalam melakukan upload gambar yang ditangkap dari Kamera ke dalam Cloudinary pada Kodular.

LANGKAH-LANGKAH

1. Kunjungi situs App Creator Kodular.

2. Lakukan login seperti biasanya.

3. Klik Create project untuk membuat project baru.

4. Masukkan nama project dengan sesuai keinginan kamu, klik Next.

5. Aturlah tampilan Theme, UI, nama aplikasi, beserta nama paket Android dengan sesuai keinginan kamu, klik Finish.

6. Klik Pallete Extension >>> Klik Import extension.

7. Klik NO FILE CHOSEN untuk memasukkan extension “com.sunny.Cloudinary.aix” ke dalam project aplikasi.

8. Pilihlah extension “com.sunny.Cloudinary.aix” dari hasil unduhan tadi, klik OK / Open.

9. Klik IMPORT FROM FILE.

10. Rancanglah tampilan aplikasi yang terdapat pada gambar di bawah ini.

11. Masukkan API KEY, Cloud Name, SECRET KEY yang ada di extension Cloudinary.

Untuk pemberian kode tersebut bisa didapatkan di dashbaord Cloudinary pada akun kamu.

12. Klik Blocks.

13. Buatlah blok program untuk membuka kamera.

14. Buatlah blok program untuk melihat gambar dari hasil tangkapan kamera ke Image View.

15. Buatlah blok program untuk upload gambar tersebut ke Cloudinary.

16. Buatlah blok program setelah diproses upload gambar ke Cloudinary dengan sukses.

17. Buatlah blok program setelah diproses upload gambar ke Cloudinary tetapi gagal / error.

18. Lakukan ujicoba project tutorial tersebut baik itu pakai Companion maupun Install APK langsung (Export APK).

TAMPILAN HASIL AKHIR

1. Tampilan awal.

2. Tampilan setelah difoto dengan kamera.

3. Masukkan nama file gambar untuk menguji parameter Cloudinary yakni public_id sehingga setelah upload gambar tersebut ke Cloudinary menggunakan nama yang telah dikirimkan dari aplikasi.

4. Proses upload gambar ke Cloudinary.

5. Tampilan hasil upload gambar ke Cloudinary.

6. Tampilan Hasil upload gambar di Media Library pada Cloudinary.

Selesai.

Jadi, kamu bisa membuat aplikasi Android sendiri dengan Kodular untuk menambahkan fitur untuk upload gambar yang dihasilkan dari tangkapan kamera ke dalam project bucket Cloudinary. Ini asli tanpa coding atau sistem backend sama sekali.

GET BUY SOURCE CODE AIA???

BUY SOURCE CODE AIA via Trakteer.id

PENUTUP

Tutorial ini berlaku untuk semua versi Android yang kamu pakai saat ini dalam membuat fitur untuk upload gambar yang dihasilkan dari tangkapan kamera ke Cloudinary dengan Kodular. Memang, membuat fitur membutuhkan extension tambahan untuk upload gambar ke Cloudinary yang disebabkan extension Cloudinary bawaan Kodular tidak bisa digunakan untuk khusus Android 13 atau keatas.

Extension Cloudinary bawaan Kodular tidak bisa digunakan untuk khusus Android 13 atau keatas karena permission READ_EXTERNAL_STORAGE tidak berlaku lagi di Android 13 atau keatas. Selain itu, extension Cloudinary bawaan Kodular kemungkinan belum melakukan update sama sekali sejak ada update Target Android SDK versi 33.