ListView with Sections in android.
Hello all……….
We have seen many posts about ListViews like creating a listview, adding data to it, customizing a listview etc.
Take a look at some of these examples
1. Single Selection ListView in android
2. Flitering a ListView using an input from an EditText in Android.
3. How to create a custom ListView in android?
4. Android dialog with ListView.
5. Expandable ListView in ANDROID using SimpleExpandableListAdapter, a simple example.
6. Android listView with icons.
7. Creating scrolling ListView in android.
ListView with sections in android
Today also we will see another customization of listviews.
Today I will show you how to create listviews with sections.
This is the main.xml layout file which contains the ListView.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@drawable/orange"
>
<ListView
android:id="@+id/list1"
android:cacheColorHint="#00000000"
android:scrollbars="none"
android:background="@drawable/bg_transparent"
android:fadingEdge="vertical"
android:soundEffectsEnabled="true"
android:divider="@drawable/green"
android:dividerHeight="1px"
android:padding="0dip"
android:smoothScrollbar="true"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:drawSelectorOnTop="false"
android:layout_marginTop="5dip"
android:layout_marginLeft="5dip"
android:layout_marginRight="5dip"
android:layout_marginBottom="5dip"
android:layout_weight="1"/>
</LinearLayout>
I am using some resources in this, one of which is the “customshape_header.xml” file which is saved in res/drawable directory.
This will ptovide the background for the section header.
customshape_header.xml
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<corners android:radius="3dp" />
<solid android:color="#FFFFFF"/>
<stroke
android:width="1dip"
android:color="#C0C0FF" />
</shape>
Strings.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="app_name">ListView with Sections</string>
<drawable name="white">#ffffff</drawable>
<drawable name="black">#000000</drawable>
<drawable name="green">#347C2C</drawable>
<drawable name="pink">#FF00FF</drawable>
<drawable name="violet">#a020f0</drawable>
<drawable name="grey">#778899</drawable>
<drawable name="red">#C11B17</drawable>
<drawable name="yellow">#FFFF8C</drawable>
<drawable name="PowderBlue">#b0e0e6</drawable>
<drawable name="brown">#2F1700</drawable>
<drawable name="Hotpink">#7D2252</drawable>
<drawable name="orange">#FFA500</drawable>
<drawable name="darkgrey">#606060</drawable>
</resources>
This is the “lv_layout.xml” file which I am using for each row in the listview.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="@+id/l1"
>
</LinearLayout>
Now the main java file which implements the logic for creating the listview with sections.
package com.coderzheaven.pack;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.Collections;
import java.util.List;
import android.app.Activity;
import android.content.Context;
import android.graphics.Color;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.LinearLayout;
import android.widget.ListView;
import android.widget.TextView;
import android.widget.AdapterView.OnItemClickListener;
public class SectionListViewDemo extends Activity {
ListView L1;
myAdapter myadp;
String last_item = "B";
static final String[] labels_array = new String[] {
"Afghanistan", "Albania",
"Bahrain", "Bangladesh",
"Cote d'Ivoire", "Cambodia",
"Estonia", "Ethiopia", "Faeroe Islands",
"Former Yugoslav Republic of Macedonia"
};
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
L1 = (ListView)findViewById(R.id.list1);
myadp = new myAdapter(this,labels_array);
L1.setAdapter(myadp);
L1.setOnItemClickListener(new OnItemClickListener(){
@Override
public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,
long arg3) {
}
});
}
/* The adapter class.... */
class myAdapter extends ArrayAdapter<String>
{
TextView label;
View row;
public myAdapter(Context context,String[] arr)
{
super(context, android.R.layout.simple_list_item_1, arr);
}
public View getView(int position, View convertView, ViewGroup parent)
{
try{
LayoutInflater inflater=getLayoutInflater();
row = inflater.inflate(R.layout.lv_layout, parent, false);
LinearLayout L1 = (LinearLayout)row.findViewById(R.id.l1);
TextView header = new TextView(getApplicationContext());
L1.addView(header);
TextView label = new TextView(getApplicationContext());
L1.addView(label);
System.out.println("LAST : " + last_item);
header.setText(last_item);
label.setText(labels_array[position]);
label.setPadding(4, 1, 1, 1);
L1.setPadding(4, 4, 4, 4);
label.setTextColor(Color.BLACK);
if(!labels_array[position].substring(0,1).equalsIgnoreCase(last_item)){
System.out.println("ADD : " + last_item);
header.setBackgroundResource(R.drawable.customshape_header);
header.setPadding(4, 1, 1, 1);
row.setEnabled(false);
header.setTextColor(Color.BLACK);
header.setText(labels_array[position].substring(0,1));
//label.setVisibility(View.GONE);
//position-=2;
}else{
System.out.println("REM : " + last_item);
header.setVisibility(View.GONE);
}
last_item = labels_array[position].substring(0,1);
}catch(Exception e){
}
return row;
}
}
}
Now its ready to run the application.
Please leave your valuable comments on this post.
