Lompat ke konten Lompat ke sidebar Lompat ke footer

Membuat Aplikasi Menampilkan Gambar pada ImageView dari Galeri atau Kamera


Assalamualaikum Warahmatullahi Wabarakatuh.

Saat kita menggunakan sebuah aplikasi, pastinya kalian sudah tidak asing lagi dengan aplikasi yang mempunyai fitur untuk menampilkan gambar/image dengan mengakses galeri atau camera untuk mendapatkan gambar tersebut, biasanya digunakan untuk mengubah foto profil.


Agar user dapat mengakses galeri atau kamera ponsel, dan menampilkannya pada ImageView, kita akan belajar menggunakan Library bernama EasyImage, library tersebut dapat kita gunakan untuk membuka Image/Gambar Dari Kamera atau Gallery.

Sebenarnya kita bisa menggunakan cara manual untuk membuat program seperti ini, tetapi dengan menggunakan Library, kita dapat membuatnya dengan mudah, dibandingkan dengan menggunakan cara manual.

Materi lainnya yang direkomendasikan:

Membuat Aplikasi Menampilkan Gambar pada ImageView dari Galeri atau Kamera

1) Buka aplikasi Android Studio kalian, Buat Project Baru.

2) Pertama kita tambahkan kedua libaray berikut ini, pada build.gradle (direktori app).
compile 'com.github.jkwiecien:EasyImage:1.3.1'
compile 'com.github.bumptech.glide:glide:3.7.0'
EasyImage digunakan untuk mengambil gambar dari kamera atau galeri, dan glide unutk meload/memuat gambar/image agar tidak berat.

3) Selanjutya buka file build.gradle (direktori (nama project)), masukan baris kode berikut ini.
allprojects {
repositories {
google()
jcenter()
maven { url 'https://jitpack.io' } //Baris kode yang harus ditambahkan
}
}
Jika sudah, lalu klik Sync Now.

4) Agar aplikasi dapat mengakses file gambar/image dari memori external kalian, disini kita perlu manambahkan permission berikut ini didalam file AndroidManifest.xml.
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
5) Selanjutnya kita akan mengedit layout pada activity_main.xml, disini kita menggunakan LinearLayout (Vartical) sebagai containernya, seta Button dan ImageView sebagai komponennya.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="8dp"
android:background="#FFF5F5F5"
android:orientation="vertical"
tools:context="android.cianjur.developer.net.basicandroid.MainActivity">

<Button
android:id="@+id/open_image"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Open Image" />

<ImageView
android:id="@+id/showImg"
android:layout_width="match_parent"
android:layout_height="match_parent" />

</LinearLayout>
6) Selanjutnya buka file MainActivity.java, masukan source code barikut ini:
package android.cianjur.developer.net.basicandroid;

/*
Dibuat Oleh WILDAN M ATHOILLAH
*/

import android.content.DialogInterface;
import android.content.Intent;
import android.support.v7.app.AlertDialog;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;

import com.bumptech.glide.Glide;
import com.bumptech.glide.load.engine.DiskCacheStrategy;

import java.io.File;

import pl.aprilapps.easyphotopicker.EasyImage;

public class MainActivity extends AppCompatActivity{

private ImageView setImage;
private Button OpenImage;

//Request Code Digunakan Untuk Menentukan Permintaan dari User
public static final int REQUEST_CODE_CAMERA = 001;
public static final int REQUEST_CODE_GALLERY = 002;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
setImage = findViewById(R.id.showImg);
OpenImage = findViewById(R.id.open_image);
OpenImage.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
setRequestImage();
}
});
}

//Method Ini Digunakan Untuk Membuka Image dari Galeri atau Kamera
private void setRequestImage(){
CharSequence[] item = {"Kamera", "Galeri"};
AlertDialog.Builder request = new AlertDialog.Builder(this)
.setTitle("Add Image")
.setItems(item, new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialogInterface, int i) {
switch (i){
case 0:
//Membuka Kamera Untuk Mengambil Gambar
EasyImage.openCamera(MainActivity.this, REQUEST_CODE_CAMERA);
break;
case 1:
//Membuaka Galeri Untuk Mengambil Gambar
EasyImage.openGallery(MainActivity.this, REQUEST_CODE_GALLERY);
break;
}
}
});
request.create();
request.show();
}

//Method Ini Digunakan Untuk Menapatkan Hasil pada Activity, dari Proses Yang kita buat sebelumnya
//Dan Mendapatkan Hasil File Photo dari Galeri atau Kamera
@Override
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
super.onActivityResult(requestCode, resultCode, data);
EasyImage.handleActivityResult(requestCode, resultCode, data, this, new EasyImage.Callbacks() {

@Override
public void onImagePickerError(Exception e, EasyImage.ImageSource source, int type) {
//Method Ini Digunakan Untuk Menghandle Error pada Image
}

@Override
public void onImagePicked(File imageFile, EasyImage.ImageSource source, int type) {
//Method Ini Digunakan Untuk Menghandle Image
switch (type){
case REQUEST_CODE_CAMERA:
Glide.with(MainActivity.this)
.load(imageFile)
.centerCrop()
.diskCacheStrategy(DiskCacheStrategy.ALL)
.into(setImage);
break;

case REQUEST_CODE_GALLERY:
Glide.with(MainActivity.this)
.load(imageFile)
.centerCrop()
.diskCacheStrategy(DiskCacheStrategy.ALL)
.into(setImage);
break;
}
}

@Override
public void onCanceled(EasyImage.ImageSource source, int type) {
//Batalkan penanganan, Anda mungkin ingin menghapus foto yang diambil jika dibatalkan
}
});
}
}
Penjelasan:

Pada source code tersebut, kita membuat REQUEST_CODE, yang diguakan untuk menentukan pilian dari user, apakah galeri atau kamera.

Didalam method setRequestImage(), kita menggunakan AlertDialog, untuk menampilkan notifikasi pada user, berupa pilihan untuk mengambil gambar.

Dengan menggunakan fungsi EasyImage.openCamera () dan EasyImage.openGallery () digunakan untuk memilih metode Mengambil gambar dari kamera dan Galeri. Kedua fungsi tersebut membutuhkan 2 parameter, yaitu Konteks Activity dan RequestCode.

Lalu pada method onActivityResult(), method ini Digunakan untuk mendapakan hasil berupa file Photo yang didapatkan dari Galeri atau Kamera, pada method onImagePicked() digunakan untuk menghandle atau mengangani permintaan dari user, mengenai pemuatan gambar, yang ingin ditampilkan pada ImageView.

Demo:



Terimakasih atas kunjungannya, semoga tutorial yang saya berikan bisa bermanfaat untuk kalian semua, selebihnya, mohon maaf bila ada kesalahan.

Wassalamualaikum Warahmatullahi Wabarakatuh.

Posting Komentar untuk "Membuat Aplikasi Menampilkan Gambar pada ImageView dari Galeri atau Kamera"