Friday, July 11, 2014

Android Multilevel Expandable ListView | Custom Expandable List-view Demo In Android | Android Expandable Listview Example with demo code

Hello Friends,

Today I am going to share code for multilevel  list-view or multilevel expandable list-view, means till 3 stage data selection from a list. like- Country->state->city

Country--India-------------Delhi
               England               Mumbai
               America              Gurganv

For this demo I am using Views, No core android list-view or expandable list-view. Hope it will help to some one.






MainActivity.java


package com.androidhub4you.multilevellistview;

import java.util.ArrayList;

import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.View.OnTouchListener;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.RelativeLayout;
import android.widget.TextView;
import android.widget.Toast;

import com.androidhub4you.multilevellistview.Product.SubCategory;
import com.androidhub4you.multilevellistview.Product.SubCategory.ItemList;
/**
 *
 * @author manish
 *
 */
public class MainActivity extends Activity {
      
       private ArrayList<Product>pProductArrayList;
       private ArrayList<SubCategory>pSubItemArrayList;
       private ArrayList<SubCategory>pSubItemArrayList2;
       private LinearLayout mLinearListView;
       boolean isFirstViewClick=false;
       boolean isSecondViewClick=false;
      
       @Override
       protected void onCreate(Bundle savedInstanceState) {
              super.onCreate(savedInstanceState);
              setContentView(R.layout.activity_main);
              mLinearListView = (LinearLayout) findViewById(R.id.linear_listview);
             
              /**
               *
               */
             
              ArrayList<ItemList> mItemListArray=new ArrayList<ItemList>();
              mItemListArray.add(new ItemList("Red", "20"));
              mItemListArray.add(new ItemList("Blue", "50"));
              mItemListArray.add(new ItemList("Red", "20"));
              mItemListArray.add(new ItemList("Blue", "50"));
             
              ArrayList<ItemList> mItemListArray2=new ArrayList<ItemList>();
              mItemListArray2.add(new ItemList("Pant", "2000"));
              mItemListArray2.add(new ItemList("Shirt", "1000"));
              mItemListArray2.add(new ItemList("Pant", "2000"));
              mItemListArray2.add(new ItemList("Shirt", "1000"));
              mItemListArray2.add(new ItemList("Pant", "2000"));
              mItemListArray2.add(new ItemList("Shirt", "1000"));
             
             
              /**
               *
               */
              pSubItemArrayList=new ArrayList<SubCategory>();
              pSubItemArrayList2=new ArrayList<SubCategory>();
              pSubItemArrayList.add(new SubCategory("Color", mItemListArray));
              pSubItemArrayList2.add(new SubCategory("Cloths", mItemListArray2));
              pSubItemArrayList.add(new SubCategory("Color", mItemListArray));
              pSubItemArrayList2.add(new SubCategory("Cloths", mItemListArray2));
              /**
               *
               */
             
              pProductArrayList=new ArrayList<Product>();
              pProductArrayList.add(new Product("Emotions", pSubItemArrayList));
              pProductArrayList.add(new Product("Garments", pSubItemArrayList2));
             
             
              /***
               * adding item into listview
               */
              for (int i = 0; i < pProductArrayList.size(); i++) {
                    
                     LayoutInflater inflater = null;
                     inflater = (LayoutInflater) getApplicationContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
                     View mLinearView = inflater.inflate(R.layout.row_first, null);
                    
                     final TextView mProductName = (TextView) mLinearView.findViewById(R.id.textViewName);
                     final RelativeLayout mLinearFirstArrow=(RelativeLayout)mLinearView.findViewById(R.id.linearFirst);
                     final ImageView mImageArrowFirst=(ImageView)mLinearView.findViewById(R.id.imageFirstArrow);
                     final LinearLayout mLinearScrollSecond=(LinearLayout)mLinearView.findViewById(R.id.linear_scroll);
                    
                     if(isFirstViewClick==false){
                     mLinearScrollSecond.setVisibility(View.GONE);
                     mImageArrowFirst.setBackgroundResource(R.drawable.arw_lt);
                     }
                     else{
                           mLinearScrollSecond.setVisibility(View.VISIBLE);
                           mImageArrowFirst.setBackgroundResource(R.drawable.arw_down);
                     }
                    
                     mLinearFirstArrow.setOnTouchListener(new OnTouchListener() {
                          
                           @Override
                           public boolean onTouch(View v, MotionEvent event) {
                                 
                                  if(isFirstViewClick==false){
                                         isFirstViewClick=true;
                                         mImageArrowFirst.setBackgroundResource(R.drawable.arw_down);
                                         mLinearScrollSecond.setVisibility(View.VISIBLE);
                                        
                                  }else{
                                         isFirstViewClick=false;
                                         mImageArrowFirst.setBackgroundResource(R.drawable.arw_lt);
                                         mLinearScrollSecond.setVisibility(View.GONE);  
                                  }
                                  return false;
                           }
                     });
                    
                    
                     final String name = pProductArrayList.get(i).getpName();
                     mProductName.setText(name);
                 
                     /**
                      *
                      */
                  for (int j = 0; j < pProductArrayList.get(i).getmSubCategoryList().size(); j++) {
                          
                           LayoutInflater inflater2 = null;
                           inflater2 = (LayoutInflater) getApplicationContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
                           View mLinearView2 = inflater2.inflate(R.layout.row_second, null);
                 
                           TextView mSubItemName = (TextView) mLinearView2.findViewById(R.id.textViewTitle);
                           final RelativeLayout mLinearSecondArrow=(RelativeLayout)mLinearView2.findViewById(R.id.linearSecond);
                           final ImageView mImageArrowSecond=(ImageView)mLinearView2.findViewById(R.id.imageSecondArrow);
                           final LinearLayout mLinearScrollThird=(LinearLayout)mLinearView2.findViewById(R.id.linear_scroll_third);
                          
                           if(isSecondViewClick==false){
                                  mLinearScrollThird.setVisibility(View.GONE);
                                  mImageArrowSecond.setBackgroundResource(R.drawable.arw_lt);
                                  }
                                  else{
                                         mLinearScrollThird.setVisibility(View.VISIBLE);
                                         mImageArrowSecond.setBackgroundResource(R.drawable.arw_down);
                                  }
                                 
                           mLinearSecondArrow.setOnTouchListener(new OnTouchListener() {
                                        
                                         @Override
                                         public boolean onTouch(View v, MotionEvent event) {
                                               
                                                if(isSecondViewClick==false){
                                                       isSecondViewClick=true;
                                                       mImageArrowSecond.setBackgroundResource(R.drawable.arw_down);
                                                       mLinearScrollThird.setVisibility(View.VISIBLE);
                                                      
                                                }else{
                                                       isSecondViewClick=false;
                                                       mImageArrowSecond.setBackgroundResource(R.drawable.arw_lt);
                                                       mLinearScrollThird.setVisibility(View.GONE);   
                                                }
                                                return false;
                                         }
                                  });
                          
                          
                           final String catName = pProductArrayList.get(i).getmSubCategoryList().get(j).getpSubCatName();
                           mSubItemName.setText(catName);
                           /**
                            *
                            */
                             for (int k = 0; k < pProductArrayList.get(i).getmSubCategoryList().get(j).getmItemListArray().size(); k++) {
                                        
                                         LayoutInflater inflater3 = null;
                                         inflater3 = (LayoutInflater) getApplicationContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
                                         View mLinearView3 = inflater3.inflate(R.layout.row_third, null);
                              
                                         TextView mItemName = (TextView) mLinearView3.findViewById(R.id.textViewItemName);
                                         TextView mItemPrice = (TextView) mLinearView3.findViewById(R.id.textViewItemPrice);
                                         final String itemName = pProductArrayList.get(i).getmSubCategoryList().get(j).getmItemListArray().get(k).getItemName();
                                         final String itemPrice = pProductArrayList.get(i).getmSubCategoryList().get(j).getmItemListArray().get(k).getItemPrice();
                                         mItemName.setText(itemName);
                                         mItemPrice.setText(itemPrice);
                                        
                                         mLinearScrollThird.addView(mLinearView3);
                                        
                                         /**
                                          * set click
                                          */
                                        
                                         mLinearView3.setOnClickListener(new OnClickListener() {
                                               
                                                @Override
                                                public void onClick(View v) {
                                                       // TODO Auto-generated method stub
                                                      
                                                       Toast.makeText(MainActivity.this, "clicked item:"+itemName, Toast.LENGTH_SHORT).show();
                                                }
                                         });
                             }
                          
                           mLinearScrollSecond.addView(mLinearView2);
                 
                  }
                 
                  mLinearListView.addView(mLinearView);
              }            
       }

}




