android中用ExpandableListView实现三级扩展列表

标签：android   style   blog   http   io   ar   color   os   使用   

 工作中遇到一个选择车型的问题，需要在扩展列表中选择车辆品牌->车型->年款，所以必须得使用三级的扩展列表来实现，而且第三级还得使用GridView来展示。下面就一步步来吧。


       1.定义需要使用的车型类，每个车辆品牌下面包含n个车型，每个车型下面包含n个年款

点击(此处)折叠或打开

1. /**
   

2.  * 汽车的品牌类
   

3.  * 
   

4.  * @author liyanshun 2014-2-21
   

5.  */
   

6. public class CarBrand {
   

7.     /**
   

8.      * 汽车的品牌名字
   

9.      */
   

10.     public String mBrandName;
    

11.     public String mSortLetters;
    

12.     /** 该品牌下包含的汽车类型 */
    

13.     public ArrayList<CarStyle> mCarStyleList;
    

14. }
    

15. 
    

16. /**
    

17.  * 汽车车类型
    

18.  * 
    

19.  * @author liyanshun 2014-2-26
    

20.  */
    

21. public class CarStyle {
    

22.     /** 汽车的类型名 */
    

23.     public String mStyleName;
    

24.     /** 该类型下包含的年款 */
    

25.     public ArrayList<String> mModelList;
    

26. }

      2.列表要可以按照首字母快速定位，这个功能参考了别人的实现，详情见这篇博客：http://blog.csdn.net/xiaanming/article/details/12684155

      3.实现第一级扩展列表。第一级比较好实现，只用使用一个ExpandableListView，并定义Adapter就可以了。需要注意的是每个品牌下面的子View个数即为其包含的车型个数，而每个车型都是一个新                                   的ExpandableListView。当然也可以使用一个ExpandableListView来展示所有的车型，但是那样的话会导致点击靠下的车型时，其后面的车型可能会被后一项的品牌给覆盖掉。所以在这里使用多了多                                个ExpandableListView。Adapter的实现如下：

点击(此处)折叠或打开

1. /**
   

2.  * 用来选择车辆品牌并且带字母排序的adapter
   

3.  * 
   

4.  * @author liyanshun 2014-2-21
   

5.  */
   

6. public class CarBrandAdapter extends BaseExpandableListAdapter implements
   

