
What is Custom Layout Listview ?
In this Tutorial is How to Create custom listView layout.we can design separate XML layout and use this layout is listView.
How to create Custom Layout in Listview?
Now I have Design XML file and bind custom adapter in listView. Now Create Custom ArrayAdapter class and bind XML layout file.
What is ArrayAdapter ?
Adapter is a bridge between UI component and data source that helps us to fill data in UI component. It holds the data and send the data to adapter view.And View send Data to adapter view and display UI from different different Views.
ArrayAdapter is an implementation of BaseAdapter. we need to create a custom listView and GridView. create custom adapter and extend ArrayAdapter in that custom class.
How to Create Custom Listview Example?
Create activity_main.xml File following this code.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="<a href="http://schemas.android.com/apk/res/android">http://schemas.android.com/apk/res/android</a>" xmlns:app="<a href="http://schemas.android.com/apk/res-auto">http://schemas.android.com/apk/res-auto</a>" xmlns:tools="<a href="http://schemas.android.com/tools">http://schemas.android.com/tools</a>" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity"> <ListView android:id="@+id/list_view" android:layout_width="match_parent" android:layout_height="match_parent"></ListView> </RelativeLayout> |
Create item_row.xml File Following this Code.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 |
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="<a href="http://schemas.android.com/apk/res/android">http://schemas.android.com/apk/res/android</a>" android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical"> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal" android:layout_margin="10dp"> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/img_view"/> <TextView android:id="@+id/tv_name" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="20dp" android:layout_gravity="center_vertical" /> </LinearLayout> </LinearLayout> |
Create Fruits.java Class Following This Code.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 |
package com.example.bhaumik.listviewcustom; public class Fruits { public String name; int image; public Fruits(String name, int image) { this.name = name; this.image = image; } public String getName() { return name; } public void setName(String name) { this.name = name; } public int getImage() { return image; } public void setImage(int image) { this.image = image; } |
}
Create FruitAdapter.java File Following This Code.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 |
package com.example.bhaumik.listviewcustom; import android.content.Context; import android.support.annotation.NonNull; import android.support.annotation.Nullable; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.ArrayAdapter; import android.widget.CheckBox; import android.widget.ImageView; import android.widget.TextView; import java.util.ArrayList; import java.util.List; public class FruitsAdapter extends ArrayAdapter{ Context context; List<Fruits> list = new ArrayList<>(); public FruitsAdapter(@NonNull Context context, int resource, List<Fruits> list) { super(context, resource, list); this.context = context; this.list = list; list.addAll(list); } @NonNull @Override public View getView(int position, @Nullable View convertView, @NonNull ViewGroup parent) { VersionHolder holder = new VersionHolder(); if (convertView == null){ LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE); convertView = inflater.inflate(R.layout.item_row,null); holder.imageView = convertView.findViewById(R.id.img_view); holder.textView = convertView.findViewById(R.id.tv_name); convertView.setTag(holder); }else{ holder = (VersionHolder) convertView.getTag(); } Fruits fruits = list.get(position); holder.textView.setText(fruits.getName()); holder.imageView.setImageResource(fruits.getImage()); holder.imageView.setTag(list); return convertView; } public static class VersionHolder{ public ImageView imageView; public TextView textView; } |
}
Create MainActivity.java File Following This Code.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 |
package com.example.bhaumik.listviewcustom; import android.support.v4.widget.SwipeRefreshLayout; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.widget.CompoundButton; import android.widget.ListView; import android.widget.Toast; import java.util.ArrayList; import java.util.List; public class MainActivity extends AppCompatActivity { ListView listView; List<Fruits> list = new ArrayList<>(); FruitsAdapter fruitsAdapter; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); listView = findViewById(R.id.list_view); list = new ArrayList<>(); list.add(new Fruits("Apple",R.drawable.apple)); list.add(new Fruits("Banana",R.drawable.banana)); list.add(new Fruits("Strawberry",R.drawable.strawberry)); list.add(new Fruits("Pineapple",R.drawable.pinapple)); list.add(new Fruits("Grape",R.drawable.grapes)); fruitsAdapter = new FruitsAdapter(MainActivity.this,R.layout.item_row,list); listView.setAdapter(fruitsAdapter); } } |

Above the Example of I have create custom layout and custom adapter in listView. Create custom XML file to declared image and textView. |In this layout bind adapter and position wise fetch image from drawable folder and fetch name as a custom list. Now in this adapter to extends of ArrayAdapter. And Pass Fruits class.Fruits class is a getter and setter method of get data and set data in adapter.