Cara Membuat Widget ImageView pada Android Studio

Cara Membuat Widget ImageView pada Android Studio


Assalamualaikum Warahmatullahi Wabarakatuh.

ImageView adalah salah satu widget yang digunakan untuk menampilkan sebuah gambar baik itu format .jpg ataupun .png. Dengan menggunakan ImageView, kita dapat menampilkan Gambar pada Activity atau Halaman aplikasi yang kalia buat.

Cara Membuat Widget ImageView pada Android Studio

Pada tutorial dasar kali ini, kita akan belajar cara membuat serta menggunakan imageView pada Aplikasi, Penjelasan lebih lanjutnya akan dijelaskan pada Tutorial berikut ini.

Materi Lainnya Yang Direkomendasikan:
Membuat Widget ImageView pada Android Studio

Buat Project baru pada Android Studio kalian.

Disarankan kalian sudah menyiapkan gambar (.jpg atau .png) yang ingin kita tampilkan pada ImageView, jika sudah, simpan gambar tersebut pada direktori drawable (app > src > main > res).

Kita tidak boleh menggunakan spasi untuk penamaan gambar yang ingin ditampilkan pada ImageView, kalian bisa mengganti spasi dengan underscore (_).

Selanjutnya buka file activity_main.xml pada project kalian, disini kita akan menambahkan ImageView, kalian dapat membuat ImageView dengan menggunakan kode xml, seperti berikut ini:

<?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_marginLeft="16dp"
    android:layout_marginRight="16dp"
    android:background="#FFF5F5F5"
    android:gravity="center"
    android:orientation="vertical"
    tools:context="android.cianjur.developer.net.basicandroid.MainActivity">

    <ImageView
        android:id="@+id/logosaya"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:srcCompat="@drawable/logomedium" />
    
</LinearLayout>

Didalam tag <ImageView> kita menggunakan atribut "app:srcCompat" yang digunakan untuk mengambil gambar yang sudah kalian simpan pada direktori drawable.

Selain menggunakan kode xml, kalian juga dapat langsung mendrag/drop widget tersebut, serta mengatur atributnya.

Menambahkan ImageView pada Activity

Selain itu juga, kalian dapat menampilkan gambar secara programmatic menggunakan Java, pada ImageView, seperti berikut ini:

package android.cianjur.developer.net.basicandroid;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.ImageView;

public class MainActivity extends AppCompatActivity{

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ImageView gambar = findViewById(R.id.logosaya);
        gambar.setImageResource(R.drawable.logomeduim);
    }
}

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

Wassalamualaikum Warahmatullahi Wabarakatuh.

Cara Membuat Toggle Button pada Android Studio

Cara Membuat Toggle Button pada Android Studio


Assalamualaikum Warahmatullahi Wabarakatuh.

Toggle Button adalah salah satu elemen dasat pada Android Studio. Pada dasarnya Toggle Button berbedan dengan Button biasanya pada Android, Toggle Button mempunyai dua buah state, yaitu ON dan OFF. Toggle Button memiliki fungsi seperti saat kita menyalakan sebuah lampu, kita bisa menyalakan dan juga mematikan saklar tersebut.

Cara Membuat Toggle Button pada Android Studio

Pada tutorial berikut ini, kita akan belajar cara membuat dan juga menggunakan Toggle Button pada Android Studio, disini kita akan mempraktekannya dengan membuat program sederhana beserta penjelasan pengenai program tersebut.

Materi Lainnya Yang Direkomendasikan:
Cara Membuat Toggle Button pada Android Studio

Buatlah project baru pada android studio kalian, jika sudah, selanjutnya buka file activity_main.xml pada project tersebut.

Disini kita akan membuat 2 buah Toggle Button, dimana pada kedua Toggle Button tersebut bisa kita set menjadi ON atau OFF. dengan menggunakan kode xml, kalian dapat membuatnya seperti berikut ini.

<?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:background="#FFF5F5F5"
    android:gravity="center"
    android:orientation="vertical"
    tools:context="android.cianjur.developer.net.basicandroid.MainActivity">

    <ToggleButton
        android:id="@+id/toggle1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Toggle 1"/>

    <ToggleButton
        android:id="@+id/toggle2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Toggle 2"
        android:textOff="Mati"
        android:textOn="Menyala" />

    <Button
        android:id="@+id/cek"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Check" />

</LinearLayout>

Pada contoh tersebut, kita membuat 2 buah ToggleButton, ToggleButton pertama menggunakan label text default dari Toggle Button tersebut. Sedangkan pada Toggle Button Kedua, kita mengubah text label sesuai dengan state nya, jika state nya ON maka tulisan pada labelnya adalah "Menyala", sedangkan jika state nya OFF maka label akan bertuliskan "Mati", Lalu satu buah button lagi yang digunakan untuk mengecek kondisi dari kedua Toggel Button tersebut.

