Header section in ListView
ListView is a view group that displays a list of scrollable items. The list items are automatically inserted to the list using an Adapter that pulls content from a source such as an array or database query and converts each item result into a view that's placed into the list.
Lets see how to create like that using
ListView .
Step 1: Create Project
a) Open Android Studio
b) Go to File >New> New Project > Project Name > Next > Next > Next > Finish
Step 2 : Layout Design
open activity_main.xml file and add the bellow code
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ff33b5e5">
<ListView
android:id="@+id/list"
android:layout_width="match_parent"
android:layout_height="wrap_content">
</ListView>
</RelativeLayout>
Step 3 : Header file
create a file "adapter_header_list.xml" and add the bellow code
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="5dp"
android:orientation="vertical">
<TextView
android:id="@+id/tvHeader"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="3dp"
android:textColor="#CC25CC"
android:gravity="center"
android:textSize="17dp"
android:textStyle="bold"
android:text="asf"/>
</LinearLayout>
</RelativeLayout>
Step 4 : Content file of each header
create a file "adapter_content_list.xml" and add the bellow code
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="5dp"
android:orientation="vertical">
<TextView
android:id="@+id/tvContent"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="3dp"
android:textColor="#000000"
android:text=""/>
</LinearLayout>
</RelativeLayout>
Step 5: Model class (ModelHeaderList.java)
Create a class "ModelHeaderList.java" and add the bellow code.
/**
* Created by anupam on 12/10/16.
*/
public class ModelHeaderList {
String name ;
boolean isHeader;
public ModelHeaderList(String _name,boolean _isHeader){
name=_name;
isHeader=_isHeader;
}
public String getName() {
return name;
}
public boolean isHeader() {
return isHeader;
}
}
Step 6 : Code
open MainActivity class and add the bellow code
import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.widget.ListView;
import java.util.ArrayList;
import app.demo.utils.ModelHeaderList;
/**
* Created by anupam on 12/10/16.
*/
public class MainActivity extends Activity{
Context context;
ListView listView;
ArrayList<ModelHeaderList> list;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
context = this;
list = new ArrayList<ModelHeaderList>();
// initialize listview
listView = (ListView) findViewById(R.id.list);
list.add(new ModelHeaderList("Friends",true));
list.add(new ModelHeaderList("Anup",false));
list.add(new ModelHeaderList("Aman",false));
list.add(new ModelHeaderList("Ankit",false));
list.add(new ModelHeaderList("Ajay",false));
list.add(new ModelHeaderList("Suman",false));
list.add(new ModelHeaderList("Sumit",false));
list.add(new ModelHeaderList("Language",true));
list.add(new ModelHeaderList("Bengali",false));
list.add(new ModelHeaderList("Hindi",false));
list.add(new ModelHeaderList("English",false));
list.add(new ModelHeaderList("Fruit",true));
list.add(new ModelHeaderList("Apple",false));
list.add(new ModelHeaderList("Mango",false));
list.add(new ModelHeaderList("Banana",false));
AdapterHeaderList adapter = new AdapterHeaderList(context, list);
// set adapter to listview
listView.setAdapter(adapter);
}
}
Step 7 : Adapter class
Create a class "AdapterHeaderList.java" and add the bellow code.
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.TextView;
import java.util.ArrayList;
import app.demo.utils.ModelHeaderList;
/**
* Created by anupam on 12/10/16.
*/
public class AdapterHeaderList extends BaseAdapter {
Context context;
ArrayList<ModelHeaderList> _list;
LayoutInflater inflater = null;
public AdapterHeaderList(Context context, ArrayList<ModelHeaderList> _list) {
this.context = context;
this._list = _list;
inflater = (LayoutInflater) context.
getSystemService(Context.LAYOUT_INFLATER_SERVICE);
}
@Override
public int getCount() {
return _list.size();
}
@Override
public Object getItem(int position) {
return _list.get(position);
}
@Override
public long getItemId(int position) {
return 0;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
View rowView=null;
ModelHeaderList list = _list.get(position);
if(list.isHeader()){
rowView = inflater.inflate(R.layout.adapter_header_list, null);
TextView tvHeader = (TextView) rowView.findViewById(R.id.tvHeader);
tvHeader.setText(list.getName());
}else {
rowView = inflater.inflate(R.layout.adapter_content_list, null);
TextView tvContent = (TextView) rowView.findViewById(R.id.tvContent);
tvContent.setText(list.getName());
}
return rowView;
}
}
Output :
Comments
Post a Comment