7.         SectionIndexer {
   

8.     private List<CarBrand> mBrandList = null;
   

9.     private Context mContext;
   

10. 
    

11.     public CarBrandAdapter(Context mContext, List<CarBrand> list) {
    

12.         this.mContext = mContext;
    

13.         this.mBrandList = list;
    

14.     }
    

15. 
    

16.     /**
    

17.      * 当ListView数据发生变化时,调用此方法来更新ListView
    

18.      * 
    

19.      * @param mBrandList
    

20.      */
    

21.     public void updateListView(List<CarBrand> list) {
    

22.         this.mBrandList = list;
    

23.         notifyDataSetChanged();
    

24.     }
    

25. 
    

26.     public int getCount() {
    

27.         return this.mBrandList.size();
    

28.     }
    

29. 
    

30.     public Object getItem(int position) {
    

31.         return mBrandList.get(position);
    

32.     }
    

33. 
    

34.     public long getItemId(int position) {
    

35.         return position;
    

36.     }
    

37. 
    

38.     final static class ViewHolder {
    

39.         TextView tvLetter;
    

40.         TextView tvTitle;
    

41.         ImageView carBrand;
    

42.         ImageView close;
    

43.         View body;
    

44.         View titleBar;
    

45.     }
    

46. 
    

47.     final static class CarStyleViewHolder {
    

48.         ExpandableListView styleList;
    

49.     }
    

50. 
    

51.     /**
    

52.      * 根据ListView的当前位置获取分类的首字母的Char ascii值
    

53.      */
    

54.     public int getSectionForPosition(int position) {
    

55.         return mBrandList.get(position).mSortLetters.charAt(0);
    

56.     }
    

57. 
    

58.     /**
    

59.      * 根据分类的首字母的Char ascii值获取其第一次出现该首字母的位置
    

60.      */
    

61.     public int getPositionForSection(int section) {
    

62.         for (int i = 0; i < getCount(); i++) {
    

63.             String sortStr = mBrandList.get(i).mSortLetters;
    

64.             char firstChar = sortStr.toUpperCase().charAt(0);
    

65.             if (firstChar == section) {
    

66.                 return i;
    

67.             }
    

68.         }
    

69. 
    

70.         return -1;
    

71.     }
    

72. 
    

73.     /**
    

74.      * 提取英文的首字母，非英文字母用#代替。
    

75.      * 
    

76.      * @param str
    

77.      * @return
    

78.      */
    

79.     private String getAlpha(String str) {
    

80.         String sortStr = str.trim().substring(0, 1).toUpperCase();
    

81.         // 正则表达式，判断首字母是否是英文字母
    

82.         if (sortStr.matches("[A-Z]")) {
    

83.             return sortStr;
    

84.         } else {
    

85.             return "#";
    

86.         }
    

87.     }
    

88. 
    

89.     @Override
    

90.     public Object[] getSections() {
    

91.         return null;
    

92.     }
    

93. 
    

94.     @Override
    

95.     public int getGroupCount() {
    

96.         return mBrandList == null ? 0 : mBrandList.size();
    

97.     }
    

98. 
    

99.     @Override
    

100.     public int getChildrenCount(int groupPosition) {
     

101.         return mBrandList == null ? 0
     

102.                 : (mBrandList.get(groupPosition) == null ? 0 : (mBrandList
     

103.                         .get(groupPosition).mCarStyleList == null ? 0
     

104.                         : mBrandList.get(groupPosition).mCarStyleList.size()));
     

105.     }
     

106. 
     

107.     @Override
     

108.     public Object getGroup(int groupPosition) {
     

109.         return mBrandList.get(groupPosition);
     

110.     }
     

111. 
     

112.     @Override
     

113.     public Object getChild(int groupPosition, int childPosition) {
     

114.         return mBrandList.get(groupPosition).mCarStyleList.get(childPosition);
     

115.     }
     

116. 
     

117.     @Override
     

118.     public long getGroupId(int groupPosition) {
     

119.         return groupPosition;
     

120.     }
     

121. 
     

122.     @Override
     

123.     public long getChildId(int groupPosition, int childPosition) {
     

124.         return groupPosition;
     

125.     }
     

126. 
     

127.     @Override
     

128.     public boolean hasStableIds() {
     

129.         return false;
     

130.     }
     

131. 
     

132.     @Override
     

133.     public View getGroupView(int groupPosition, boolean isExpanded,
     

134.             View convertView, ViewGroup parent) {
     

135.         ViewHolder viewHolder = null;
     

136.         final CarBrand mContent = mBrandList.get(groupPosition);
     

137.         if (convertView == null) {
     

138.             viewHolder = new ViewHolder();
     

139.             convertView = LayoutInflater.from(mContext).inflate(
     

140.                     R.layout.car_brand_item, null);
     

141.             viewHolder.tvTitle = (TextView) convertView
     

142.                     .findViewById(R.id.title);
     

143.             viewHolder.tvLetter = (TextView) convertView
     

144.                     .findViewById(R.id.catalog);
     

145.             viewHolder.carBrand = (ImageView) convertView
     

146.                     .findViewById(R.id.item_img);
     

147.             viewHolder.close = (ImageView) convertView
     

148.                     .findViewById(R.id.close_img);
     

149.             viewHolder.body = convertView.findViewById(R.id.item_body);
     

150.             viewHolder.titleBar = convertView.findViewById(R.id.title_bar);
     

151.             convertView.setTag(viewHolder);
     

152.         } else {
     

153.             viewHolder = (ViewHolder) convertView.getTag();
     

154.         }
     

155. 
     

156.         // 根据position获取分类的首字母的Char ascii值
     

157.         int section = getSectionForPosition(groupPosition);
     

158. 
     

159.         // 如果当前位置等于该分类首字母的Char的位置 ，则认为是第一次出现
     

160.         if (groupPosition == getPositionForSection(section)) {
     

161.             viewHolder.titleBar.setVisibility(View.VISIBLE);
     

162.             viewHolder.tvLetter.setText(mContent.mSortLetters);
     

163.         } else {
     

164.             viewHolder.titleBar.setVisibility(View.GONE);
     

165.         }
     

166. 
     

167.         viewHolder.tvTitle
     

168.                 .setText(this.mBrandList.get(groupPosition).mBrandName);
     

169. 
     

170.         if (isExpanded) {
     

171.             viewHolder.close.setVisibility(View.VISIBLE);
     

172.         } else {
     

173.             viewHolder.close.setVisibility(View.GONE);
     

174.         }
     

175. 
     

176.         return convertView;
     

177. 
     

178.     }
     

179. 
     

180.     @Override
     

181.     public View getChildView(int groupPosition, int childPosition,
     

182.             boolean isLastChild, View convertView, ViewGroup parent) {
     

183.         CarStyleAdapter carStyleAdapter = new CarStyleAdapter(mContext,
     

184.                 mBrandList.get(groupPosition).mCarStyleList.get(childPosition));
     

185.         CustExpListview SecondLevelexplv = new CustExpListview(mContext);
     

186.         SecondLevelexplv.setAdapter(carStyleAdapter);
     

187.         SecondLevelexplv.setGroupIndicator(null);
     

188.         return SecondLevelexplv;
     

189.     }
     

190. 
     

191.     @Override
     

192.     public boolean isChildSelectable(int groupPosition, int childPosition) {
     

193.         return true;
     

194.     }
     

195. 
     

196.     public class CustExpListview extends ExpandableListView {
     

197. 
     

198.         public CustExpListview(Context context) {
     

199.             super(context);
     

200.         }
     

201. 
     

202.         protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
     

203.             widthMeasureSpec = MeasureSpec.makeMeasureSpec(960,
     

204.                     MeasureSpec.AT_MOST);
     

205.             heightMeasureSpec = MeasureSpec.makeMeasureSpec(600,
     

206.                     MeasureSpec.AT_MOST);
     

207.             super.onMeasure(widthMeasureSpec, heightMeasureSpec);
     

208.         }
     

209.     }
     

