Android开发之多级下拉列表菜单实现(仿美团,淘宝等)

我们在常用的电商或者旅游APP中,例如美团,手机淘宝等等,都能够看的到有那种下拉式的二级列表菜单。具体如图所示:

(应大家需要提供下载地址:)有人说受教了,可有人反应下载不下来!下来不知道怎么打开!我惊了,我自己再去下载,然后导入完全没有问题。我的环境是ubuntu14.04下的Eclipse ADT环境,谷歌标准环境。

上面两张图就是美团的一个二级列表菜单的一个展示。我相信很多人都想开发一个跟它一样的功能放到自己的APP中。好,接下来我们就开始动手,解决它。

1,结构分析

首先,我们给出这个下来菜单需要的组建。我们用线框图来分析。

1)如上图所示,最外围的是一个Activity,顶部包含了一个View的容器,这个容器主要是装载ToggleButton来实现诸如美团里面的“美食,全城,理我最近,刷选”这一行。这一行一点就会弹出对应的下来菜单。

2)下拉菜单是如何实现的呢?,这里我们利用了PopupWindow来实现这一弹出式窗口。然后我们在弹出式窗口里面再定义我们的下来列表项,是单列还是二级菜单,都是由里面来定。

3)不同的菜单,需要一级或者需要二级,在这里根据我的需求而变动。我们在PopupWindow上面加一个自定义的LeftView,或者是MiddleView,RightView。主要是一个ToggleButton,你弹出一个窗口,你就定制一个窗口。

3)视图里面嵌入ListView,就形成了列表项。

好分析就到上面为止,接下来我们一步步的说明实现。

2,项目结构

本项目的项目结构如图所示:

1) Adapter。适配器,主要是为ListView提供数据适配的。

2)MainActivity。主活动页面。

3)ExpandTabView。本项目的核心类,它包含ToggleButton容器和PopupWindow,,是控制弹出窗口的核心类。

4)ViewLeft,ViewMiddle,ViewRight。是弹出里面嵌套的类,实现不同的列表菜单。

3,MainActivity

承载所有元素。看代码比看文字实在。

package com.example.expandtabview;import java.util.ArrayList;import android.app.Activity;import android.os.Bundle;import android.util.Log;import android.view.View;import android.widget.Toast;import com.example.view.ExpandTabView;import com.example.view.ViewLeft;import com.example.view.ViewMiddle;import com.example.view.ViewRight;public class MainActivity extends Activity {private static final String TAG = "MainActivity";private ExpandTabView expandTabView;private ArrayList<View> mViewArray = new ArrayList<View>();private ViewLeft viewLeft;private ViewMiddle viewMiddle;private ViewRight viewRight;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);initView();initVaule();initListener();}private void initView() {Log.d(TAG,"initView");expandTabView = (ExpandTabView) findViewById(R.id.expandtab_view);viewLeft = new ViewLeft(this);viewMiddle = new ViewMiddle(this);viewRight = new ViewRight(this);}private void initVaule() {Log.d(TAG,"initValue");mViewArray.add(viewLeft);mViewArray.add(viewMiddle);mViewArray.add(viewRight);ArrayList<String> mTextArray = new ArrayList<String>();mTextArray.add("距离");mTextArray.add("区域");mTextArray.add("距离");expandTabView.setValue(mTextArray, mViewArray);//将三个下拉列表设置进去expandTabView.setTitle(viewLeft.getShowText(), 0);expandTabView.setTitle(viewMiddle.getShowText(), 1);expandTabView.setTitle(viewRight.getShowText(), 2);}private void initListener() {Log.d(TAG,"initListener");viewLeft.setOnSelectListener(new ViewLeft.OnSelectListener() {@Overridepublic void getValue(String distance, String showText) {Log.d("ViewLeft", "OnSelectListener, getValue");onRefresh(viewLeft, showText);}});viewMiddle.setOnSelectListener(new ViewMiddle.OnSelectListener() {@Overridepublic void getValue(String showText) {Log.d("ViewMiddle","OnSelectListener, getValue");onRefresh(viewMiddle,showText);}});viewRight.setOnSelectListener(new ViewRight.OnSelectListener() {@Overridepublic void getValue(String distance, String showText) {Log.d("ViewRight","OnSelectListener, getValue");onRefresh(viewRight, showText);}});}private void onRefresh(View view, String showText) {Log.d(TAG,"onRefresh,view:"+view+",showText:"+showText);expandTabView.onPressBack();int position = getPositon(view);if (position >= 0 && !expandTabView.getTitle(position).equals(showText)) {expandTabView.setTitle(showText, position);}Toast.makeText(MainActivity.this, showText, Toast.LENGTH_SHORT).show();}private int getPositon(View tView) {Log.d(TAG,"getPosition");for (int i = 0; i < mViewArray.size(); i++) {if (mViewArray.get(i) == tView) {return i;}}return -1;}@Overridepublic void onBackPressed() {if (!expandTabView.onPressBack()) {finish();}}}4 ,ExpandTabView世界没有永久的冬天;不要讨厌麻烦,

Android开发之多级下拉列表菜单实现(仿美团,淘宝等)

相关文章:

你感兴趣的文章:

标签云: