长沙有效的可以看的网站,大型网站建设哪家好,dux wordpress,想自学软件开发难吗前言
该项目是教材上的一个完整实列#xff0c;我实现了#xff0c;代码都是书上的#xff0c;难以实现的是连接tomcat服务器#xff0c;网络编程#xff0c;来完成数据的实现
一、实验题目
网上商城/外卖小助手
二、实验目的
掌握 Android 中的菜单及导航框架。掌握…
前言
该项目是教材上的一个完整实列我实现了代码都是书上的难以实现的是连接tomcat服务器网络编程来完成数据的实现
一、实验题目
网上商城/外卖小助手
二、实验目的
掌握 Android 中的菜单及导航框架。掌握自定义布局。掌握 Android 中的数据存储。
三、总体设计
需求分析仿美团外卖项目是一个网上订餐项目包含订餐的店铺各店铺的菜单购物车及订单与付款等内容该店铺列表可以看见店铺的名称月售数量起送价格与配送费配送时间以及店铺特色等信息。点击店铺列表中的任意一个店铺程序会进入店铺详情界面该界面主要用于显示店铺中的菜单信息同时可以将需要吃的菜添加到购物车中选完菜后可以点击该界面中的“去结算”按钮进入订单界面在该界面核对已点的菜单信息并点击“去支付”按钮进行付款。
模块介绍店铺和订单两大模块
由下图可知店铺列表界面用于显示各个店铺的信息店铺详情界面不仅显示店铺的详细信息还显示店铺中的菜单列表信息与购物车列表信息订单模块包含确认订单界面与支付界面确认订单界面用于显示购物车中已添加的商品信息支付界面用于显示付款的二维码信息。
服务器数据准备 四、详细设计
1店铺功能业务实现
打开项目时程序会进入店铺列表界面。店铺列表界面从上至下分为标题栏水平滑动的广告栏和店铺列表三部分。其中公告栏与店铺列表的数据是通过网络请求从服务器上获取的json数据。
1.1搭建标题栏布局便于代码重复利用返回键和标题栏取出来放在title_bar.xml中。
1.2创建背景选择器标题栏界面的返回键在按下与弹起会有明显区别通过背景选择器go_back_selector.xml实现,按钮被按下时显示灰色图片按钮弹起时显示白色图片。
1.3搭建广告栏界面布局用于展示广告图片信息与跟随图片滑动的小圆点当前显示的广告图片对应的小圆点为白色其余为灰色。
在res/layout文件中创建一个布局文件adbanner.xml,放置一个ViewPager控件用于显示左右滑动的广告图片由于广告栏中的小圆点随着图片的滑动而发生变化的需要自定义一个控件ViewPagerIndicator来显示界面上的小圆点。 1.4搭建店铺列表界面布局由一个标题栏一个广告栏及店铺列表组成标题栏用于展示该界面的标题广告栏主要用于展示店铺中的菜品广告图片店铺列表主要用于展示各店铺的信息在activity_shop.xml文件中通过include标签引入title_bar.xml(标题栏)和adbanner.xml(广告栏)放置一个自定义ShopListView用于显示店铺列表。
?xml version1.0 encodingutf-8?
LinearLayout xmlns:androidhttp://schemas.android.com/apk/res/androidandroid:layout_widthmatch_parentandroid:layout_heightmatch_parentandroid:backgroundandroid:color/whiteandroid:orientationverticalinclude layoutlayout/title_bar /ScrollViewandroid:layout_widthmatch_parentandroid:layout_heightmatch_parentandroid:background#f5f5f6android:scrollbarsnoneLinearLayoutandroid:layout_widthmatch_parentandroid:layout_heightmatch_parentandroid:orientationverticalinclude layoutlayout/adbanner /com.example.shop.views.ShopListViewandroid:idid/slv_listandroid:layout_widthfill_parentandroid:layout_heightfill_parentandroid:layout_marginLeft8dpandroid:layout_marginTop8dpandroid:layout_marginRight8dpandroid:dividerHeight8dpandroid:scrollbarsnone //LinearLayout/ScrollView
/LinearLayout
由于店铺列表界面上的列表滑动时列表上方的广告栏也需要跟着滑动所以在广告栏与列表控件的外层放置了一个ScrollView控件ListView控件包含在ScrollView控件中会导致列表数据不完整所以自定义一个ShopListView控件。ShopListView控件具体代码如下;
package com.example.shop.views;import android.content.Context;
import android.util.AttributeSet;
import android.widget.ListView;public class ShopListView extends ListView {public ShopListView(Context context) {super(context);}public ShopListView(Context context, AttributeSet attrs) {super(context, attrs);}public ShopListView(Context context, AttributeSet attrs, int defStyle) {super(context, attrs, defStyle);}Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {int expandSpec MeasureSpec.makeMeasureSpec(Integer.MAX_VALUE 2,MeasureSpec.AT_MOST);super.onMeasure(widthMeasureSpec, expandSpec);}
}1.5搭建店铺列表条目界面的布局:由于店铺列表界面使用自定义控件所以需要重新创建一个该列表的条目界面用于展示店铺名称月售数量起送价格配送费店铺特色以及配送时间布局名称为shop_item.xml
?xml version1.0 encodingutf-8?
RelativeLayout xmlns:androidhttp://schemas.android.com/apk/res/androidandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:layout_marginLeft8dpandroid:layout_marginTop8dpandroid:layout_marginRight8dpandroid:backgrounddrawable/item_bg_selectorandroid:padding10dpImageViewandroid:idid/iv_shop_picandroid:layout_width100dpandroid:layout_height70dpandroid:layout_alignParentLefttrue /LinearLayoutandroid:idid/ll_infoandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:layout_marginLeft10dpandroid:layout_toRightOfid/iv_shop_picandroid:orientationverticalTextViewandroid:idid/tv_shop_nameandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:textColorandroid:color/blackandroid:textSize14sp /TextViewandroid:idid/tv_sale_numandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:layout_marginTop4dpandroid:textColorcolor/color_grayandroid:textSize12sp /TextViewandroid:idid/tv_costandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:layout_marginTop4dpandroid:textColorcolor/color_grayandroid:textSize12sp //LinearLayoutTextViewandroid:idid/tv_featureandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:layout_belowid/ll_infoandroid:layout_marginLeft8dpandroid:layout_marginTop10dpandroid:layout_toRightOfid/iv_shop_picandroid:backgrounddrawable/feature_bgandroid:gravitycenterandroid:padding4dpandroid:textColorcolor/feature_text_colorandroid:textSize12sp /TextViewandroid:idid/tv_timeandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:layout_alignParentRighttrueandroid:layout_marginTop30dpandroid:textColorcolor/color_grayandroid:textSize12sp /
/RelativeLayout
1.6创建条目界面的背景选择器店铺列表条目界面的背景的四个角是圆角并且在条目在按下与弹起时其背景颜色会有明显区别。
?xml version1.0 encodingutf-8?
selector xmlns:androidhttp://schemas.android.com/apk/res/androiditem android:state_pressedtrue shape android:shaperectanglecorners android:radius8dp/solid android:colorcolor/item_bg_color//shape/itemitem android:state_pressedfalse shape android:shaperectanglecorners android:radius8dp/solid android:color#ffffff //shape/item
/selector
1.7封装店铺信息与菜品信息的实体类由于店铺信息和菜品信息都包含很多属性所以创建ShopBean类和FoodBean类封装店铺信息和菜品信息的属性。
package com.example.order.bean;import java.io.Serializable;
import java.math.BigDecimal;public class FoodBean implements Serializable {private static final long serialVersionUID 1L; //序列化时保持FoodBean类版本的兼容性private int foodId; //菜品Idprivate String foodName; //菜品名称private String popularity; //人气private String saleNum; //月售量private BigDecimal price; //价格private int count; //添加到购物车中的数量private String foodPic; //菜品图片public int getFoodId() {return foodId;}public void setFoodId(int foodId) {this.foodId foodId;}public String getFoodName() {return foodName;}public void setFoodName(String foodName) {this.foodName foodName;}public String getPopularity() {return popularity;}public void setPopularity(String popularity) {this.popularity popularity;}public String getSaleNum() {return saleNum;}public void setSaleNum(String saleNum) {this.saleNum saleNum;}public BigDecimal getPrice() {return price;}public void setPrice(BigDecimal price) {this.price price;}public String getFoodPic() {return foodPic;}public void setFoodPic(String foodPic) {this.foodPic foodPic;}public int getCount() {return count;}public void setCount(int count) {this.count count;}
}
package com.example.order.bean;import java.io.Serializable;
import java.math.BigDecimal;
import java.util.List;public class ShopBean implements Serializable {private static final long serialVersionUID 1L; //序列化时保持ShopBean类版本的兼容性private int id; //店铺Idprivate String shopName; //店铺名称private int saleNum; //月售数量private BigDecimal offerPrice; //起送价格private BigDecimal distributionCost; //配送费用private String feature; //店铺特色private String time; //配送时间private String banner; //广告栏图片private String shopPic; //店铺图片private String shopNotice; //店铺公告private ListFoodBean foodList; //菜单列表public int getId() {return id;}public void setId(int id) {this.id id;}public String getShopName() {return shopName;}public void setShopName(String shopName) {this.shopName shopName;}public int getSaleNum() {return saleNum;}public void setSaleNum(int saleNum) {this.saleNum saleNum;}public BigDecimal getOfferPrice() {return offerPrice;}public void setOfferPrice(BigDecimal offerPrice) {this.offerPrice offerPrice;}public BigDecimal getDistributionCost() {return distributionCost;}public void setDistributionCost(BigDecimal distributionCost) {this.distributionCost distributionCost;}public String getFeature() {return feature;}public void setFeature(String feature) {this.feature feature;}public String getTime() {return time;}public void setTime(String time) {this.time time;}public String getShopPic() {return shopPic;}public String getBanner() {return banner;}public void setBanner(String banner) {this.banner banner;}public void setShopPic(String shopPic) {this.shopPic shopPic;}public String getShopNotice() {return shopNotice;}public void setShopNotice(String shopNotice) {this.shopNotice shopNotice;}public ListFoodBean getFoodList() {return foodList;}public void setFoodList(ListFoodBean foodList) {this.foodList foodList;}
}
1.8编写广告栏的数据适配器AdBannerAdapter:为了给ViewPager控件填充数据获取到的数据传递到AdBannerFragment中AdBannerAdapter具体代码如下
package com.example.shop.adapter;import android.os.Bundle;import androidx.annotation.NonNull;
import androidx.fragment.app.Fragment;
import androidx.fragment.app.FragmentManager;
import androidx.lifecycle.Lifecycle;
import androidx.viewpager2.adapter.FragmentStateAdapter;import com.example.order.bean.ShopBean;
import com.example.shop.fragment.AdBannerFragment;import java.util.List;public class AdBannerAdapter extends FragmentStateAdapter {//存放店铺的列表也是广告的Fragment列表因为一个店铺就一个广告Fragmentprivate ListShopBean shopBeanList; //适配器的数据对象//构造函数public AdBannerAdapter(FragmentManager fragmentManager,Lifecycle lifecycle) {super(fragmentManager, lifecycle);}//设置广告数据并更新界面也就是给类变量赋值public void setData(ListShopBean sbl) {//将网络上访问到的 ShopBean 的数量广告数量赋值给适配器this.shopBeanList sbl;//更新数据源//适配器的内容改变时需要强制刷新每个Item的内容,可以实现动态的刷新列表的功能//notifyDataSetChanged();}//该方法返回当前的 Fragment交给相关联的 Activity 中的 ViewPager2//该方法将Fragment与 ViewPager2 完美结合NonNullOverridepublic Fragment createFragment(int position) {Bundle args new Bundle();//创建bundle传递数据给 广告 AdBannerFragmentif (shopBeanList.size() 0)args.putSerializable(ad, shopBeanList.get(position % shopBeanList.size()));return AdBannerFragment.newInstance(args);}//获取广告总数Overridepublic int getItemCount() {//return shopBeanList.size();return shopBeanList null ? 0 : shopBeanList.size();}
} 1.9将数据设置到广告栏界面上广告栏的滑动图片用Fragment来显示需要导入glide-3.7.0jar包
package com.example.shop.fragment;import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;import androidx.fragment.app.Fragment;import com.bumptech.glide.Glide;
import com.example.meituan.R;
import com.example.order.bean.ShopBean;public class AdBannerFragment extends Fragment {private ShopBean shopBean; //广告private ImageView imageView; //图片//客户端构造 该广告 Fragment所用public static AdBannerFragment newInstance(Bundle args) {AdBannerFragment af new AdBannerFragment();af.setArguments(args);return af;}//在这里创建碎片//生成广告对象时获取 bundle 数据并转换为一个 shopBeanOverridepublic void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);Bundle arg getArguments();shopBean (ShopBean) arg.getSerializable(ad); //获取一个店铺对象}//在当前Activity中添加一个Fragment时被添加的Fragment都会调用onResumeOverridepublic void onResume() {super.onResume();if (shopBean ! null) {//调用Glide框架加载图片Glide.with(getActivity()).load(shopBean.getBanner()).error(R.mipmap.ic_launcher).into(imageView);}}//该方法创建一个视图返回 ImageView 控件对象的视图Overridepublic View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {imageView new ImageView(getActivity()); //创建一个 ImageView 控件的对象//定义一个视图容器对象用来存放图片对象,容器的宽度和高度都是 MATCH_PARENTViewGroup.LayoutParams lp new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT,ViewGroup.LayoutParams.MATCH_PARENT);imageView.setLayoutParams(lp); //设置ImageView控件的宽高参数imageView.setScaleType(ImageView.ScaleType.FIT_XY); //把图片填满整个控件
// imageView.setOnClickListener(new View.OnClickListener() {
// Override
// public void onClick(View v) {
// //跳转到店铺详情界面
// if (sb null) return;
// Intent intent new Intent(getActivity(), ShopDetailActivity.class);
// intent.putExtra(shop, shopBean);
// getActivity().startActivity(intent);
// }
// });return imageView;}
} 1.10编写店铺列表的数据适配器由于店铺列表是用ShopListView控件展示的所以需要创建一个数据适配器ShopAdapter对ShopListView控件进行数据适配。
package com.example.shop.adapter;import android.content.Context;
import android.content.Intent;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.TextView;import com.bumptech.glide.Glide;
import com.example.meituan.R;
import com.example.meituan.ShopDetailActivity;
import com.example.order.bean.ShopBean;import java.util.List;public class ShopAdapter extends BaseAdapter {private Context mContext;private ListShopBean sbl;public ShopAdapter(Context context) {this.mContext context;}/*** 获取数据并更新界面*/public void setData(ListShopBean sbl) {this.sbl sbl;notifyDataSetChanged();}/*** 获取条目的总数*/Overridepublic int getCount() {return sbl null ? 0 : sbl.size();}/*** 根据position得到对应条目的对象*/Overridepublic ShopBean getItem(int position) {return sbl null ? null : sbl.get(position);}/*** 根据position得到对应条目的Id*/Overridepublic long getItemId(int position) {return position;}/*** 得到相应position对应的条目视图position是当前条目的位置* convertView参数是滚出屏幕的条目视图*/Overridepublic View getView(int position, View convertView, ViewGroup parent) {final ViewHolder vh;//复用convertViewif (convertView null) {vh new ViewHolder();convertView LayoutInflater.from(mContext).inflate(R.layout.shop_item,null);vh.tv_shop_name convertView.findViewById(R.id.tv_shop_name);vh.tv_sale_num convertView.findViewById(R.id.tv_sale_num);vh.tv_cost convertView.findViewById(R.id.tv_cost);vh.tv_feature convertView.findViewById(R.id.tv_feature);vh.tv_time convertView.findViewById(R.id.tv_time);vh.iv_shop_pic convertView.findViewById(R.id.iv_shop_pic);convertView.setTag(vh);} else {vh (ViewHolder) convertView.getTag();}//获取position对应条目的数据对象final ShopBean bean getItem(position);if (bean ! null) {vh.tv_shop_name.setText(bean.getShopName());vh.tv_sale_num.setText(月售 bean.getSaleNum());vh.tv_cost.setText(起送 bean.getOfferPrice() | 配送 bean.getDistributionCost());vh.tv_time.setText(bean.getTime());vh.tv_feature.setText(bean.getFeature());Glide.with(mContext).load(bean.getShopPic()).error(R.mipmap.ic_launcher).into(vh.iv_shop_pic);}//每个条目的点击事件convertView.setOnClickListener(new View.OnClickListener() {Overridepublic void onClick(View v) {//跳转到店铺详情界面if (bean null) return;Intent intent new Intent(mContext, ShopDetailActivity.class);//把店铺的详细信息传递到店铺详情界面intent.putExtra(shop, bean);mContext.startActivity(intent);}});return convertView;}class ViewHolder {public TextView tv_shop_name, tv_sale_num, tv_cost, tv_feature, tv_time;public ImageView iv_shop_pic;}
}
1.11实现店铺列表界面显示功能使用OkHttpClient类向服务器请求数据获取到的数据通过Gson库解析获取到的JSON数据显示到界面上。
1.11.1添加OkHttp库
1.11.2添加Gson库
1.11.3创建Constant类存放各界面在服务器上请求数据时使用的接口地址
内网接口IP地址要换成自己电脑的
package com.example.shop.utils;public class Constant {public static final String WEB_SITE http://10.0.2.2:8080/order;//内网接口public static final String REQUEST_SHOP_URL /shop_list_data.json; //店铺列表接口
}1.11.4创建JsonParse类用于解析获取到的JSON数据具体代码如下
package com.example.shop.utils;import com.example.order.bean.ShopBean;
import com.google.gson.Gson;
import com.google.gson.reflect.TypeToken;import java.lang.reflect.Type;
import java.util.List;public class JsonParse {private static JsonParse instance;private JsonParse() {}public static JsonParse getInstance() {if (instance null) {instance new JsonParse();}return instance;}public ListShopBean getShopList(String json) {Gson gson new Gson(); // 使用gson库解析JSON数据// 创建一个TypeToken的匿名子类对象并调用对象的getType()方法Type listType new TypeTokenListShopBean() {}.getType();// 把获取到的信息集合存到shopList中ListShopBean shopList gson.fromJson(json, listType);return shopList;}
} 1.11.5将数据显示到店铺列表界面上需要创建init()方法用于初始化界面控件与获取界面的数据并将数据显示到界面上。ShopActivity.java
package com.example.meituan;import android.content.Context;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.util.DisplayMetrics;
import android.util.Log;
import android.view.KeyEvent;
import android.view.View;
import android.view.ViewGroup;
import android.view.WindowManager;
import android.widget.RelativeLayout;
import android.widget.TextView;
import android.widget.Toast;import androidx.appcompat.app.AppCompatActivity;
import androidx.viewpager2.widget.ViewPager2;import com.example.shop.adapter.AdBannerAdapter;
import com.example.order.bean.ShopBean;
import com.example.shop.adapter.ShopAdapter;
import com.example.shop.utils.Constant;
import com.example.shop.utils.JsonParse;
import com.example.shop.views.ShopListView;
import com.example.shop.views.ViewPagerIndicator;import java.io.IOException;
import java.util.List;import okhttp3.Call;
import okhttp3.Callback;
import okhttp3.OkHttpClient;
import okhttp3.Request;
import okhttp3.Response;public class ShopActivity extends AppCompatActivity {private TextView tv_back,tv_title; //返回键与标题控件// private ShopListView slv_list; //列表控件
// private ShopAdapter adapter; //列表的适配器private RelativeLayout rl_title_bar;private ViewPager2 viewPager; //广告private ViewPagerIndicator viewPagerIndicator; //小圆点private View adBannerLay; //广告条容器private AdBannerAdapter adBannerAdapter; //广告ViewPager2适配器public static final int MSG_AD_SLID 1; //广告自动滑动public static final int MSG_SHOP_OK 2; //获取数据private MHandler mHandler;private ShopListView slv_list; //列表控件private ShopAdapter adapter;Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_shop);mHandlernew MHandler();initData(); //访问网络获取数据并将数据显示在界面上init(); //初始化界面控件}/*** 初始化界面控件*/private void init(){slv_list findViewById(R.id.slv_list);adapter new ShopAdapter(this);slv_list.setAdapter(adapter);tv_back findViewById(R.id.tv_back);tv_title findViewById(R.id.tv_title);tv_title.setText(店铺);rl_title_bar findViewById(R.id.title_bar);rl_title_bar.setBackgroundColor(getResources().getColor(R.color.blue));tv_back.setVisibility(View.GONE);
// slv_list findViewById(R.id.slv_list);
// adapternew ShopAdapter(this);
// slv_list.setAdapter(adapter);adBannerLay findViewById(R.id.adbanner_layout);viewPager findViewById(R.id.slidingAdvertBanner);viewPagerIndicator findViewById(R.id.advert_indicator);viewPager.setLongClickable(false);adBannerAdapter new AdBannerAdapter(getSupportFragmentManager(),getLifecycle());viewPager.setAdapter(adBannerAdapter);viewPager.registerOnPageChangeCallback(new ViewPager2.OnPageChangeCallback() {//ViewPager2滑动到新的页时需要完成的功能Overridepublic void onPageSelected(int position) {//super.onPageSelected(position);if (adBannerAdapter.getItemCount() 0) {//设置当前小圆点viewPagerIndicator.setCurrentPostion(position % adBannerAdapter.getItemCount());}}});resetSize();//自定义函数计算控件大小new AdAutoSlidThread().start();//开启一个子线程}//定义一个无限循环的子线程,子线程每5秒钟发送一个消息个主线程//主线程每5秒钟接收到该消息然后显示一下个广告Fragmentclass AdAutoSlidThread extends Thread {Overridepublic void run() {super.run();while (true) {try {sleep(5000); //睡眠5秒} catch (InterruptedException e) {e.printStackTrace();}if (mHandler ! null)mHandler.sendEmptyMessage(MSG_AD_SLID);}}}//访问网络获取数据private void initData() {OkHttpClient okHttpClient new OkHttpClient();Request request new Request.Builder().url(Constant.WEB_SITE Constant.REQUEST_SHOP_URL).build();Call call okHttpClient.newCall(request);// 开启异步线程访问网络call.enqueue(new Callback() {Overridepublic void onResponse(Call call, Response response) throws IOException {String res response.body().string(); //获取店铺数据Message msg new Message();msg.what MSG_SHOP_OK;msg.obj res;mHandler.sendMessage(msg);}Overridepublic void onFailure(Call call, IOException e) {}});}/*** 事件捕获*/class MHandler extends Handler {//处理子线程发送过来的消息Overridepublic void dispatchMessage(Message msg) {super.dispatchMessage(msg);switch (msg.what) {case MSG_SHOP_OK://接收访问网络子线程发送过来的消息if (msg.obj ! null) {String vlResult (String) msg.obj;Log.i(tag,vlResult);//解析获取的JSON数据ListShopBean shopBeanList JsonParse.getInstance().getShopList(vlResult);Log.i(tag,shopBeanList.toString());adapter.setData(shopBeanList);if (shopBeanList ! null) {if (shopBeanList.size() 0) {//设置广告栏数据到适配器上//将网络上访问到的 ShopBean 的列表数据广告列表数据赋值给适配器adBannerAdapter.setData(shopBeanList);//更新数据源//适配器的内容改变时需要强制刷新每个Item的内容,//可以实现动态的刷新列表的功能adBannerAdapter.notifyDataSetChanged();//设置小圆点数目viewPagerIndicator.setCount(shopBeanList.size());//设置当前小圆点的位置为0viewPagerIndicator.setCurrentPostion(0);}}}break;case MSG_AD_SLID://接收AdAutoSlidThread子线程发送过来的消息每5秒钟发送一个消息if (adBannerAdapter.getItemCount() 0) {//获取广告适配器的数据大小//判断广告是否滑动到了最后一个if(viewPager.getCurrentItem() 1 adBannerAdapter.getItemCount()){//广告从第一个开始重新显示viewPager.setCurrentItem(0);}else{//设置滑动到下一张广告图片viewPager.setCurrentItem(viewPager.getCurrentItem() 1);}}break;}}}/*** 计算控件大小*/private void resetSize() {int sw getScreenWidth();//获取屏幕宽度int adLheight sw /3; //广告条高度ViewGroup.LayoutParams adlp adBannerLay.getLayoutParams();adlp.width sw;adlp.height adLheight;adBannerLay.setLayoutParams(adlp);}/*** 获取屏幕宽度*/public int getScreenWidth() {WindowManager wm (WindowManager)getSystemService(Context.WINDOW_SERVICE);DisplayMetrics outMetrics new DisplayMetrics();wm.getDefaultDisplay().getMetrics(outMetrics);return outMetrics.widthPixels;}protected long exitTime;//记录第一次点击时的时间//点击2次返回键的时间间隔小于2秒钟退出APPOverridepublic boolean onKeyDown(int keyCode, KeyEvent event) {if (keyCode KeyEvent.KEYCODE_BACK event.getAction() KeyEvent.ACTION_DOWN) {if ((System.currentTimeMillis() - exitTime) 2000) {Toast.makeText(ShopActivity.this, 再按一次退出仿美团外卖应用,Toast.LENGTH_SHORT).show();exitTime System.currentTimeMillis();} else {ShopActivity.this.finish();System.exit(0);}return true;}return super.onKeyDown(keyCode, event);}
} 2、店铺详情功能业务实现
当店铺列表界面的条目被点击后程序会跳转到店铺详情界面该界面主要分为三部分第一部分部分用于展示店铺的信息如店铺名称店铺图片店铺公告及配送时间第二部分用于展示店铺中的菜单列表第三部分用于展示购物车
2.1搭建店铺详情界面布局
?xml version1.0 encodingutf-8?
FrameLayoutxmlns:androidhttp://schemas.android.com/apk/res/androidandroid:layout_widthmatch_parentandroid:layout_heightmatch_parentLinearLayoutandroid:idid/ll_introandroid:layout_widthmatch_parentandroid:layout_heightmatch_parentandroid:backgrounddrawable/shop_bgandroid:orientationverticalinclude layoutlayout/title_bar /LinearLayoutandroid:layout_widthmatch_parentandroid:layout_heightmatch_parentandroid:layout_marginTop65dpandroid:backgroundandroid:color/whiteandroid:orientationverticalandroid:paddingTop60dpTextViewandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:padding10dpandroid:text菜单android:textColorandroid:color/blackandroid:textSize16sp /Viewandroid:layout_widthmatch_parentandroid:layout_height1dpandroid:layout_marginLeft10dpandroid:layout_marginRight10dpandroid:backgroundcolor/light_gray //LinearLayout/LinearLayoutinclude layoutlayout/shop_detail_head /RelativeLayoutandroid:layout_widthmatch_parentandroid:layout_heightmatch_parentandroid:layout_marginTop220dpListViewandroid:idid/lv_listandroid:layout_widthmatch_parentandroid:layout_heightmatch_parentandroid:layout_alignParentBottomtrueandroid:layout_marginBottom50dp /include layoutlayout/car_list /include layoutlayout/shop_car //RelativeLayout
/FrameLayout
2.2创建shop_detail_head.xml显示店铺名称配送时间以及店铺公告配送时间的图标和店铺的图片
?xml version1.0 encodingutf-8?
RelativeLayoutxmlns:androidhttp://schemas.android.com/apk/res/androidandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:paddingTop20dpandroid:backgroundandroid:color/transparentLinearLayoutandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:layout_marginLeft10dpandroid:layout_marginRight10dpandroid:layout_marginTop50dpandroid:backgrounddrawable/corner_bgandroid:orientationverticalandroid:padding10dpTextViewandroid:idid/tv_shop_nameandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:textColorandroid:color/blackandroid:textSize18sp /LinearLayoutandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:layout_marginTop4dpandroid:orientationhorizontalImageViewandroid:layout_width15dpandroid:layout_height15dpandroid:layout_alignParentLefttrueandroid:scaleTypefitXYandroid:srcdrawable/time_icon /TextViewandroid:idid/tv_timeandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:layout_marginLeft4dpandroid:textColorcolor/color_grayandroid:textSize12sp //LinearLayoutTextViewandroid:idid/tv_noticeandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:layout_marginTop4dpandroid:textColorcolor/color_grayandroid:textSize12sp //LinearLayoutImageViewandroid:idid/iv_shop_picandroid:layout_width85dpandroid:layout_height60dpandroid:layout_alignParentRighttrueandroid:layout_margin20dpandroid:scaleTypefitXY /
/RelativeLayout
2.3创建shop_car.xml用于显示“未选购商品”“去结算”“不够起送价格”的文本信息与配送费信息。
?xml version1.0 encodingutf-8?
RelativeLayoutxmlns:androidhttp://schemas.android.com/apk/res/androidandroid:layout_widthmatch_parentandroid:layout_heightmatch_parentFrameLayoutandroid:layout_widthmatch_parentandroid:layout_height65dpandroid:layout_alignParentBottomtrueRelativeLayoutandroid:layout_widthmatch_parentandroid:layout_height50dpandroid:layout_marginTop15dpandroid:backgroundcolor/car_gray_colorandroid:paddingLeft60dpTextViewandroid:idid/tv_moneyandroid:layout_widthwrap_contentandroid:layout_height25dpandroid:layout_marginLeft4dpandroid:layout_marginTop4dpandroid:gravitycenterandroid:text未选购商品android:textColorcolor/light_grayandroid:textSize16sp /TextViewandroid:idid/tv_distribution_costandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:layout_belowid/tv_moneyandroid:layout_marginLeft4dpandroid:textColorandroid:color/whiteandroid:textSize12spandroid:textStyleboldandroid:visibilitygone /TextViewandroid:idid/tv_settle_accountsandroid:layout_width100dpandroid:layout_heightmatch_parentandroid:layout_alignParentRighttrueandroid:layout_centerVerticaltrueandroid:backgroundcolor/account_colorandroid:gravitycenterandroid:text去结算android:textColorandroid:color/whiteandroid:textSize16spandroid:visibilitygone /TextViewandroid:idid/tv_not_enoughandroid:layout_widthwrap_contentandroid:layout_heightmatch_parentandroid:layout_alignParentRighttrueandroid:backgroundcolor/account_gray_colorandroid:gravitycenterandroid:padding8dpandroid:textColorcolor/light_grayandroid:textSize16sp //RelativeLayoutinclude layoutlayout/car //FrameLayout
/RelativeLayout
2.4创建badge_bg.xml
购物车右上角有一个显示商品数量的控件
?xml version1.0 encodingutf-8?
shape xmlns:androidhttp://schemas.android.com/apk/res/androidandroid:shaperectanglegradientandroid:endColor#fe451dandroid:startColor#fe957fandroid:typelinear /corners android:radius180dp /
/shape 2.5搭建菜单列表条目界面布局用ListView控件来展示菜单信息展示菜品的名称人气月售数量与好评度价格及“加入购物车”按钮。
?xml version1.0 encodingutf-8?
RelativeLayout xmlns:androidhttp://schemas.android.com/apk/res/androidandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:layout_marginLeft8dpandroid:layout_marginTop8dpandroid:layout_marginRight8dpandroid:backgrounddrawable/menu_item_bg_selectorandroid:padding10dpImageViewandroid:idid/iv_food_picandroid:layout_width80dpandroid:layout_height60dpandroid:layout_alignParentLefttrue /LinearLayoutandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:layout_marginLeft10dpandroid:layout_toRightOfid/iv_food_picandroid:orientationverticalTextViewandroid:idid/tv_food_nameandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:textColorandroid:color/blackandroid:textSize14sp /TextViewandroid:idid/tv_popularityandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:layout_marginTop4dpandroid:backgrounddrawable/feature_bgandroid:padding4dpandroid:textColorcolor/feature_text_colorandroid:textSize12sp /TextViewandroid:idid/tv_sale_numandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:layout_marginTop4dpandroid:textColorcolor/color_grayandroid:textSize12sp /TextViewandroid:idid/tv_priceandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:layout_marginTop4dpandroid:textColorcolor/price_redandroid:textSize16sp //LinearLayoutButtonandroid:idid/btn_add_carandroid:layout_width65dpandroid:layout_height25dpandroid:layout_alignParentRighttrueandroid:layout_marginTop30dpandroid:backgrounddrawable/add_car_selectorandroid:gravitycenterandroid:text加入购物车android:textColorandroid:color/whiteandroid:textSize10sp /
/RelativeLayout 2.6搭建购物车列表条目界面布局car_item.xml
?xml version1.0 encodingutf-8?
LinearLayoutxmlns:androidhttp://schemas.android.com/apk/res/androidandroid:layout_widthmatch_parentandroid:layout_height60dpandroid:gravitycenter_verticalandroid:orientationverticalandroid:padding8dpRelativeLayoutandroid:layout_widthmatch_parentandroid:layout_heightmatch_parentandroid:gravitycenter_verticalTextViewandroid:idid/tv_food_nameandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:layout_marginRight8dpandroid:maxLines1android:textColor#757575android:textSize16sp /ImageViewandroid:idid/iv_addandroid:layout_width25dpandroid:layout_height25dpandroid:layout_alignParentRighttrueandroid:srcdrawable/car_add /TextViewandroid:idid/tv_food_countandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:layout_marginRight10dpandroid:layout_marginTop4dpandroid:layout_toLeftOfid/iv_addandroid:textColorandroid:color/black /ImageViewandroid:idid/iv_minusandroid:layout_width25dpandroid:layout_height25dpandroid:layout_marginRight10dpandroid:layout_toLeftOfid/tv_food_countandroid:srcdrawable/car_minus /TextViewandroid:idid/tv_food_priceandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:layout_marginRight10dpandroid:layout_marginTop4dpandroid:layout_toLeftOfid/iv_minusandroid:textColorcolor/price_redandroid:textSize14spandroid:textStylebold //RelativeLayout
/LinearLayout 2.7创建slide_bottom_to_top.xml文件用于实现弹出的动画效果
?xml version1.0 encodingutf-8?
set xmlns:androidhttp://schemas.android.com/apk/res/androidandroid:interpolatorandroid:anim/accelerate_interpolatortranslateandroid:duration500android:fromYDelta100.0%android:toYDelta10.000002% /alphaandroid:duration500android:fromAlpha0.0android:toAlpha1.0 //set
2.8搭建确认清空购物车界面布局
2.9编写菜单列表的数据适配器
2.9.1创建菜单列表的数据适配器MenuAdapter,MenuAdapter具体代码如下
package com.example.shop.adapter;import android.content.Context;
import android.content.Intent;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.TextView;import com.bumptech.glide.Glide;
import com.example.order.bean.FoodBean;
import com.example.meituan.FoodActivity;
import com.example.meituan.R;
import com.example.order.bean.FoodBean;import java.util.List;public class MenuAdapter extends BaseAdapter {private Context mContext;private ListFoodBean fbl; //菜单列表数据private OnSelectListener onSelectListener; //加入购物车按钮的监听事件public MenuAdapter(Context context, OnSelectListener onSelectListener) {this.mContext context;this.onSelectListeneronSelectListener;}/*** 设置数据更新界面*/public void setData(ListFoodBean fbl) {this.fbl fbl;notifyDataSetChanged();}/*** 获取条目的总数*/Overridepublic int getCount() {return fbl null ? 0 : fbl.size();}/*** 根据position得到对应条目的对象*/Overridepublic FoodBean getItem(int position) {return fbl null ? null : fbl.get(position);}/*** 根据position得到对应条目的Id*/Overridepublic long getItemId(int position) {return position;}/*** 得到相应position对应的条目视图position是当前条目的位置* convertView参数是滚出屏幕的条目视图*/Overridepublic View getView(final int position, View convertView, ViewGroup parent) {final ViewHolder vh;//复用convertViewif (convertView null) {vh new ViewHolder();convertView LayoutInflater.from(mContext).inflate(R.layout.menu_item,null);vh.tv_food_name convertView.findViewById(R.id.tv_food_name);vh.tv_popularity convertView.findViewById(R.id.tv_popularity);vh.tv_sale_num convertView.findViewById(R.id.tv_sale_num);vh.tv_price convertView.findViewById(R.id.tv_price);vh.btn_add_car convertView.findViewById(R.id.btn_add_car);vh.iv_food_pic convertView.findViewById(R.id.iv_food_pic);convertView.setTag(vh);} else {vh (ViewHolder) convertView.getTag();}//获取position对应条目的数据对象final FoodBean bean getItem(position);if (bean ! null) {vh.tv_food_name.setText(bean.getFoodName());vh.tv_popularity.setText(bean.getPopularity ());vh.tv_sale_num.setText(月售 bean.getSaleNum());vh.tv_price.setText(bean.getPrice());Glide.with(mContext).load(bean.getFoodPic()).error(R.mipmap.ic_launcher).into(vh.iv_food_pic);}//每个条目的点击事件convertView.setOnClickListener(new View.OnClickListener() {Overridepublic void onClick(View v) {//跳转到菜品详情界面if (bean null)return;Intent intent new Intent(mContext, FoodActivity.class);//把菜品的详细信息传递到菜品详情界面intent.putExtra(food, bean);mContext.startActivity(intent);}});vh.btn_add_car.setOnClickListener(new View.OnClickListener() {Overridepublic void onClick(View view) { //加入购物车按钮的点击事件onSelectListener.onSelectAddCar(position);}});return convertView;}class ViewHolder {public TextView tv_food_name, tv_popularity, tv_sale_num, tv_price;public Button btn_add_car;public ImageView iv_food_pic;}public interface OnSelectListener {void onSelectAddCar (int position); //处理加入购物车按钮的方法}
}
3.菜品详情功能业务实现
3.1搭建菜品详情界面布局放置三个TextView用于展示菜品名称月售数量与好评度及价格放置一个ImageView控件用于显示菜品的图片。
3.2实现菜品详情界面显示功能
package com.example.meituan;import android.os.Bundle;
import android.widget.ImageView;
import android.widget.TextView;import androidx.appcompat.app.AppCompatActivity;import com.bumptech.glide.Glide;
import com.example.order.bean.FoodBean;public class FoodActivity extends AppCompatActivity {private FoodBean bean;private TextView tv_food_name, tv_sale_num, tv_price;private ImageView iv_food_pic;Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_food);//从店铺详情界面传递过来的菜的数据bean (FoodBean) getIntent().getSerializableExtra(food);initView();setData();}/*** 初始化界面控件*/private void initView() {tv_food_name findViewById(R.id.tv_food_name);tv_sale_num findViewById(R.id.tv_sale_num);tv_price findViewById(R.id.tv_price);iv_food_pic findViewById(R.id.iv_food_pic);}/*** 设置界面数据*/private void setData() {if (bean null) return;tv_food_name.setText(bean.getFoodName());tv_sale_num.setText(月售 bean.getSaleNum());tv_price.setText( bean.getPrice());Glide.with(this).load(bean.getFoodPic()).error(R.mipmap.ic_launcher).into(iv_food_pic);}
}
4、订单功能业务实现
4.1搭建订单界面布局用于展示收获地址订单列表小计配送费订单总价及“去支付”按钮。具体代码如下
?xml version1.0 encodingutf-8?FrameLayoutxmlns:androidhttp://schemas.android.com/apk/res/androidandroid:layout_widthmatch_parentandroid:layout_heightmatch_parentandroid:backgroundandroid:color/whiteandroid:orientationverticalinclude layoutlayout/order_head/include layoutlayout/payment //FrameLayout
其中order_head.xml放置五个TextView用于显示“收货地址”“小计”“配送费”放置一个EditText控件用于输入收货地址。Payment.xml放置三个TextView控件分别用于显示“订单总价”以及“去支付”按钮。
4.2搭建订单列表条目界面布局用于展示菜品的名称数量及总价信息布局代码如下
?xml version1.0 encodingutf-8?
RelativeLayout xmlns:androidhttp://schemas.android.com/apk/res/androidandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:layout_marginLeft8dpandroid:layout_marginTop8dpandroid:layout_marginRight8dpandroid:backgrounddrawable/menu_item_bg_selectorandroid:padding10dpImageViewandroid:idid/iv_food_picandroid:layout_width80dpandroid:layout_height60dpandroid:layout_alignParentLefttrue /LinearLayoutandroid:idid/ll_infoandroid:layout_widthwrap_contentandroid:layout_height60dpandroid:layout_marginLeft10dpandroid:layout_toRightOfid/iv_food_picandroid:gravitycenterandroid:orientationverticalTextViewandroid:idid/tv_food_nameandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:textColorandroid:color/blackandroid:textSize14sp /TextViewandroid:idid/tv_countandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:layout_marginTop10dpandroid:textColorandroid:color/blackandroid:textSize12sp //LinearLayoutTextViewandroid:idid/tv_moneyandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:layout_alignParentRighttrueandroid:layout_centerVerticaltrueandroid:layout_marginRight10dpandroid:textColorandroid:color/blackandroid:textSize12sp /
/RelativeLayout4.3搭建支付界面布局该界面为一个对话框的样式显示一个文本信息和二维码图片该界面布局如下
LinearLayoutxmlns:androidhttp://schemas.android.com/apk/res/androidandroid:layout_widthmatch_parentandroid:layout_heightmatch_parentandroid:orientationverticalTextViewandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:layout_marginBottom10dpandroid:layout_marginLeft6dpandroid:text请扫描下方二维码进行支付android:textColorandroid:color/whiteandroid:textSize16sp /ImageViewandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:scaleTypefitXYandroid:srcdrawable/qr_code /
/LinearLayout 4.4编写订单列表的数据适配器:创建一个数据适配器OrderAdapter对ListView控件进行数据适配
package com.example.shop.adapter;import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.TextView;import com.bumptech.glide.Glide;
import com.example.meituan.R;
import com.example.order.bean.FoodBean;import java.math.BigDecimal;
import java.util.List;public class OrderAdapter extends BaseAdapter {private Context mContext;private ListFoodBean fbl;public OrderAdapter(Context context) {this.mContext context;}/*** 设置数据更新界面*/public void setData(ListFoodBean fbl) {this.fbl fbl;notifyDataSetChanged();}/*** 获取条目的总数*/Overridepublic int getCount() {return fbl null ? 0 : fbl.size();}/*** 根据position得到对应条目的对象*/Overridepublic FoodBean getItem(int position) {return fbl null ? null : fbl.get(position);}/*** 根据position得到对应条目的Id*/Overridepublic long getItemId(int position) {return position;}/*** 得到相应position对应的条目视图position是当前条目的位置* convertView参数是滚出屏幕的条目的视图*/Overridepublic View getView(final int position, View convertView, ViewGroup parent) {final ViewHolder vh;//复用convertViewif (convertView null) {vh new ViewHolder();convertView LayoutInflater.from(mContext).inflate(R.layout.order_item,null);vh.tv_food_name convertView.findViewById(R.id.tv_food_name);vh.tv_count convertView.findViewById(R.id.tv_count);vh.tv_money convertView.findViewById(R.id.tv_money);vh.iv_food_pic convertView.findViewById(R.id.iv_food_pic);convertView.setTag(vh);} else {vh (ViewHolder) convertView.getTag();}//获取position对应的条目数据对象final FoodBean bean getItem(position);if (bean ! null) {vh.tv_food_name.setText(bean.getFoodName());vh.tv_count.setText(xbean.getCount());vh.tv_money.setText(bean.getPrice().multiply(BigDecimal.valueOf(bean.getCount())));Glide.with(mContext).load(bean.getFoodPic()).error(R.mipmap.ic_launcher).into(vh.iv_food_pic);}return convertView;}class ViewHolder {public TextView tv_food_name, tv_count, tv_money;public ImageView iv_food_pic;}
} 4.5实现订单显示与支付功能:订单界面的数据是从店铺详情界面传递过来的
package com.example.meituan;import android.app.Dialog;
import android.os.Bundle;
import android.view.View;
import android.widget.ListView;
import android.widget.RelativeLayout;
import android.widget.TextView;import androidx.appcompat.app.AppCompatActivity;import com.example.shop.adapter.OrderAdapter;
import com.example.order.bean.FoodBean;import java.math.BigDecimal;
import java.util.List;public class OrderActivity extends AppCompatActivity {private ListView lv_order;private OrderAdapter adapter;private ListFoodBean carFoodList;private TextView tv_title, tv_back,tv_distribution_cost,tv_total_cost,tv_cost,tv_payment;private RelativeLayout rl_title_bar;private BigDecimal money,distributionCost;Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_order);//获取购物车中的数据carFoodList (ListFoodBean) getIntent().getSerializableExtra(carFoodList);//获取购物车中菜的总价格moneynew BigDecimal(getIntent().getStringExtra(totalMoney));//获取店铺的配送费distributionCostnew BigDecimal(getIntent().getStringExtra(distributionCost));initView();setData();}/*** 初始化界面控件*/private void initView(){tv_title findViewById(R.id.tv_title);tv_title.setText(订单);rl_title_bar findViewById(R.id.title_bar);rl_title_bar.setBackgroundColor(getResources().getColor(R.color.blue_color));tv_back findViewById(R.id.tv_back);lv_order findViewById(R.id.lv_order);tv_distribution_cost findViewById(R.id.tv_distribution_cost);tv_total_cost findViewById(R.id.tv_total_cost);tv_cost findViewById(R.id.tv_cost);tv_payment findViewById(R.id.tv_payment);// 返回键的点击事件tv_back.setOnClickListener(new View.OnClickListener() {Overridepublic void onClick(View v) {finish();}});tv_payment.setOnClickListener(new View.OnClickListener() {Overridepublic void onClick(View view) { //“去支付”按钮的点击事件Dialog dialog new Dialog(OrderActivity.this, R.style.Dialog_Style);dialog.setContentView(R.layout.qr_code);dialog.show();}});}/*** 设置界面数据*/private void setData() {adapternew OrderAdapter(this);lv_order.setAdapter(adapter);adapter.setData(carFoodList);tv_cost.setText(money);tv_distribution_cost.setText(distributionCost);tv_total_cost.setText((money.add(distributionCost)));}
} 五、实验结果与分析
店铺列表界面展示一些店铺信息组成的列表与一个水平滑动的广告栏 店铺详情界面点击店铺列表中的任意一个条目或广告栏中的任意一张图片程序会跳转到对应的店铺详情界面该界面展示的是店铺的公告信息配送信息菜单列表以及购物车列表界面点击菜单列表条目右侧的“加入购物车”按钮可以将菜品添加的菜品数量。如图所示 点击购物车会弹起一个已选商品的列表点击“-”和“”可以减少或者增加菜品的数量如果加入购物车的菜品总价达不到起送价会显示还差多少起送要是达到起送价格会显示“去结算”按钮。在最右边的这张图中有个清空的按钮界面为对话框样式。如下图所示 菜品详情界面点击菜单列表任意一个条目程序会跳转到菜品详情界面该界面也是一个对话框的样式。界面如上右边这个图所示
订单界面点击“去结算”按钮会跳出订单界面该界面会通过列表展示购物车中的菜品信息点击“去支付”程序会弹出一个显示支付二维码的对话框如下图所示