Selain menggunakan kode xml secara manual, Kalian dapat langsung mendrag/drop komponen tersebut yang terdapat pada Pallete, kedalam Activity/Layout. dan Juga atur propertiesnya, seperti id, text, textOff dan TextOn.

Menambahkan Toggle Button pada Activity

Selanjutnya buka file MainActivity.java pada project tersebut, lalu masukan source code berikut ini.

package android.cianjur.developer.net.basicandroid;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;
import android.widget.ToggleButton;

public class MainActivity extends AppCompatActivity{

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        final ToggleButton toggle1 = findViewById(R.id.toggle1);
        final ToggleButton toggle2 = findViewById(R.id.toggle2);
        Button Check = findViewById(R.id.cek);
        Check.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                //Mengecek Kondisi pada ToggleButton 1
                if (toggle1.isChecked()){
                    Toast.makeText(getApplicationContext(), "Toggle 1 MENYALA", Toast.LENGTH_SHORT).show();
                }else{
                    Toast.makeText(getApplicationContext(), "Toggle 1 MATI", Toast.LENGTH_SHORT).show();
                }

                //Mengecek Kondisi pada ToggleButton 2
                if (toggle2.isChecked()){
                    Toast.makeText(getApplicationContext(), "Toggle 2 MENYALA", Toast.LENGTH_SHORT).show();
                }else{
                    Toast.makeText(getApplicationContext(), "Toggle 2 MATI", Toast.LENGTH_SHORT).show();
                }
            }
        });
    }
}

Source codenya cukup sederhana, kita bisa mengecek kondisi pada ToggleButton 1 dan 2 dengan menggunakan Statement if-else, program akan mengecek kondisi pada kedua ToggleButton tersebut, saat Button Check di Klik, lalu menampilkan pesan dari hasil cek kondisi tersebut dengan menggunakan Toast.

Demo:

 

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

Wassalamualaikum Warahmatullahi Wabarakatuh.

Cara Berpindah Activity Menggunakan RecyclerView

Cara Berpindah Activity Menggunakan RecyclerView


Assalamualaikum Warahmatullahi Wabarakatuh.

Pada kesempatan kali ini saya akan mengajarkan pada kalian, bagaimana cara berpindah dari satu activity ke activity lainnya, pada RecyclerView, jika kalian menggunakan RecyclerView untuk Aplikasi Android pastinya didalam RecyclerView tersebut terdapat daftar item yang bisa diakses oleh user.

Cara Berpindah Activity Menggunakan RecyclerView

Jika kita ingin membuat aksi/event pada masing-masing item tersebut, saat user mengklik salah satu item dari list, maka akan berpindah pada activity lain, sesuai dengan nama item yang dikliknya, jadi setiap item didalam RecylerView mempunyai activity berbeda beda.

Materi Lainnya Yang Harus Kalian Pelajari:

Tutorial berikut ini mengikuti contoh pada tutorial sebelumnya, seperti desgn, nama activity, dan juga source codenya.

A.Membuat Design Layout RecyclerView

1) Buka file build.gradle(app-level) lalu masukan ketiga dependensies berikut ini untuk membuat RecyclerView Material Design

compile 'com.android.support:appcompat-v7:26.1.0'
compile 'com.android.support:design:26.1.0'
compile 'com.android.support:recyclerview-v7:26.1.0'
compile 'com.android.support:support-v4:26.1.0'

2) Selanjutnya kita design layout untuk RecyclerView kita, buat layout baru, dengan nama view_design.xml, di res/layout, layout tersebut digunakan untuk mengatur tampilan desain per-itemnya, tampilan desainnya akan kita buat seperti ini:

WildanTechoArt-Item Desain RecyclerView

Kalian dapat membuatnya menggunakan kode xml, seperti berikut ini:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/item_list"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="8dp"
    android:orientation="vertical">

    <ImageView
        android:id="@+id/meme"
        android:layout_width="70dp"
        android:layout_height="70dp"
        android:layout_marginEnd="8dp"
        android:layout_marginRight="8dp"
        android:contentDescription="@string/todo"
        app:srcCompat="@drawable/meme1" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="70dp"
        android:layout_toEndOf="@+id/meme"
        android:layout_toRightOf="@+id/meme"
        android:gravity="center"
        android:orientation="vertical">

        <TextView
            android:id="@+id/memetitle"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="2dp"
            android:text="Wildan"
            android:textSize="18sp"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/sub_meme"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="2dp"
            android:text="Gambar Meme Ke: 0"
            android:textSize="14sp" />
    </LinearLayout>

