Membuat Aplikasi Cardview Dan Recyclerview Sederhana

Oleh Pojok Guru

Selasa, 23 Agustus 2016

Bagikan :

Tweet

Hai sobat, usang tidak posting ihwal pemrograman android alasannya aktivitas yang padat dan project pada numpuk hehe. Pada artikel andriod sebelumnya aku telah menjelaskan ihwal Membuat Aplikasi Portal Berita , dan kali ini aku akan memjelaskan cara menciptakan aplikasi sederhana yang memakai CardView dan RecyclerView, berikut caranya

RecyclerView ialah teknologi gres dari ListView. RecyclerView mempunyai kelebihan yang membuatnya lebih gampang untuk diatur, tampilan dari RecyclerView juga lebih cantik alasannya bersifat fleksibel serta animasi tampil dan hilang objek yang lebih bagus.

CardView ialah sebuah view atau widget yang memperlihatkan tampian menyerupai kertas yang mengambang pada layar. Tampilan ini biasanya dipakai untuk menampilkan gosip berupa teks atau gambar di dalamnya. CardView sendiri termasuk dari bab UI Material Design.

Membuat/ Project Baru

Buat project gres dengan nama Recycler View 1, dan untuk package beri nama blogsetyaaji.com. Saat berada pada jendela pilihan activity, pilih empty activity.

Menginstal Library Dependencies

Instal RecyclerView dan CardView dependencies dengan membuka build:grandle kemudian tambahkan instruksi di bawah ini

 compile 'com.android.support:cardview-v7:24.0.0'     compile 'com.android.support:recyclerview-v7:24.0.0' 

Pada bab atas akan muncul pilihan untuk mensingkronisasi dependencies, pilih sync the project dan library akan terdownload.

Membuat Layout

Pada activity_main.xml hanya menampilkan satu widget RecyclerView, kodenya menyerupai berikut ini

 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"     xmlns:tools="http://schemas.android.com/tools"     android:layout_width="match_parent"     android:layout_height="match_parent"     tools:context="com.blogsetyaaji.recyclerview1.MainActivity">      <android.support.v7.widget.RecyclerView         android:layout_width="match_parent"         android:layout_height="match_parent"         android:scrollbars="vertical"         android:id="@+id/card_recycler_view"/> </LinearLayout> 

Kemudian buat layout gres dengan nama card_row.xml, layout ini untuk menampilkan item dari RecyclerView yaitu CardView dengan TextView di dalamnya. Untuk kodenya menyerupai berikut ini

 <?xml version="1.0" encoding="utf-8"?> <android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"     android:layout_width="match_parent"     android:layout_height="wrap_content"     xmlns:card_view="http://schemas.android.com/apk/res-auto"     android:id="@+id/card"     android:layout_marginTop="5dp"     android:layout_marginRight="5dp"     android:layout_marginLeft="5dp"     card_view:cardCornerRadius="5dp">      <TextView         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:id="@+id/nama_kota"         android:layout_marginTop="10dp"         android:layout_marginBottom="10dp"         android:layout_gravity="center"         android:textSize="18sp"         android:textStyle="bold"/>  </android.support.v7.widget.CardView>   

Membuat Adapter 

Sebelum mengimplementasikan RecyclerView ke MainActivity, kita perlu menciptakan adapter untuk megatur tiap data ke satuan list item. Di dalam adapter terdapat inner ViewHolder yang mengextend ke RecyclerView.ViewHolder untuk menginisialkan TextView. RecyclerView.Adapter ialah induk class, contructor pada class ini memakai parameter ArrayList dan kota sebagai nilainya. Pada method onCreateViewHolder(), kita inflate atau masukkan layout yang akan menampikan list data kemudian mengembalikan sebagai object ViewHolder. Pada method onBindViewHolder() berkhasiat untuk mengatur TextView menjadi List item data dari ArrayList, dan getItemCount() berkhasiat untuk mengembalikan ukuran/jumlah data yang akan ditampilkan.

 package com.blogsetyaaji.recyclerview1;  import android.support.v7.widget.RecyclerView; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.TextView;  import java.util.ArrayList;  /**  * Created by AJISETYA on 8/18/2016.  */ public class DataAdapter extends RecyclerView.Adapter<DataAdapter.ViewHolder> {     private ArrayList<String> kota;      public DataAdapter(ArrayList<String> kota){         this.kota = kota;     }       @Override     public DataAdapter.ViewHolder onCreateViewHolder(ViewGroup viewGroup, int i) {         View view = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.card_row, viewGroup, false);         return new ViewHolder(view);     }      @Override     public void onBindViewHolder(DataAdapter.ViewHolder viewHolder, int i) {          viewHolder.txtkota.setText(kota.get(i));     }      @Override     public int getItemCount() {         return kota.size();     }      public class ViewHolder extends RecyclerView.ViewHolder {         private TextView txtkota;         public ViewHolder(View view) {             super(view);              txtkota = (TextView)view.findViewById(R.id.nama_kota);         }     } } 

Membuat Activity

Dalam MainActivity, kita menciptakan ArrayList gres untuk memasukkan data ke dalam list. Adapter akan menginialisis data dengan memakai new DataAdapter(kota) dan kota ialah ArrayList yang tadi dibuat. Adapter diatur dengan memakai setAdapter().

 package com.blogsetyaaji.recyclerview1;  import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.support.v7.widget.LinearLayoutManager; import android.support.v7.widget.RecyclerView; import android.view.GestureDetector; import android.view.MotionEvent; import android.view.View; import android.widget.Toast;  import java.util.ArrayList;  public class MainActivity extends AppCompatActivity {      private ArrayList<String> kota;      @Override     protected void onCreate(Bundle savedInstanceState) {         super.onCreate(savedInstanceState);         setContentView(R.layout.activity_main);         initView();     }      private void initView(){         RecyclerView recyclerView = (RecyclerView)findViewById(R.id.card_recycler_view);         recyclerView.setHasFixedSize(true);          RecyclerView.LayoutManager layoutManager = new LinearLayoutManager(getApplicationContext());         recyclerView.setLayoutManager(layoutManager);          kota = new ArrayList<>();         kota.add("Semarang");         kota.add("Jakarta");         kota.add("Surabaya");         kota.add("Bandung");         kota.add("Srakarta");         kota.add("Depok");         kota.add("Semarang");         kota.add("Kendal");         kota.add("Bogor");          RecyclerView.Adapter adapter = new DataAdapter(kota);         recyclerView.setAdapter(adapter);          recyclerView.addOnItemTouchListener(new RecyclerView.OnItemTouchListener() {             GestureDetector gestureDetector = new GestureDetector(getApplicationContext(), new GestureDetector.SimpleOnGestureListener() {                  public boolean onSingleTapUp(MotionEvent e){                     return true;                 }             });              @Override             public boolean onInterceptTouchEvent(RecyclerView rv, MotionEvent e) {                 View child = rv.findChildViewUnder(e.getX(), e.getY());                 if (child != null && gestureDetector.onTouchEvent(e)){                     int position = rv.getChildAdapterPosition(child);                     Toast.makeText(getApplicationContext(), kota.get(position), Toast.LENGTH_SHORT).show();                 }                 return false;             }              @Override             public void onTouchEvent(RecyclerView rv, MotionEvent e) {              }              @Override             public void onRequestDisallowInterceptTouchEvent(boolean disallowIntercept) {              }         });     } } 

Menjalankan Program

Jika sudah selesai, jalankan aplikasi denganmemilih hidangan Run 'app'

Tag : Pemrograman, Pemrograman Android