当前位置: 代码迷 >> Android >> android 粗鲁简单仿美团/大众点评搜索方式,详细标注
  详细解决方案

android 粗鲁简单仿美团/大众点评搜索方式,详细标注

热度:94   发布时间:2016-04-27 23:14:21.0
android 粗暴简单仿美团/大众点评搜索方式,详细标注

转载请注明出处王亟亟的大牛之路

美团和大众点评的搜索和筛选栏,不能说好看(审美flag),但是满足了我们的搜索还筛选的需求,所以今天就实现了下这样的一个小Demo

项目结构:运行效果就是下图了,就不再截图了
这里写图片描述

初始化的样子:
这里写图片描述

具体实现就是起初3个LinearLayout,点击之后出现一个ListView然后会根据对这个LisvView的点击可能会再出现下一级别的子菜单。

废话不多说,直接上代码
MainActivity

public class MainActivity extends Activity implements OnClickListener,OnDismissListener{    private ImageView icon1, icon2, icon3;    private TextView fenlei, diqu, paixu;    private LinearLayout ll_top;    private LinearLayout ll_fenlei, ll_diqu, ll_paixu;    private ListView lv1, lv2,lv3, lv4;    private LinearLayout ll2;    private PopupWindow popLeft,popMid,popRight;    private List<father> fatlist;    private List<son> sonlist,sonlist1,sonlist2,sonlist3,sonlist4;    private List<son> right;    private int screenWidth;    private int screenHeight;    private MyAdapterLeft adapterleft;    private MyAdapterSon adapterleftson;    private MyAdapterRight adapterRight;    private int imaPosition;//选中的    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        initScreenWidth();        intifatherlist();           intiView();    }    private void intiView() {        ll_top =(LinearLayout) findViewById(R.id.ll_layout);        ll_fenlei = (LinearLayout) findViewById(R.id.ll_quyu);        ll_diqu = (LinearLayout) findViewById(R.id.ll_jiage);        ll_paixu = (LinearLayout) findViewById(R.id.ll_huxing);        fenlei = (TextView) findViewById(R.id.fenlei);        diqu  = (TextView) findViewById(R.id.diqu);        paixu = (TextView) findViewById(R.id.paixu);        icon1 = (ImageView) findViewById(R.id.icon1);        icon2 = (ImageView) findViewById(R.id.icon2);        icon3 = (ImageView) findViewById(R.id.icon3);        ll_fenlei.setOnClickListener(this);        ll_diqu.setOnClickListener(this);        ll_paixu.setOnClickListener(this);          getPopLeft();        getPopRight();    }    /**初始化父类和子类*/    private void intifatherlist() {        fatlist = new ArrayList<father>();        sonlist = new ArrayList<son>();        sonlist1 = new ArrayList<son>();        sonlist2 = new ArrayList<son>();        sonlist3 = new ArrayList<son>();        sonlist4 = new ArrayList<son>();        for (int i = 0; i < 5; i++) {            son s = new son();            s.setId(i+"");            s.setName("子菜单"+i);            sonlist.add(s);        }        for (int i = 0; i < 15; i++) {            son s = new son();            s.setId(i+"");            s.setName("子菜单"+i);            sonlist1.add(s);        }        for (int i = 0; i < 5; i++) {            son s = new son();            s.setId(i+"");            s.setName("子菜单"+i);            sonlist2.add(s);        }        for (int i = 0; i < 6; i++) {            son s = new son();            s.setId(i+"");            s.setName("子菜单"+i);            sonlist3.add(s);        }        for (int i = 0; i < 13; i++) {            son s = new son();            s.setId(i+"");            s.setName("子菜单"+i);            sonlist4.add(s);        }        /**初始化父类*/        for (int i = 0; i < 5; i++) {            father father = new father();            father.setId(i+"");            father.setName("主菜单"+i);            if (i==0) {                father.setImage(R.drawable.ic_category_all);                father.setSonList(null);            }            if (i==1) {                father.setImage(R.drawable.ic_category_entertainment);                father.setSonList(sonlist1);            }            if (i==2) {                father.setImage(R.drawable.ic_category_food);                father.setSonList(sonlist2);            }            if (i==3) {                father.setImage(R.drawable.ic_category_health);                 father.setSonList(sonlist3);            }            if (i==4) {                father.setImage(R.drawable.ic_category_hot);                father.setSonList(sonlist4);            }            fatlist.add(father);        }    }    /**     * @Title: initScreenWidth     * @Description: 查看自身的宽高     * @author yimei     * @return void 返回类型     */    private void initScreenWidth() {        DisplayMetrics dm = new DisplayMetrics();        dm = getResources().getDisplayMetrics();        screenHeight = dm.heightPixels;        screenWidth = dm.widthPixels;    }    @Override    public void onClick(View v) {        switch (v.getId()) {        case R.id.ll_quyu:            getPopLeft();            popLeft.showAsDropDown(ll_top);            break;        case R.id.ll_jiage:            break;        case R.id.ll_huxing:            getPopRight();            popRight.showAsDropDown(ll_top);            break;        }    }    @Override    public void onDismiss() {    }    /***获取PopupWindow实例 .分类*/     private void getPopLeft() {     if (null != popLeft) {         popLeft.dismiss();         return ;     } else {    //初始化分类弹窗        initPopLeft();    }}     /***获取PopupWindow实例 .分类*/     private void getPopRight() {     if (null != popRight) {         popRight.dismiss();         return ;     } else {    //初始化分类弹窗        initPopRight();    }}     /**     * 创建分类弹出PopupWindow     */     protected void initPopLeft() {     // 获取自定义布局文件pop.xml的视图     View left_view = getLayoutInflater().inflate            (R.layout.popleft, null, false);     left_view.setFocusable(true); // 这个很重要    left_view.setFocusableInTouchMode(true);    // PopupWindow(布局,宽度,高度)    popLeft = new PopupWindow(left_view,screenWidth, screenHeight, true);    popLeft.setFocusable(true);    // 重写onKeyListener,按返回键消失    left_view.setOnKeyListener(new OnKeyListener() {        @Override        public boolean onKey(View v, int keyCode, KeyEvent event) {            if (keyCode == KeyEvent.KEYCODE_BACK) {                popLeft.dismiss();                //为空的话就会重新构建不会保留//              popLeft = null;                return true;            }            return false;        }    });    // 设置动画效果 //  popupWindow.setAnimationStyle(R.style.AnimationFade);     //点击其他地方消失     left_view.setOnTouchListener(new OnTouchListener() {     @Override     public boolean onTouch(View v, MotionEvent event) {     if (popLeft != null && popLeft.isShowing()) {         popLeft.dismiss();      }     return false;   }});     // pop.xml视图里面的控件     lv1 = (ListView) left_view.findViewById(R.id.lv1);     lv2 = (ListView) left_view.findViewById(R.id.lv2);     ll2 = (LinearLayout) left_view.findViewById(R.id.ll2);    adapterleft = new MyAdapterLeft(MainActivity.this, fatlist);    lv1.setAdapter(adapterleft);    //listview的监听    lv1.setOnItemClickListener(new OnItemClickListener() {    @Override    public void onItemClick(AdapterView<?> arg0, View arg1, int position,            long arg3) {        adapterleft.setSelectItem(position);        imaPosition = position;        adapterleft.notifyDataSetChanged();        adapterleftson =new MyAdapterSon(MainActivity.this,                fatlist.get(position).getSonList());        lv2.setAdapter(adapterleftson);             //二维数组里面有元素        if (fatlist.get(position).getSonList()!=null) {            //不为空才显示            lv2.setVisibility(View.VISIBLE);            lv2.setOnItemClickListener(new OnItemClickListener() {                @Override                public void onItemClick(AdapterView<?> parent,                        View view, int position, long id) {                    //变色效果                    adapterleftson.setSelectItem(position);                    String name =                    adapterleftson.getItem(position).getName();                    setHeadText(1, name,fatlist.get(imaPosition).getImage());                    popLeft.dismiss();                }            });        //没元素           } else {            // 当没有下级时直接将信息设置textview中            String name = fatlist.get(position).getName();            int img = fatlist.get(position).getImage();            //第一个都是1            setHeadText(1, name,img);            popLeft.dismiss();        }    }});    }    /**最右边的弹窗,排序*/    protected void initPopRight() {         // 获取自定义布局文件pop.xml的视图         View left_right = getLayoutInflater().inflate                (R.layout.popright, null, false);         left_right.setFocusable(true); // 这个很重要        left_right.setFocusableInTouchMode(true);        // PopupWindow(布局,宽度,高度)        popRight = new PopupWindow(left_right,screenWidth, screenHeight, true);        popRight.setFocusable(true);        // 重写onKeyListener,按返回键消失        left_right.setOnKeyListener(new OnKeyListener() {            @Override            public boolean onKey(View v, int keyCode, KeyEvent event) {                if (keyCode == KeyEvent.KEYCODE_BACK) {                    popRight.dismiss();                    //为空的话就会重新构建不会保留//                  popLeft = null;                    return true;                }                return false;            }        });        // 设置动画效果 //      popupWindow.setAnimationStyle(R.style.AnimationFade);         //点击其他地方消失         left_right.setOnTouchListener(new OnTouchListener() {         @Override         public boolean onTouch(View v, MotionEvent event) {         if (popRight != null && popRight.isShowing()) {             popRight.dismiss();          }         return false;       }});         // pop.xml视图里面的控件         lv3 = (ListView) left_right.findViewById(R.id.lv3);         right = new ArrayList<son>();        for (int i = 0; i < 4; i++) {            son s = new son();            s.setId(i+"");            if (i==0) {                s.setName("智能排序");            }            if (i==1) {                s.setName("好评优先");            }            if (i==2) {                s.setName("离我最近");            }            if (i==3) {                s.setName("人均最低");            }            right.add(s);        }        adapterRight = new MyAdapterRight(MainActivity.this, right);        lv3.setAdapter(adapterRight);        lv3.setOnItemClickListener(new OnItemClickListener() {            @Override            public void onItemClick(AdapterView<?> arg0, View arg1, int position,                    long arg3) {                adapterRight.setSelectItem(position);                // 当没有下级时直接将信息设置textview中                String name = right.get(position).getName();                setHeadText(3, name,0);                popRight.dismiss();            }        });    }    /**     * @Title: setHeadText     * @Description: 点击之后设置在上边的TextView里     * @author yimei     * @return void 返回类型     */    private void setHeadText(int idx, String text,int image) {        switch (idx) {        case 1:            fenlei.setText(text);            icon1.setImageResource(image);            break;        case 2:            diqu.setText(text);            break;        case 3:            paixu.setText(text);            break;        }    }   }

布局文件

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:background="#FFFFFF"    tools:context=".MainActivity" >    <LinearLayout        android:id="@+id/ll_layout"        android:layout_width="match_parent"        android:layout_height="40dip"        android:background="#FFFFFF"        android:orientation="horizontal" >        <LinearLayout            android:id="@+id/ll_quyu"            android:layout_width="0dip"            android:layout_height="40dip"            android:layout_weight="1"            android:gravity="center_vertical|center_horizontal"            android:orientation="horizontal"            android:paddingLeft="10dip" >            <ImageView                android:id="@+id/icon1"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:src="@drawable/documents" />            <TextView                android:id="@+id/fenlei"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:gravity="center_vertical"                android:text="@string/quyu"                android:textColor="#4d4d4d" />        </LinearLayout>        <View            android:layout_width="1dip"            android:layout_height="20dip"            android:layout_gravity="center_vertical"            android:background="#e6e6e6" />        <LinearLayout            android:id="@+id/ll_jiage"            android:layout_width="0dip"            android:layout_height="40dip"            android:layout_weight="1"            android:gravity="center_vertical|center_horizontal"            android:orientation="horizontal"            android:paddingLeft="10dip" >                <ImageView                android:id="@+id/icon2"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:src="@drawable/location_pin" />            <TextView                android:id="@+id/diqu"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:gravity="center_vertical"                android:text="@string/jiage"                android:textColor="#4d4d4d" />        </LinearLayout>        <View            android:layout_width="1dip"            android:layout_height="20dip"            android:layout_gravity="center_vertical"            android:background="#e6e6e6" />        <LinearLayout            android:id="@+id/ll_huxing"            android:layout_width="0dip"            android:layout_height="40dip"            android:layout_weight="1"            android:gravity="center_vertical|center_horizontal"            android:orientation="horizontal"            android:paddingLeft="10dip" >            <ImageView                android:id="@+id/icon3"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:src="@drawable/resize_100" />            <TextView                android:id="@+id/paixu"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:gravity="center_vertical"                android:text="@string/huxing"                android:textColor="#4d4d4d" />        </LinearLayout>    </LinearLayout>    <View        android:layout_width="match_parent"        android:layout_height="1dip"        android:layout_below="@id/ll_layout"        android:background="#e6e6e6" /></RelativeLayout>

参数的适配器(就贴一个了,这部分没什么,看源码更清楚)

public class MyAdapterLeft extends BaseAdapter {    private List<father> l;    private Context context;    private int selectItem = -1;    public MyAdapterLeft(Context context, List<father> l) {        this.context = context;        this.l = l;    }    @Override    public int getCount() {        return l.size();    }    @Override    public Object getItem(int position) {        return l.get(position);    }    @Override    public long getItemId(int position) {        return position;    }    @Override    public View getView(int position, View convertView, ViewGroup parent) {        Holder holder = null;        if (convertView == null) {            holder = new Holder();            convertView = LayoutInflater.from(context).inflate(R.layout.item,                    null);            holder.name = (TextView) convertView.findViewById(R.id.name);            holder.img = (ImageView) convertView.findViewById(R.id.img);            convertView.setTag(holder);        } else {            holder = (Holder) convertView.getTag();        }            holder.name.setText(l.get(position).getName());            holder.img.setImageResource(l.get(position).getImage());        if (position == selectItem) {            convertView.setBackgroundColor(context.getResources().getColor(R.color.click));            holder.name.setTextColor(Color.BLUE);        } else {            convertView.setBackgroundColor(context.getResources().getColor(R.color.defult));            holder.name.setTextColor(Color.BLACK);        }        return convertView;    }    public void setSelectItem(int selectItem) {        this.selectItem = selectItem;    }    class Holder {        TextView name;        ImageView img;    }    private void show(String str) {        Toast.makeText(context, str, 0).show();    }}

一些比较重要的内容就这些了,子层级的item啊,father son的对象声明啊,看源码吧,只是用于填充数据的容器而已
源码:http://yunpan.cn/cmwJbWZ3FdpdZ 访问密码 493b

部分内容参考互联网,如有重复请见谅

版权声明:本文为博主原创文章,未经博主允许不得转载。

1楼heotaeyoung昨天 17:09
楼主厉害哦
  相关解决方案