</RelativeLayout>

3) Selanjutnya kita akan membuat sebuah class bernama RecyclerViewAdapter, adapter tersebut akan kita gunakan untuk mengatur data model yang akan ditampilkan pada RecyclerView dan juga didalamnya terdapat ViewHolder yang digunakan untuk menyimpan view-view yang akan di gunakan pada item, view-view disini bisa berupa ImageView, TextView, EditText, Dll.

package android.cianjur.developer.net.recyclerviewexample;

import android.content.Context;
import android.content.Intent;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import android.widget.TextView;

import java.util.ArrayList;

//Class Adapter ini Digunakan Untuk Mengatur Bagaimana Data akan Ditampilkan
public class RecyclerViewAdapter extends RecyclerView.Adapter<RecyclerViewAdapter.ViewHolder>{

    private ArrayList<String> arrayList; //Digunakan untuk Judul
    private ArrayList<Integer> memeList; //Digunakan untuk Image/Gambar

    RecyclerViewAdapter(ArrayList<String> arrayList, ArrayList<Integer> memeList){
        this.arrayList = arrayList;
        this.memeList = memeList;
    }

    //ViewHolder Digunakan Untuk Menyimpan Referensi Dari View-View
    class ViewHolder extends RecyclerView.ViewHolder{

        private TextView JudulMeme, SubMeme;
        private ImageView Meme;
        private RelativeLayout ItemList;
        private Context context;

        ViewHolder(View itemView) {
            super(itemView);

            //Untuk Menghubungkan dan Mendapakan Context dari MainActivity
            context = itemView.getContext();

            //Menginisialisasi View-View untuk kita gunakan pada RecyclerView
            JudulMeme = itemView.findViewById(R.id.memetitle);
            SubMeme = itemView.findViewById(R.id.sub_meme);
            Meme = itemView.findViewById(R.id.meme);
            ItemList = itemView.findViewById(R.id.item_list);
            ItemList.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View view) {
                    Intent intent = new Intent();
                    switch (getAdapterPosition()){
                        case 0 :
                            intent = new Intent(context, meme1.class);
                            break;
                        case 1 :
                            intent = new Intent(context, meme2.class);
                            break;
                    }
                    context.startActivity(intent);
                }
            });
        }
    }

    @Override
    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        //Membuat View untuk Menyiapkan dan Memasang Layout yang Akan digunakan pada RecyclerView
        View V = LayoutInflater.from(parent.getContext()).inflate(R.layout.view_design, parent, false);
        ViewHolder VH = new ViewHolder(V);
        return VH;
    }

    @Override
    public void onBindViewHolder(ViewHolder holder, final int position) {
        //Memasukan Nilai/Value Pada View-View Yang Telah Dibuat
        final String Nama = arrayList.get(position);//Mengambil data sesuai dengan posisi yang telah ditentukan
        holder.JudulMeme.setText(Nama);
        holder.SubMeme.setText("Gambar Meme Ke: "+position);
        holder.Meme.setImageResource(memeList.get(position)); // Mengambil gambar sesuai posisi yang telah ditentukan
    }

    @Override
    public int getItemCount() {
        //Menghitung Ukuran/Jumlah Data Yang Akan Ditampilkan Pada RecyclerView
        return arrayList.size();
    }

}

Selain menggunakan OnClickListener(), untuk berpindah activity, kita memerlikan sebuah Context dari MainActivity yang akan kita gunakan untuk berpindah activity pada fungsi Intent().

Selanjutnya kita menggunakan fungsi getAdapterPosition() untuk mendapatkan posisi dari Daftar Item yang di klik user pada MainActivity.Pada contoh tersebut kita hanya berpindah pada 2 activity yang berbeda saja, yaitu meme1 dan meme2.

4) Buka file activity_main.xml kalian, disini kita akan menambahkan RecyclerView, seperti berikut ini:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
    tools:context="android.cianjur.developer.net.recyclerviewexample.MainActivity">

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recycler"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scrollbars="vertical">

    </android.support.v7.widget.RecyclerView>

</RelativeLayout>

Terakhir buka MainActiviy.java, lalu masukan source code berikut ini:

package android.cianjur.developer.net.recyclerviewexample;

import android.support.v4.content.ContextCompat;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.DefaultItemAnimator;
import android.support.v7.widget.DividerItemDecoration;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;

import java.util.ArrayList;

public class MainActivity extends AppCompatActivity {

