Android仿美团外卖菜单界面
程序员文章站
2022-03-23 13:43:27
美团外卖菜单界面的android实现代码,供大家参考,具体内容如下
布局文件
总布局
美团外卖菜单界面的android实现代码,供大家参考,具体内容如下
布局文件
总布局
<?xml version="1.0" encoding="utf-8"?> <linearlayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/activity_main" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingbottom="@dimen/activity_vertical_margin" android:orientation="horizontal" tools:context="com.example.a1_.activity.mainactivity"> <listview android:id="@+id/lv_left" android:layout_width="100dp" android:layout_height="match_parent"> </listview> <se.emilsjolander.stickylistheaders.stickylistheaderslistview android:id="@+id/lv_right" android:layout_width="match_parent" android:layout_height="match_parent"> </se.emilsjolander.stickylistheaders.stickylistheaderslistview> </linearlayout>
左侧布局
<?xml version="1.0" encoding="utf-8"?> <relativelayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="wrap_content"> <textview android:layout_margin="10dp" android:id="@+id/tv_title" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerinparent="true" android:text="菜单类别" android:textsize="18sp" /> </relativelayout>
右侧布局
<?xml version="1.0" encoding="utf-8"?> <relativelayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:layout_height="65dp" android:orientation="vertical"> <imageview android:src="@mipmap/ic_launcher" android:layout_margin="4dp" android:id="@+id/iv" android:layout_width="50dp" android:layout_height="50dp" /> <linearlayout android:layout_torightof="@id/iv" android:orientation="vertical" android:layout_margin="4dp" android:layout_width="match_parent" android:layout_height="match_parent"> <textview android:text="洋芋粉炒腊肉" android:textsize="20sp" android:id="@+id/tv_right_title1" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <textview android:id="@+id/tv_right_title2" android:text="洋芋粉炒腊肉" android:textsize="16sp" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <textview android:id="@+id/tv_right_count" android:text="月销售54份" android:textsize="18sp" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </linearlayout> </relativelayout>
适配器
左侧适配器
package com.example.a1_.adapter; import android.graphics.color; import android.view.view; import android.view.viewgroup; import android.widget.baseadapter; import android.widget.textview; import com.example.a1_.bean.leftbean; import com.example.a1_.r; import java.util.list; /** * created by administrator on 2017.05.27.0027. */ public class leftadapter extends baseadapter { private list<leftbean> mlist; private int currentleftitem = 0; //创建一个构造方法 public leftadapter(list<leftbean> mlist) { this.mlist = mlist; } @override public int getcount() { return mlist.size(); } @override public leftbean getitem(int position) { return mlist.get(position); } @override public long getitemid(int position) { return position; } @override public view getview(int position, view convertview, viewgroup parent) { viewholder viewholder = null; if (convertview==null){ convertview = view.inflate(parent.getcontext(), r.layout.left_item,null); //创建viewholder对象 viewholder = new viewholder(); viewholder.tv_title = (textview) convertview.findviewbyid(r.id.tv_title); //让viewholder挂在convertview上面一起复用 convertview.settag(viewholder); }else { //当convertview不为空时,吧viewholder取出来 viewholder = (viewholder) convertview.gettag(); } //获取对应条目的内容 leftbean leftbean = getitem(position); //把对应条目的内容设置在控件上 viewholder.tv_title.settext(leftbean.title); //给左侧条目设置颜色 if (currentleftitem ==position){ viewholder.tv_title.settextcolor(color.red); } return convertview; } public void setcurrentselect(int currentleftitem){ this.currentleftitem = currentleftitem; } //创建一个viewholder,用来复用对象 class viewholder{ textview tv_title; } }
右侧适配器
package com.example.a1_.adapter; import android.content.context; import android.graphics.color; import android.view.view; import android.view.viewgroup; import android.widget.baseadapter; import android.widget.listview; import android.widget.textview; import com.example.a1_.bean.leftbean; import com.example.a1_.bean.rightbean; import com.example.a1_.r; import java.util.list; import java.util.random; import se.emilsjolander.stickylistheaders.stickylistheadersadapter; /** * created by administrator on 2017.05.27.0027. */ public class rightadapter extends baseadapter implements stickylistheadersadapter { private list<leftbean> mleft; private list<rightbean> mright; private context context; public rightadapter(list<leftbean> mleft, list<rightbean> mright, context context) { this.mleft = mleft; this.mright = mright; this.context = context; } @override public view getheaderview(int position, view convertview, viewgroup parent) { textview tv = new textview(context); tv.settextcolor(color.red); tv.settextsize(18); tv.settext(mright.get(position).type); return tv; } @override public long getheaderid(int position) { return mright.get(position).typeid; } @override public int getcount() { return mright.size(); } @override public rightbean getitem(int position) { return mright.get(position); } @override public long getitemid(int position) { return position; } @override public view getview(int position, view convertview, viewgroup parent) { viewholder viewholder = null; if (convertview==null){ convertview = view.inflate(context, r.layout.right_item,null); viewholder = new viewholder(); viewholder.title1 = (textview) convertview.findviewbyid(r.id.tv_right_title1); viewholder.title2 = (textview) convertview.findviewbyid(r.id.tv_right_title2); viewholder.count = (textview) convertview.findviewbyid(r.id.tv_right_count); convertview.settag(viewholder); }else { viewholder = (viewholder) convertview.gettag(); } rightbean rightbean = mright.get(position); viewholder.title1.settext(rightbean.biaoti); viewholder.title2.settext(rightbean.biaoti); //使用random获取随机数 random random = new random(); int i = random.nextint(100); viewholder.count.settext("月销量"+i+"份"); return convertview; } static class viewholder{ textview title1; textview title2; textview count; } }
javabean文件
左侧
package com.example.a1_.bean; public class leftbean { public string title; public int type; }
右侧
package com.example.a1_.bean; import android.r.string; public class rightbean { public string biaoti; public string type; public int typeid; }
数据源
package com.example.a1_.data; import com.example.a1_.bean.leftbean; import com.example.a1_.bean.rightbean; import java.util.arraylist; import java.util.list; /** * created by wangcaisheng on 2017/5/27. */ public class data { private static string[] leftdata = new string[]{"13.9特价套餐","粗粮主食","佐餐小吃","用心营养套餐(不含主食)","三杯鸡双拼尊享套餐","带鱼双拼尊享套餐","红烧肉双拼尊享套餐"}; private static string[] rightdata0 = new string[]{"洋芋粉炒腊肉","土鸡炖香菇","*大盘辣子土鸡","清炖土鸡块","农家蒸碗 ","香辣野猪肉","香辣薯条大虾","麻辣猪血"}; private static string[] rightdata1 = new string[]{"商芝扣肉","羊肉萝卜","干烧鱼 ","干煸野猪肉 ","排骨火锅","土鸡火锅","牛肉火锅","狗肉火锅 "}; private static string[] rightdata2 = new string[]{"虎皮辣子炒咸肉","重庆飘香水煮鱼","红烧土鸡块","干煸辣子土鸡","清炖全鸡 "}; private static string[] rightdata3 = new string[]{"洋芋粉炒腊肉","土鸡炖香菇","*大盘辣子土鸡","清炖土鸡块","农家蒸碗 ","香辣野猪肉","香辣薯条大虾","麻辣猪血"}; private static string[] rightdata4 = new string[]{"洋芋粉炒腊肉","土鸡炖香菇","*大盘辣子土鸡","清炖土鸡块","农家蒸碗 ","香辣野猪肉","香辣薯条大虾","麻辣猪血"}; private static string[] rightdata5 = new string[]{"洋芋粉炒腊肉","土鸡炖香菇","*大盘辣子土鸡","清炖土鸡块","农家蒸碗 ","香辣野猪肉","香辣薯条大虾","麻辣猪血"}; private static string[] rightdata6 = new string[]{"洋芋粉炒腊肉","土鸡炖香菇","*大盘辣子土鸡","清炖土鸡块","农家蒸碗 ","香辣野猪肉","香辣薯条大虾","麻辣猪血"}; public static list<leftbean> getleftdata(){ list<leftbean> list = new arraylist<leftbean>(); for (int i = 0; i < leftdata.length; i++) { leftbean bean = new leftbean(); bean.title = leftdata[i]; bean.type = i; list.add(bean); } return list; } public static list<rightbean> getrightdata(list<leftbean> list){ list<rightbean> rightlist = new arraylist<rightbean>(); for (int i = 0; i < list.size(); i++) { leftbean leftbean = list.get(i); int mtype = leftbean.type; switch (mtype) { case 0: rightlist = getrightlist(rightdata0, leftbean, mtype, rightlist); break; case 1: rightlist = getrightlist(rightdata1, leftbean, mtype, rightlist); break; case 2: rightlist = getrightlist(rightdata2, leftbean, mtype, rightlist); break; case 3: rightlist = getrightlist(rightdata3, leftbean, mtype, rightlist); break; case 4: rightlist = getrightlist(rightdata4, leftbean, mtype, rightlist); break; case 5: rightlist = getrightlist(rightdata5, leftbean, mtype, rightlist); break; case 6: rightlist = getrightlist(rightdata6, leftbean, mtype, rightlist); break; } } return rightlist; } private static list<rightbean> getrightlist(string[] arr, leftbean leftbean, int mtype, list<rightbean> rightlist){ for (int j = 0; j < arr.length; j++) { rightbean bean = new rightbean(); bean.type = leftbean.title; bean.biaoti = arr[j]; bean.typeid = mtype; rightlist.add(bean); } return rightlist; } }
核心代码
package com.example.a1_.activity; import android.os.bundle; import android.support.v7.app.appcompatactivity; import android.view.view; import android.widget.adapterview; import android.widget.listview; import com.example.a1_.bean.leftbean; import com.example.a1_.bean.rightbean; import com.example.a1_.r; import com.example.a1_.adapter.leftadapter; import com.example.a1_.adapter.rightadapter; import com.example.a1_.data.data; import java.util.list; import se.emilsjolander.stickylistheaders.stickylistheaderslistview; public class mainactivity extends appcompatactivity { private listview lv_left; private stickylistheaderslistview lv_right; private int currentleftitem; @override protected void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.activity_main); initview(); initdata(); } //初始化控件 private void initview() { //初始化控件 lv_left = (listview) findviewbyid(r.id.lv_left); lv_right = (stickylistheaderslistview) findviewbyid(r.id.lv_right); } //设置适配器 private void initdata() { //创建适配器 final leftadapter leftadapter = new leftadapter(data.getleftdata()); //获取左侧数据 final list<leftbean> leftdata = data.getleftdata(); //获取右侧数据 final list<rightbean> rightdata = data.getrightdata(leftdata); rightadapter rightadapter = new rightadapter(leftdata, rightdata, this); //为左侧布局设置适配器 lv_left.setadapter(leftadapter); lv_right.setadapter(rightadapter); //为左侧条目设置点击事件 lv_left.setonitemclicklistener(new adapterview.onitemclicklistener() { @override public void onitemclick(adapterview<?> parent, view view, int position, long id) { //当左侧条目被点击时,记录下被点击条目的type int type = leftdata.get(position).type; //遍历右侧条目,并获取右侧条目的typeid,与刚刚获取的type对比,是否一致 for (int i = 0; i < rightdata.size(); i++) { if (type == rightdata.get(i).typeid) { //如果找到对应的条目,那就将右侧条目滚动至对应条目,并跳出循环 lv_right.smoothscrolltoposition(i); currentleftitem = i; //设置当前被选中的左侧条目 leftadapter.setcurrentselect(currentleftitem); //刷新数据适配器 leftadapter.notifydatasetchanged(); break; } } // toast.maketext(mainactivity.this, "您选中了"+leftdata.get(position).title, toast.length_short).show(); } }); //为右侧条目设置点击事件 lv_right.setonitemclicklistener(new adapterview.onitemclicklistener() { @override public void onitemclick(adapterview<?> parent, view view, int position, long id) { // toast.maketext(mainactivity.this, "右侧条目被点击了"+position, toast.length_short).show(); //当右侧条目被点击时,获取被点击条目的typeid int typeid = rightdata.get(position).typeid; //遍历左侧条目 for (int i = 0; i < leftdata.size(); i++) { //获取左侧条目的type,与右侧条目的typeid对比是否一致 if (typeid == leftdata.get(i).type) { //说明找到了对应条目,跳出循环,设置当前被选中的条目 currentleftitem = i; //设置当前被选中的左侧条目 leftadapter.setcurrentselect(currentleftitem); //刷新数据适配器 leftadapter.notifydatasetchanged(); break; } } } }); } }
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
上一篇: jQuery实现简单的tab切换
下一篇: 移动页面事件穿透/点击穿透问题