210. }

点击(此处)折叠或打开

1. /**
   

2.  * 显示车型和年款的adapter
   

3.  * 
   

4.  * @author liyanshun 2014-2-27
   

5.  */
   

6. public class CarStyleAdapter extends BaseExpandableListAdapter implements
   

7.         OnItemClickListener {
   

8.     private static final String TAG = "CarStyleAdapter";
   

9.     private CarStyle mCarStyle = null;
   

10.     private Context mContext;
    

11. 
    

12.     public CarStyleAdapter(Context mContext, CarStyle carStyle) {
    

13.         this.mContext = mContext;
    

14.         this.mCarStyle = carStyle;
    

15.     }
    

16. 
    

17.     @Override
    

18.     public int getGroupCount() {
    

19.         return mCarStyle == null ? 0 : 1;
    

20.     }
    

21. 
    

22.     @Override
    

23.     public int getChildrenCount(int groupPosition) {
    

24.         //只显示一个Child，否则会造成GridView的重复显示
    

25.         return mCarStyle == null ? 0 : (mCarStyle.mModelList == null ? 0 : 1);
    

26.     }
    

27. 
    

28.     @Override
    

29.     public Object getGroup(int groupPosition) {
    

30.         return mCarStyle;
    

31.     }
    

32. 
    

33.     @Override
    

34.     public Object getChild(int groupPosition, int childPosition) {
    

35.         return mCarStyle.mModelList.get(childPosition);
    

36.     }
    

37. 
    

38.     @Override
    

39.     public long getGroupId(int groupPosition) {
    

40.         return groupPosition;
    

41.     }
    

42. 
    

43.     @Override
    

44.     public long getChildId(int groupPosition, int childPosition) {
    

45.         return groupPosition;
    

46.     }
    

47. 
    

48.     @Override
    

49.     public boolean hasStableIds() {
    

50.         return false;
    

51.     }
    

52. 
    

53.     @Override
    

54.     public View getGroupView(int groupPosition, boolean isExpanded,
    

55.             View convertView, ViewGroup parent) {
    

56.         Logger.d(TAG, "groupPosition:" + groupPosition);
    

57.         ViewHolder viewHolder = null;
    

58.         if (convertView == null) {
    

59.             viewHolder = new ViewHolder();
    

60.             convertView = LayoutInflater.from(mContext).inflate(
    

61.                     R.layout.car_style_item, null);
    

62.             viewHolder.tvTitle = (TextView) convertView
    

63.                     .findViewById(R.id.style_name);
    

64.             viewHolder.bottmLine = (View) convertView
    

65.                     .findViewById(R.id.style_bottom_line);
    

66.             viewHolder.styleArrow = (ImageView) convertView
    

67.                     .findViewById(R.id.style_arrow);
    

68.             viewHolder.closeView = (ImageView) convertView
    

69.                     .findViewById(R.id.style_close_img);
    

70.             convertView.setTag(viewHolder);
    

71.         } else {
    

72.             viewHolder = (ViewHolder) convertView.getTag();
    

73.         }
    

74.         viewHolder.tvTitle.setText(mCarStyle.mStyleName);
    

75.         if (isExpanded) {
    

76.             viewHolder.styleArrow.setVisibility(View.VISIBLE);
    

77.             viewHolder.closeView.setVisibility(View.VISIBLE);
    

78.         } else {
    

79.             viewHolder.styleArrow.setVisibility(View.GONE);
    

80.             viewHolder.closeView.setVisibility(View.GONE);
    

81.         }
    

82.         return convertView;
    

83.     }
    

84. 
    

85.     @Override
    

86.     public View getChildView(int groupPosition, int childPosition,
    

87.             boolean isLastChild, View convertView, ViewGroup parent) {
    

88.         GridView gridView = null;
    

89.         if (convertView == null) {
    

90.             LayoutInflater layoutInflater = (LayoutInflater) mContext
    

91.                     .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    

92.             convertView = layoutInflater.inflate(R.layout.car_model_grid, null);
    

93. 
    

94.             gridView = (GridView) convertView.findViewById(R.id.gridview);
    

95.             gridView.setNumColumns(2);// 设置每行列数
    

96.             gridView.setGravity(Gravity.CENTER);// 位置居中
    

97.             gridView.setHorizontalSpacing(10);// 水平间隔
    

98. 
    

99.             gridView.setAdapter(new GridAdapter());
    

100. 
     

101.             //计算并设置gridView的高度
     

102.             final int rowHeightDp = 40;
     

103.             final float ROW_HEIGHT = mContext.getResources()
     

104.                     .getDisplayMetrics().density * rowHeightDp;
     

105.             double size = mCarStyle.mModelList.size();
     

106.             int rowCount = (int) Math.ceil(size/2);
     

107.             final int GRID_HEIGHT = (int) (ROW_HEIGHT * rowCount);
     

108.             gridView.getLayoutParams().height = GRID_HEIGHT;
     

109.             gridView.setOnItemClickListener(this);
     

110.         }
     

111. 
     

112.         return convertView;
     

113. 
     

114.     }
     

115. 
     

116.     @Override
     

117.     public boolean isChildSelectable(int groupPosition, int childPosition) {
     

118.         return true;
     

119.     }
     

120. 
     

121.     final static class ViewHolder {
     

122.         TextView tvTitle;
     

123.         View bottmLine;
     

124.         ImageView styleArrow;
     

125.         ImageView closeView;
     

126.     }
     

127. 
     

128.     private class GridAdapter extends BaseAdapter {
     

129.         @Override
     

130.         public int getCount() {
     

131.             return mCarStyle.mModelList.size();
     

132.         }
     

133. 
     

134.         @Override
     

135.         public Object getItem(int position) {
     

136.             return mCarStyle.mModelList.get(position);
     

137.         }
     

138. 
     

139.         @Override
     

140.         public long getItemId(int position) {
     

141.             return 0;
     

142.         }
     

143. 
     

144.         @Override
     

145.         public View getView(int position, View convertView, ViewGroup parent) {
     

146.             ViewHolder viewHolder = null;
     

147.             if (convertView == null) {
     

148.                 viewHolder = new ViewHolder();
     

149.                 convertView = LayoutInflater.from(mContext).inflate(
     

150.                         R.layout.car_model_item, null);
     

151.                 viewHolder.tvTitle = (TextView) convertView
     

152.                         .findViewById(R.id.name);
     

153.                 convertView.setTag(viewHolder);
     

154.             } else {
     

155.                 viewHolder = (ViewHolder) convertView.getTag();
     

156.             }
     

157.             viewHolder.tvTitle.setText((mCarStyle.mModelList.get(position)));
     

158.             return convertView;
     

159.         }
     

160. 
     

161.     }
     

162. 
     

163.     @Override
     

164.     public void onItemClick(AdapterView<?> parent, View view, int position,
     

165.             long id) {
     

166.         Toast.makeText(mContext, "" + position, Toast.LENGTH_SHORT).show();
     

167.     }
     

168. }