    private RecyclerView recyclerView;
    private RecyclerView.Adapter adapter;
    private RecyclerView.LayoutManager layoutManager;
    private ArrayList<String> JudulMeme;
    private ArrayList<Integer> GambarMeme;
    //Daftar Judul
    private String[] Judul = {"Wildan", "Taufan"};
    //Daftar Gambar
    private int[] Gambar = {R.drawable.meme1, R.drawable.meme2};

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        JudulMeme = new ArrayList<>();
        GambarMeme = new ArrayList<>();
        recyclerView = findViewById(R.id.recycler);
        DaftarItem();
        //Menggunakan Layout Manager, Dan Membuat List Secara Vertical
        layoutManager = new LinearLayoutManager(this);
        recyclerView.setLayoutManager(layoutManager);
        recyclerView.setHasFixedSize(true);
        recyclerView.setItemAnimator(new DefaultItemAnimator());
        adapter = new RecyclerViewAdapter(JudulMeme, GambarMeme);
        //Memasang Adapter pada RecyclerView
        recyclerView.setAdapter(adapter);
    }

    //Mengambil data dari Varibale Gambar dan Judul, lalu memasangnya pada list yang terhubung dengan Class Adapter
    private void DaftarItem(){
        for (int w=0; w<Judul.length; w++){
            GambarMeme.add(Gambar[w]);
            JudulMeme.add(Judul[w]);
        }
    }
}

Sekarang coba jalankan project tersebut.

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

Wassalamualaikum Warahmatullahi Wabarakatuh.

Cara Menjalankan Project Android Studio ke HP Android (USB Debugging)

Cara Menjalankan Project Android Studio ke HP Android (USB Debugging)


Assalamualaikum Warahmatullahi Wabarakatuh.

Saat kita mengembangkan suatu aplikasi menggunakan Android Studio, pastingan memerlukan beberapa kali tes atau pengujian aplikasi tersebut pada perangkat android, untuk memudahkan seorang developer dalam mengembangkan aplikasinya, salah satu kemudahan pada Andrid Sudio, yaitu, kita dapat secara langsung menguji aplikasi tersebut pada smartphone android, dengan menghubungkan perangkat menggunakan kabel USB, jadi kita tidak perlu repot-repot lagi menggunakan emulator.

Cara Menjalankan Project Android Studio ke HP Android (USB Debungging)

Karena jika menggunakan emulator, banyak keluhan, seperti prosesnya lama atau memerlukan spesifikasi yang besar, dengan menggunakan perangkat android, kita dapat secara lengsung merunning aplikasi tersebut pada ponsel android untuk menguji apakah terdapat error, sebelum  kita publish.

Pada tutorial ini, akan saya jelaskan mengenai cara menjalankan project yang kita buat di Android Studio ke perangkat android. Kalau bahasa umumnya bisa kita sebut, mendeploy aplikasi.
Materi Lainnya Yang Direkomendasikan

A.Membuka Developer Mode atau Opsi Pengembangan

Untuk membuaka opsi pengembangan pada ponsel android kalian, pertama masuk kedalam Pengaturan atau Setting, opsi pengembangan akan terlihat seperti ini.

Opsi Pengembangan Pada Ponsel Android

Jika Opsi Pengembangan atau Developer Mode pada ponsel Android tersebut tidak ada, kalian dapat mengaktifkannya dengan cara, buka menu About Phone/Tentang Ponsel.

Mengaktifkan Opsi Pengembangan

Disana terdapat Nomor bentukan atau Build Number, kalian klik (sebanyak5x atau lebih) sampai muncul pesan "Anda Sudah Menjadi Pengembang" atau Sejenisnya.

Jika sudah, kembali ke menu pengaturan, disini akan muncul menu baru bernama, Opsi Pengembangan (Developer Mode), klik menu tersebut, makan kalian akan dialihkan pada halaman Pengembang seperti berikut ini.

Mengaktifkan Debugging Mode

Pertama aktifkan terlebih dahulu Opsi pengembang, lalu ceklis pada bagian Debugging USB.

B.Installasi Driver dan Konfigurasi Android Studio

Sebelumnya kita sudah mengaktifkan USB Debugging pada Ponsel Android, selanjutnya kalian harus menginstall Driver untuk ponsel android tersebut, kalian dapat mendownloadnya di Internet, sesuai dengan merk dan jenis Androidnya, supaya bisa terbaca oleh komputer/laptop.

Buka aplikasi Android Studio kalian, buatlah project baru.

Pertama kita install terlebih dahulu Google USB Driver pada Android Studio, caranya klik SDK Manager.

SDK Manager

Buka SDK Tools, lalu cari Google USB Driver, setelah ketemu, kalian download komponen tersebut, dengan mengklik tombol Apply dan Ok.