Your feedback awaited!
Thanks,
Manish





11 comments:

  1. good for beginners plz keep some content for bluetooth

    ReplyDelete
  2. Is It corre3crt way to define Expandable ListView sir ? here isn't much more thing like childOnClickListener(). onChildSelectd like details so can we use it as expandable ListView ?

    ReplyDelete
    Replies
    1. As we know android does not provide multi level listview so we have to customize it according to our need.

      Delete
  3. Thank you lot sir for your quick reply... means that i can change its Adapter class based on our requirements..?

    ReplyDelete
  4. Actually sir, My project is ready but now i have to perofom context menu on child like Pant, Shirt but i Failed so please give me your valuable suggestion... If yes then please let me know how can i change Adapter class for it... Millions Thnxx in advance

    ReplyDelete
  5. Hi sir,
    I am implementing your code but am facing one problem i.e i want to show clicked child selected and when user clicked another child that become selected and previous become unselected for example..if i select pant the background colour of pant become red and again if i clicked on shirt the pant become unselected and shirt become selected with red background.
    Help me to implement this functionality.

    Thnaks

    ReplyDelete
  6. Hi
    I am implementing your code. I have doubt, how to expand one list at a time when i click remaing should collapse. Please give your comments

    ReplyDelete
    Replies
    1. You need to check status if any list is expand remain list you can collapse. i am not sure but you can use any boolean variable to do this task.

      Delete
  7. Thanks for providing. I'm new at development and I'm still understanding syntax slowly, however your code fitted very well in my application. Could you guide me on how to assign different text color to the main headings (Emotions and Garments) please ? At present they both seem to be using the them from activity_main.xml.

    Many thanks in advance,

    J

    ReplyDelete
  8. Hi Manish, for what I can see the same layout row_third is inflated, no matter which child item is clicked.
    What if, instead, I wanted layout X to be inflated when clicking on color1, layout Y to be inflated when clicking on color2, layout W to be inflated when clicking on color3 and so forth?

    ReplyDelete