点击(此处)折叠或打开

1. /**
   

2.  * 选择汽车品牌
   

3.  * 
   

4.  * @author liyanshun 2014-2-21
   

5.  */
   

6. public class SelectBrandFragment extends FatherFragment implements
   

7.         OnClickListener, OnItemClickListener {
   

8.     private static final String TAG = "SelectBrandFragment";
   

9.     private ExpandableListView mSortListView;
   

10.     private SideBar mSideBar;
    

11.     private TextView mDialog;
    

12.     private CarBrandAdapter mAdapter;
    

13.     /**
    

14.      * 汉字转换成拼音的类
    

15.      */
    

16.     private CharacterParser characterParser;
    

17.     private List<CarBrand> SourceDateList;
    

18. 
    

19.     /**
    

20.      * 根据拼音来排列ListView里面的数据类
    

21.      */
    

22.     private PinyinComparator pinyinComparator;
    

23. 
    

24.     String[] data={"奥迪","宝马","奔驰","雪铁龙","大众","牧马人"};
    

25.     @Override
    

26.     public void onStart() {
    

27.         super.onStart();
    

28.         Logger.d(TAG,"onStart");
    

29.         //已经设置过layout了，无需再次设定
    

30.         if(mLayoutAdded){
    

31.             return;
    

32.         }
    

33.         super.setLayout(R.layout.select_brand);
    

34.         mSortListView = (ExpandableListView) mBodyView.findViewById(R.id.lv);
    

35.         mSideBar = (SideBar) mBodyView.findViewById(R.id.sidrbar);
    

36.         mDialog = (TextView) mBodyView.findViewById(R.id.dialog);
    

37.         mSideBar.setTextView(mDialog);
    

38.         mTitle.setText(R.string.select_brand);
    

39.         mRightTitle.setText(R.string.jump);
    

40.         mRightTitle.setOnClickListener(this);
    

41. 
    

42.         // 实例化汉字转拼音类
    

43.         characterParser = CharacterParser.getInstance();
    

44.         pinyinComparator = new PinyinComparator();
    

45. 
    

46.         mSortListView.setOnItemClickListener(this);
    

47.         // 设置右侧触摸监听
    

48.         mSideBar.setOnTouchingLetterChangedListener(new OnTouchingLetterChangedListener() {
    

49. 
    

50.             @Override
    

51.             public void onTouchingLetterChanged(String s) {
    

52.                 // 该字母首次出现的位置
    

53.                 int position = mAdapter.getPositionForSection(s.charAt(0));
    

54.                 if (position != -1) {
    

55.                     mSortListView.setSelection(position);
    

56.                 }
    

57. 
    

58.             }
    

59.         });
    

60. 
    

61.          SourceDateList = filledData(data);
    

62. //        
    

63. //        // 根据a-z进行排序源数据
    

64.         Collections.sort(SourceDateList, pinyinComparator);
    

65.         mAdapter = new CarBrandAdapter(mContext, SourceDateList);
    

66. //        CarStyleAdapter carStyleAdapter=new CarStyleAdapter(mContext,SourceDateList.get(2).mCarStyleList);
    

67.         mSortListView.setAdapter(mAdapter);
    

68.     }
    

69. 
    

70.     @Override
    

71.     public void onClick(View v) {
    

72.         int id = v.getId();
    

73.         switch (id) {
    

74.         case R.id.right_button:
    

75.             Logger.d(TAG,"rightbutton");
    

76.             break;
    

77.         }
    

78. 
    

79.     }
    

80. 
    

81.     @Override
    

82.     public void onItemClick(AdapterView<?> parent, View view, int position,
    

83.             long id) {
    

84.         Logger.d(TAG,"onItemClick:"+position);
    

85. 
    

86.     }
    

87.     
    

88.     /**
    

89.      * 为ListView填充数据
    

90.      * @param date
    

91.      * @return
    

92.      */
    

93.     private List<CarBrand> filledData(String [] date){
    

94.         List<CarBrand> mBrandList = new ArrayList<CarBrand>();
    

95.         for(int i=0; i<date.length; i++){
    

96.             CarBrand carBrand = new CarBrand();
    

97.             carBrand.mBrandName=date[i];
    

98.             //汉字转换成拼音
    

99.             String pinyin = characterParser.getSelling(date[i]);
    

100.             String sortString = pinyin.substring(0, 1).toUpperCase();
     

101.             
     

102.             // 正则表达式，判断首字母是否是英文字母
     

103.             if(sortString.matches("[A-Z]")){
     

104.                 carBrand.mSortLetters=sortString.toUpperCase();
     

105.             }else{
     

106.                 carBrand.mSortLetters="#";
     

107.             }
     

108.             ArrayList<CarStyle> mStyleList = new ArrayList<CarStyle>();
     

109.             for(int j=0;j<=i;j++){
     

110.                 CarStyle carStyle=new CarStyle();
     

111.                 carStyle.mStyleName=date[i]+"201"+j;
     

112.                 ArrayList<String> mModelList = new ArrayList<String>();
     

113.                 for(int k=0;k<=j;k++){
     

114.                     mModelList.add(carStyle.mStyleName+":"+"手动款");
     

115.                 }
     

116.                 carStyle.mModelList=mModelList;
     

117.                 mStyleList.add(carStyle);
     

118.             }
     

119.             carBrand.mCarStyleList=mStyleList;
     

120.             mBrandList.add(carBrand);
     

121.         }
     

122.         return mBrandList;
     

123.         
     

124.     }
     

125. }

android中用ExpandableListView实现三级扩展列表

标签：android   style   blog   http   io   ar   color   os   使用   

原文地址：http://my.oschina.net/fuckboogie/blog/346411