Sambungkan perangkat Android kalian menggunakan kabel USB, Sekarang coba Klik Run/Jalankan Project tersebut, maka akan terlihat seperti ini.

Run Project Menggunakan Perangkat Android

Demo:

Demo Project

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

Wassalamualaikum Warahmatullahi Wabarakatuh.

Belajar Membuat Style Material Design di Android Studio

Belajar Membuat Style Material Design di Android Studio


Assalamualaikum Warahmatullahi Wabarakatuh.

Kali ini saya akan mengajarkan pada kalian, tentang bagaimana cara membuat tema dengan style Material Design pada Aplikasi Android. Bisa kita bandingkan Tema atau Style yang menggunakan Material Design, dengan tema yang belum menggunakan Material Design, yaitu pada bagian warnanya, tema Material Design menggunakan warna-warna yang memang sudah dirancang oleh programmer, supaya enak dilihat. Style atau Tema Material Design mempunyai sebuah color palette sendiri, yang berisi warna-warna untuk kita digunakan pada aplikasi, seperti colorPrimary, colorPrimaryDark, dan sebagainya.

Belajar Membuat Style Material Design di Android Studio

Materi Lainnya Yang Direkomendasikan:

Membuat Tema dengan Style Material Design di Android Studio

Google sendiri sudah menyediakan referensi warna untuk Material Design yang bisa kalian cek di sini atau pada website materialpalette.com, yang akan membantu pada developer dalam meng-generate warna yang akan dipakai pada Aplikasi Android. Untuk membuat Style atau Tema Material Design, pertama buka file colors.xml, yang terdapat pada Direktori /res/values.

Berikut ini merupakan beberapa Style/Tema Color Default yang sudah saya ubah dan tambahkan, dengan menggunakan Warna yang sudah saya dari situs https://www.materialpalette.com/ atau kalian juga dapat mendownloadnya secara langsung. #009688#009688

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#3F51B5</color>
    <color name="colorPrimaryDark">#303F9F</color>
    <color name="colorAccent">#536DFE</color>
    <color name="lightPrimaryColor">#C5CAE9</color>
    <color name="icom">#FFFFFF</color>
    <color name="secondaryText">#757575</color>
    <color name="primaryText">#212121</color>
    <color name="DividerColor">#BDBDBD</color>
</resources>

Dengan menggunakan situs tersebut, kita dapat dengan praktis menentukan warna-warna untuk Style Material Design pada Aplikasi kita.

Membuat Theme Material Design pada style.xml

Jika resources colornya sudah beres, selanjutnya kita akan membuat tema kita sendiri dengan style Material Design, Caranya, bukalah file /res/values/styles.xml, lalu ubah baris kode tersebut menjadi seperti berikut ini.

<resources>

    <style name="Base.Theme.WILDAN_TECHNO_ART" parent="Theme.AppCompat.NoActionBar">

        <item name="colorPrimary">@color/colorPrimary</item>

        <!--   warna gelap untuk status bar dan contextual app bars -->
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>

        <!--   theme UI controls seperti radioButton atau checkbox dan FloatActionButton -->
        <item name="colorAccent">@color/colorAccent</item>

        <!--   warna untuk Judul Text  -->
        <item name="android:textColorPrimary">@color/primaryText</item>

        <!--   warna untuk menu overflow icon -->
        <item name="android:textColorSecondary">@color/secondaryText</item>

    </style>

    <!-- Base application theme. -->
    <style name="AppBaseTheme" parent="Base.Theme.WILDAN_TECHNO_ART">

    </style>

    <!-- Application theme. -->
    <style name="AppTheme" parent="AppBaseTheme">

    </style>

</resources>

Secara otomatis komponen yang terdapat pada Aplikasi kita, akan diwarnai sesuai dengan Style yang sudah kita atur didalam file color.xml dan style.xml.

Untuk mengimplementasikan tema tersebut pada aplikasi kita, kita harus mensettingnya pada AndroidManifest.xml. Caranya buka file AndroidManifest.xml yang terdapat pada Direktori app/src/main, dialam Tag, <Application>, terdapat sebuah field, bernama android:theme, lalu masukan nama tema kita, yaitu AppTheme. Seperti berikut ini:

<application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">

Demo:

Contoh Tema dengan Style Material Design

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

Wassalamualaikum Warahmatullahi Wabarakatuh.

Cara Membuat SnackBar di Android Material Design

Cara Membuat SnackBar di Android Material Design


Assalamualaikum Warahmatullahi Wabarakatuh.

SnackBar adalah salah satu view yang termasuk kedalam Android Material Design, view tersebut mempunyai fungsi hampir sama dengan Toast, yaitu untuk menampilkan pesan/informasi singkat pada user. Perbedaannya yaitu, SnackBar mempunyai posisi default pada bagian bawah layar ketika tampil. Selain itu juga, SnackBar mempunyai tombol “Action”, ketika diklik oleh user, SnackBar akan melakukan sebuah aksi yang telah kita definisikan sebelumnya.


Cara Membuat SnackBar di Android Material Design

Pada tutorial sebelumnya, saya sudah membahas mengenai pengguaan Toast pada Android, jika kalian pernah membuatnya, fungsi SnackBar bisa kalian gunakan sebagai alternative lain dari Toast, atau bisa kalian kombinasikan keduanya. Mari kita simak tutorial berikut ini.

Materi Lainnya Yang Direkomendasikan:

Membuat SnackBar di Android Material Design

Buka Android Studio kalian, bualah project baru dan juga new Empty Activity, untuk kita gunakan sebagai MainActivity.

Selanjutnya buka file activity_main.xml pada project kalian, disini kita akan menambahkan sebuah Button, saat Button tersebut diklik, maka akan muncul pesan atau informasi singkat pada SnackBar.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
    tools:context="android.cianjur.developer.net.basicandroid.MainActivity">

    <Button
        android:id="@+id/klikme"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:text="Klik Disini Gan!" />

</RelativeLayout>

Pada kode xml tersebut, disini kita menemptkan Button pada posisi berada di tengah layar, seperti berikut ini.

Menambahkan Button pada Activity

Pada umunya, cara memanggil SnackBar sama seperti Toast, yaitu menggunakan static-chained method yang bisa langsung dipanggil pada suatu Activity. Pada contoh dibawah ini, kita akan mencoba memanggil SnackBar dengan menggunakan Button dan juga akan kita kombinasikan dengan Toast, saat tombol action pada SnackBar diklik, makan pesan dari Toast akan muncul. Coba kalian perhatikan source code berikut ini.

package android.cianjur.developer.net.basicandroid;

import android.content.Context;
import android.support.design.widget.Snackbar;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity{

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        Button ClickMe = findViewById(R.id.klikme);
        ClickMe.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Snackbar.make(view, "Ini Adalah SnackBar", Snackbar.LENGTH_LONG)
                        .setAction("Klik Juga Disini", new View.OnClickListener() {
                    @Override
                    public void onClick(View view) {
                        //Memunculkan Pesan Toast, Saat Action Diklik
                        Toast.makeText(getApplicationContext(),"Belajar Android", Toast.LENGTH_SHORT).show();
                    }
                }).show();
            }
        });
    }
}

Penjelasan:

Untuk memanggil SnackBar ada beberapa parameter yang harus diinputkan, yaitu sebuah view dimana SnackBar ingin ditampilkan, Lalu String yang berisi pesan atau informasi yang ingin disampaikan, dan terakhir adalah durasi dari SnackBar tersebut.

Selain menambahkan pesan, pada SnackBar tersebut, kita tambahkan Action/Aksi yang bisa diklik oleh user, menggunakan fungsi setAction(), fungsi tersebut mempunyai parameter yaitu String untuk nama aksi yang akan ditampilkan, dan sebuah OnClickListener berisi perintah yang akan dilakukan saat Action tersebut diklik.

Demo:

Screenshot_SnackBar Example1 Screenshot_SnackBar Example2

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

Wassalamualaikum Warahmatullahi Wabarakatuh.

Cara Merandom (Acak) Suatu Bilangan pada Java

Cara Merandom (Acak) Suatu Bilangan pada Java


Assalamualaikm Warahmatullahi Wabarakatuh.

Pada Bahasa Pemrograman Java, kita dapat merandom/mengacak suatu data, menggunakan fungsi Class Random, Math.random dan Collection.shuffle(), sehingga data yang  diambil akan berbeda beda, fungsi Random dapat kita manfaat untuk keamanan dan juga untuk membuat sebuah aplikasi. misalnya jika kita ingin membuat sebuah aplikasi game seperti kuis, soal-soal didalam kuis tersebut bisa kita acak/random, agar soal yang ditampilkan tidak sama dengan sebelumnya.

Cara Merandom (Acak) Suatu Bilangan pada Java

Contoh lainnya adalah jika kita mempunyai 10 angka didalam list, dengan teknik random, kita akan mendapatkan angka secara acak dari 10 angka tersebut. Begitu juga pada tutorial ini, disini saya akan mengajarkan pada kalian, cara membuat serta menggunakan fungsi dan juga class random pada Pemrograman Java.

Materi Lainnya Yang Direkomendasikan:

Di dalam bahasa pemrograman Java, terdapat bebera fungsi dan class yang dapat kita manfaatkan untuk merandom suatu bilangan didalam list, antara lain :
  • Class Random
  • Fungsi Math.random()
  • Fungsi Collections.shuffle()

Ketiga class atau method tersebut mempunyai fungsi yang sama, tetapi memiliki kelebihan dan juga kekurangannya masing-masing, kalian bisa menggunakan salah satu atau semuanya, tergantung kebutuhan.

Persiapan.

Sebagai persiapan, disini kita akan menggunakan ArrayList untuk menyimpan data-data yang akan kita acak, lalu data tersebut akan kita tampilkan pada layar.

package WILDAN_TECHNO_ART;

import java.util.ArrayList;

public class random_class {
    public static void main(String[] args){
        //Membuat Instance/Objek dari ArrayList dengan Tipe Data Integer
        ArrayList<Integer> data = new ArrayList<>();
        random_class myclass = new random_class();
        
        //Menambahkan Bebrapa Data pada objek ArrayList
        data.add(1); //Posisi/No Index 0
        data.add(2); //Posisi/No Index 1
        data.add(3); //Posisi/No Index 2
        data.add(4); //Posisi/No Index 3
        data.add(5); //Posisi/No Index 4
    }
}

A.Menggunakan Class Random

Untuk mengambil data secara acak menggunakan Class Random, didalam class tersebut terdapat sebuah fungsi bernama nextInt(), yang nantinya akan kita digunakan untuk mengambil data dari list secara acak:

package WILDAN_TECHNO_ART;

import java.util.ArrayList;
import java.util.Random;

public class random_class {
    public static void main(String[] args){
        //Membuat Instance/Objek dari ArrayList dengan Tipe Data Integer
        ArrayList data = new ArrayList<>();
        random_class myclass = new random_class();
        
        //Menambahkan Bebrapa Data pada objek ArrayList
        data.add(1); //Posisi/No Index 0
        data.add(2); //Posisi/No Index 1
        data.add(3); //Posisi/No Index 2
        data.add(4); //Posisi/No Index 3
        data.add(5); //Posisi/No Index 4
        
        //Memanggil Method getClass
        myclass.getData(data);
    }
    
    //Method ini Digunakan Untuk Membuat Statemet Random pada Data
    void getData(ArrayList data){
        Random GetRandom = new Random();
        int getAngka = data.get(GetRandom.nextInt(data.size()));
        System.out.println("Angka Yang Didapat: "+getAngka);
    }
}

Jika kalian jalankan berkali kali, maka data/angka yang mucul, akan berbeda beda.

B.Menggunakan Fungsi Math.random()

Didalam Class Math, terdapat sebuah fungsi bernama random(), yang bisa kita digunakan untuk mengambil data dari list secara acak.

Coba kalian ubah Statement didalam method getData(), menjadi seperti berikut ini:

void getData(ArrayList data){
        int getAngka = (int) (Math.random()*data.size());
        System.out.println("Angka Yang Didapat: "+data.get(getAngka));
    }

Kode diatas terdapat sebuah variable getAngka, yang digunakan untuk mendapatkan index dari list secara acak. Lalu data.get(getAngka) adalah proses mengambil angka dari list menggunakan index secara acak.

C.Menggunakan Fungsi Collections.shuffle()

Cara ini adalah yang paling simple menurut saya, untuk mendapatkan angka secara acak dari list. Shuffle adalah sebuah method dari class Collections. Method shuffle digunakan untuk merandom isi dari sebuah list, jadi saat kita memanggil data pada List dengan No Index tertentu, maka data yang akan tampil sudah ter-random.

Ubah Statement didalam method getData(), menjadi seperti ini:

void getData(ArrayList<Integer> data){
        Collections.shuffle(data);
        System.out.println("Angka Yang Didapat: "+data.get(0));
    }

Setelah data pada List teracak acak oleh Collections.shuffle(), selajutnya tinggal kita ambil angka tersebut pada index pertama, yaitu index ke 0 (nol).

Mendapatkan bilangan secara acak dari Spesifik Range yang telah ditentukan, yaitu Batas minimum dan maksimul angka

Pada kasus ini angka dapat kita tentukan secara spesifik antara minum dan maksimum. Jika kita mempunyai data dengan angka 1-5, seperti pada contoh diatas, jika sebelumnya kita mengacak-acak semua data dari list, beriktut ini kita tidak akan merandom semua data tersebut.

Misalnya kita hanya merandom angka dari range 3-5, jadi angka 1 dan 2 tidak akan kita random/acak. seperti pada contoh berikut ini:

void getData(ArrayList<Integer> data){
        int minimum = 3;
        int maximum = 5;
        int range = maximum-minimum+1;
        Random random = new Random();
        int randomAngka = random.nextInt(range)+minimum;
        System.out.println("Angka Yang Didapat: "+randomAngka);
    }

Maka data yang di random dan ditampilkan hanya pada range 3-5 saja, angka 1-2 tidak akan ditampilkan.

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

Wassalamualaikum Warahmatullahi Wabarakatuh.

Cara Menambahkan Item dan Icon pada Alert Dialog

Cara Menambahkan Item dan Icon pada Alert Dialog


Assalamualaikum Warahmatullahi Wabarakatuh.

Berikut ini merupakan lanjutan dari tutorial sebelumnya, yaitu Membuat Alert Dialog pada Aplikasi Android. Pada tutorial ini, kita akan belajar cara menambahkan sebuah icon serta item yang akan menjadi opsi pilihan untuk user, item pada Alert Dialog akan terlihat seperti list/daftar item yang bisa discroll ke atas dan kebawah.

Cara Menambahkan Item dan Icon pada Alert Dialog

Materi Lainnya Yang Direkomendasikan:

Cara Menambahkan Item dan Icon pada Alert Dialog

Pertama kita akan membuat sebuah iconnya terlebih dahulu, kalian dapat membuatnya sendiri dengan ukuran 32x32 pixel atau mengambil icon yang sudah disediakan pada Android Studio.

Di tutorial ini kita akan menggunakan icon yang terdapat pada Android Studio, caranya klik kanan pada direktori res > new > Image Asset.

membuat icon untuk alert dialog

Setelah selesai membuat icon, selanjutnya kita akan mengimplementasikannya pada alert dialog, selain itu, kita juga akan membuat Item list pada alert dialog tersebut.

Disini kita akan menggunakan sebuah Button pada ActivityMain, buka activity_main.xml, lalu tambahkan Button menggunakan kode xml, seperti berikut ini:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
    tools:context="android.cianjur.developer.net.basicandroid.MainActivity">

    <Button
        android:id="@+id/food"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:text="Menu Makanan" />
    
</RelativeLayout>

Selanjutnya buka file MainActiviy.java pada project, jika kalian sudah membuat Alert Dialog mengikuti tutorial yang saya berikan sebelumnya, sekarang kita akan mengubah source code tersebut menjadi seperti berikut ini:

package android.cianjur.developer.net.basicandroid;

import android.content.DialogInterface;
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.Toast;

public class MainActivity extends AppCompatActivity{

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        Button menu = findViewById(R.id.food);
        menu.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                ShowDialog();
            }
        });
    }

    private void ShowDialog(){
        final String[] makanan = {"Mie Ayam","Bakso","Ayam Goreng","Nasi Goreng","Sate"};
        AlertDialog.Builder alert = new AlertDialog.Builder(this);
        alert.setTitle("Pilih Menu Makanan")
                .setIcon(R.drawable.ic_notificaion)
                .setItems(makanan, new DialogInterface.OnClickListener() {
                    @Override
                    public void onClick(DialogInterface dialogInterface, int i) {
                        switch (i){
                            case 0:
                                Toast.makeText(getApplicationContext(),"Anda Memesan "+makanan[0],Toast.LENGTH_SHORT).show();
                                break;
                            case 1:
                                Toast.makeText(getApplicationContext(),"Anda Memesan "+makanan[1],Toast.LENGTH_SHORT).show();
                                break;
                            case 2:
                                Toast.makeText(getApplicationContext(),"Anda Memesan "+makanan[2],Toast.LENGTH_SHORT).show();
                                break;
                            case 3:
                                Toast.makeText(getApplicationContext(),"Anda Memesan "+makanan[3],Toast.LENGTH_SHORT).show();
                                break;
                            case 4:
                                Toast.makeText(getApplicationContext(),"Anda Memesan "+makanan[4],Toast.LENGTH_SHORT).show();
                                break;
                        }
                    }
                })
                .setCancelable(false);
        alert.show();
    }
}

Penjelasan:

Pertama kita mendeklarasikan variable Array didalamnya terdapat menu yang akan kita tampilkan, lalu untuk menambahkan icon, kita menggunakan fungsi setIcon() yang terdapat pada Alert Dialog dan untuk menambahkan item, kita menggunakan fungsi setItem() dengan OnClickListner().

Didalam OnClickListener tersebut, kita menambahkan aksi pada masing-masing menu yang di klik berdasarkan posisi No Index Array.

Demo:

Screenshot_item dan icon example pada AlertDialog1  Screenshot_item dan icon example pada AlertDialog2 Screenshot_item dan icon example pada AlertDialog3

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

Wassalamualaikum Warahmatullahi Wabarakatuh.