发帖
扫码访问
 注册
 登录
首页 ›编程› 软件学院 › 查看内容

Android仿淘宝购物车demo

2015-8-20 15:49 14402 0

摘要: 首先，小编简单的介绍一下listview，ListView 控件可使用四种不同视图显示项目。通过此控件，可将项目组成带有或不带有列标头的列，并显示伴随的图标和文本。 可使用 ListView 控件将称作 ListItem 对象的列表条目组 ...
关键词： nbsp Android layout content import LinearLayout height width public wrap

  

       首先，小编简单的介绍一下listview，ListView 控件可使用四种不同视图显示项目。通过此控件，可将项目组成带有或不带有列标头的列，并显示伴随的图标和文本。 可使用 ListView 控件将称作 ListItem 对象的列表条目组织成下列四种不同的视图之一：1.大（标准）图标2.小图标3.列表4.报表 View 属性决定在列表中控件使用何种视图显示项目。还可用 LabelWrap 属性控制列表中与项目关联的标签是否可换行显示。另外，还可管理列表中项目的排序方法和选定项目的外观。今天小编主要和小伙伴们分享一下，如何使用 listview实现购物的功能。做过Android的小伙伴都知道一个xml对应一个java类，但是购物车有点不一样，因为她里面的商品有可能不只一 件，所以我们需要有两个xml，两个java类，相对应的还需要一个适配器adapter，一个model，下面小编来详细的介绍一下实现购物车的过程。

        第一步，写model层，类似我们之前写过的实体层，具体代码如下所示：

        

[java] view plaincopyprint?
  1. <span style="font-size:18px;">/*** 
  2.  * 说明：购物车的相关信息 
  3.  * 作者：丁国华 
  4.  * 时间：2015年8月10日 09:41:18 
  5.  */  
  6. package jczb.shoping.model;  
  7.   
  8. import java.io.Serializable;  
  9. import java.util.ArrayList;  
  10. import java.util.List;  
  11.   
  12. import android.R.string;  
  13.   
  14. public class shoppingCart implements Serializable {  
  15.       
  16.         private String proImg;  
  17.         private String ProName;   
  18.         private String shopPrice;   
  19.         private String markPrice;   
  20.         private String proCount;  
  21.         public String getProImg() {  
  22.             return proImg;  
  23.         }  
  24.         public void setProImg(String proImg) {  
  25.             this.proImg = proImg;  
  26.         }  
  27.         public String getProName() {  
  28.             return ProName;  
  29.         }  
  30.         public void setProName(String proName) {  
  31.             ProName = proName;  
  32.         }  
  33.         public String getShopPrice() {  
  34.             return shopPrice;  
  35.         }  
  36.         public void setShopPrice(String shopPrice) {  
  37.             this.shopPrice = shopPrice;  
  38.         }  
  39.         public String getMarkPrice() {  
  40.             return markPrice;  
  41.         }  
  42.         public void setMarkPrice(String markPrice) {  
  43.             this.markPrice = markPrice;  
  44.         }  
  45.         public String getProCount() {  
  46.             return proCount;  
  47.         }  
  48.         public void setProCount(String proCount) {  
  49.             this.proCount = proCount;  
  50.         }  
  51.           
  52.       }  
  53. </span>  
        第二步，我们编写xml里面的文件，需要编写两个xml文件，首先我们来编写activity_shoppingcart.xml的文件，代码如下所示：
[html] view plaincopyprint?
  1. <span style="font-size:18px;"><?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout  xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="match_parent"  
  4.     android:layout_height="match_parent"  
  5.     android:orientation="vertical" >  
  6.       
  7.     <LinearLayout   
  8.           android:layout_width="match_parent"  
  9.           android:layout_height="50dp"  
  10.           android:background="#438FCB"  
  11.           android:orientation="horizontal">  
  12.             
  13.           <!-- 尖括号的布局 -->  
  14.           <ImageView   
  15.                android:layout_width="0dp"  
  16.                android:layout_height="match_parent"  
  17.                android:layout_weight="1"  
  18.                android:padding="8dp"  
  19.                android:src="@drawable/tb_icon_actionbar_back" />  
  20.          <!-- 购物车的布局 -->  
  21.          <TextView  
  22.              android:layout_width="0dp"  
  23.              android:layout_height="match_parent"  
  24.              android:layout_weight="5.49"  
  25.              android:gravity="center"  
  26.              android:text="购物车"  
  27.              android:textColor="#FFFFFF"  
  28.              android:textSize="20sp"/>  
  29.          <!-- 编辑的布局 -->  
  30.          <TextView   
  31.              android:layout_width="0dp"  
  32.              android:layout_height="match_parent"  
  33.              android:layout_weight="3.18"  
  34.              android:gravity="center"  
  35.              android:text="编辑"  
  36.              android:textColor="#FFFFFF"  
  37.              android:textSize="20sp" />  
  38.     </LinearLayout>  
  39.     <!-- listview，购物车里面的东西有可能比较多，需要用listview来进行显示 -->  
  40.     <LinearLayout  
  41.                 android:layout_width="fill_parent"  
  42.                 android:layout_height="wrap_content"  
  43.                 android:layout_weight="1"   
  44.                 android:orientation="vertical"  
  45.                 android:layout_marginTop="0dp">  
  46.            
  47.         <ListView   
  48.              android:id="@+id/cart_shopping_listview"  
  49.              android:layout_width="wrap_content"  
  50.              android:layout_height="wrap_content"  
  51.              android:divider="#808080"  
  52.              android:dividerHeight="0.5dp">  
  53.         </ListView>  
  54.            
  55.     </LinearLayout>  
  56.    
  57.     <LinearLayout  
  58.        android:layout_width="match_parent"  
  59.        android:layout_height="50dp"  
  60.        android:layout_alignParentBottom="true"  
  61.        android:orientation="horizontal">  
  62.          <!-- 全选的布局 -->  
  63.          <CheckBox   
  64.              android:layout_width="wrap_content"  
  65.              android:layout_height="wrap_content"  
  66.              android:layout_marginLeft="10dp"  
  67.              android:text="全选"/>  
  68.          <!-- 合计的布局 -->  
  69.          <TextView  
  70.              android:layout_width="0dp"  
  71.              android:layout_height="wrap_content"  
  72.              android:layout_weight="1"  
  73.              android:gravity="right"  
  74.              android:paddingRight="10dp"  
  75.              android:textColor="#F63A19"  
  76.              android:text="合计:￥88"/>  
  77.          <!-- 去结算的布局 -->  
  78.            
  79.         <TextView  
  80.              android:id="@+id/jiesuan_button"  
  81.              android:layout_width="80dp"  
  82.              android:layout_height="wrap_content"  
  83.              android:layout_marginRight="10dp"  
  84.              android:background="@drawable/android_login_color"  
  85.              android:gravity="center"  
  86.              android:padding="10dp"  
  87.              android:text="结算"/>  
  88.    </LinearLayout>  
  89.       
  90. </LinearLayout >  
  91. </span>  
       我们来看一下xml布局的效果，如下图所示：

        

       接着我们来布局第二个xml，activity_shoppingcart_item.xml，代码如下所示：

 

[html] view plaincopyprint?
  1. <span style="font-size:18px;"><?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="match_parent"  
  4.     android:layout_height="match_parent"  
  5.     android:orientation="vertical" >  
  6.     <LinearLayout   
  7.        android:layout_width="match_parent"  
  8.        android:layout_height="wrap_content"  
  9.        android:orientation="horizontal">  
  10.          <!-- 小对勾的布局 -->  
  11.   
  12.        <CheckBox  
  13.            android:id="@+id/pro_checkbox"  
  14.            android:layout_width="wrap_content"  
  15.            android:layout_height="wrap_content"  
  16.            android:focusable="false"  
  17.            android:focusableInTouchMode="false" />  
  18.   
  19.          <!-- 图片布局 -->  
  20.          <ImageView   
  21.              android:id="@+id/pro_image"  
  22.              android:layout_width="80dp"   
  23.              android:layout_height="80dp"  
  24.              android:layout_margin="5dp"  
  25.              android:scaleType="centerCrop"  
  26.              android:src="@drawable/detail_show_1"/>  
  27.          <!-- 商品名称和价格的布局 -->  
  28.          <LinearLayout   
  29.              android:layout_width="fill_parent"   
  30.              android:layout_height="wrap_content"  
  31.              android:orientation="vertical">  
  32.              <!-- 商品名称的布局 -->  
  33.              <TextView   
  34.                  android:id="@+id/pro_name"  
  35.                  android:layout_width="wrap_content"  
  36.                  android:layout_height="wrap_content"  
  37.                  android:layout_marginTop="10dp"  
  38.                  android:text="连衣裙女夏季"  
  39.                  />  
  40.              <!-- 价格的布局 -->  
  41.   
  42.              <LinearLayout  
  43.                  android:layout_width="match_parent"  
  44.                  android:layout_height="33dp"  
  45.                  android:orientation="horizontal" >  
  46.                     
  47.         <TextView  
  48.              android:id="@+id/pro_shopPrice"  
  49.                      android:layout_width="wrap_content"  
  50.                      android:layout_height="wrap_content"  
  51.                      android:layout_gravity="bottom"  
  52.                      android:layout_marginTop="10dp"  
  53.                      android:text="￥88"  
  54.                      android:textSize="16sp"/>  
  55.                     
  56.             <!-- <TextView  
  57.              android:id="@+id/pro_markPrice"  
  58.                      android:layout_width="wrap_content"  
  59.                      android:layout_height="wrap_content"  
  60.                      android:layout_gravity="bottom"  
  61.                      android:layout_marginTop="10dp"  
  62.                      android:text="￥66"  
  63.                      android:textSize="16sp"/> -->  
  64.                 </LinearLayout>  
  65.                
  66.              <LinearLayout  
  67.                  android:layout_width="150dp"  
  68.                  android:layout_height="33dp"  
  69.                  android:orientation="horizontal" >  
  70.                    <!-- 加号 -->  
  71.                   <Button  
  72.                       android:id="@+id/pro_add"  
  73.                       android:layout_width="wrap_content"  
  74.                       android:layout_height="34dp"  
  75.                       android:text="+" />  
  76.                     
  77.                   <TextView  
  78.                      android:id="@+id/pro_count"  
  79.                      android:layout_width="wrap_content"  
  80.                      android:layout_height="wrap_content"  
  81.                      android:layout_gravity="bottom"  
  82.                      android:layout_marginTop="10dp"  
  83.                      android:text="88"  
  84.                      android:textSize="13sp"/>  
  85.                     
  86.   
  87.                      <!-- 减号-->  
  88.                     <Button  
  89.                       android:id="@+id/pro_reduce"  
  90.                       android:layout_width="wrap_content"  
  91.                       android:layout_height="34dp"  
  92.                       android:layout_marginRight="0dp"  
  93.                       android:text="-" />  
  94.                    
  95.                  </LinearLayout>  
  96.           </LinearLayout>  
  97.  </LinearLayout>  
  98.   
  99. </LinearLayout>  
  100. </span>  
       布局效果如下所示：

         

       第三步、我们来编写适配器adapter中的代码，即ShoppingCartAdapter，具体代码如下所示：

[java] view plaincopyprint?
  1. <span style="font-size:18px;">package jczb.shoping.adapter;  
  2.   
  3. import java.util.List;  
  4.   
  5. import cn.jpush.android.data.r;  
  6.   
  7. import jczb.shoping.adapter.productsListAdapter.ViewHolder;  
  8. import jczb.shoping.adapter.productsListAdapter.searchList;  
  9. import jczb.shoping.model.productSonSorting_cate;  
  10. import jczb.shoping.model.shoppingCart;  
  11. import jczb.shoping.model.sonSortigns;  
  12. import jczb.shoping.ui.R;  
  13. import jczb.shoping.ui.ShoppingCartActivity;  
  14. import android.content.Context;  
  15. import android.content.Intent;  
  16. import android.content.DialogInte**ce.OnClickListener;  
  17. import android.os.Bundle;  
  18. import android.view.LayoutInflater;  
  19. import android.view.View;  
  20. import android.view.ViewGroup;  
  21. import android.widget.BaseAdapter;  
  22. import android.widget.Button;  
  23. import android.widget.CheckBox;  
  24. import android.widget.ImageView;  
  25. import android.widget.LinearLayout;  
  26. import android.widget.TextView;  
  27.   
  28. public class ShoppingCartAdapter extends BaseAdapter {  
  29.   
  30.     private Context mContext;   
  31.     private List<shoppingCart> mList;  
  32.       
  33.     public ShoppingCartAdapter(Context mContext,List<shoppingCart> mList) {   
  34.         super();   
  35.         this.mContext = mContext;   
  36.         this.mList = mList;   
  37.         }  
  38.       
  39.     @Override  
  40.     public int getCount() {  
  41.         // TODO Auto-generated method stub  
  42.         if (mList==null) {  
  43.             return 0;  
  44.         }else {  
  45.             return this.mList.size();  
  46.         }  
  47.     }  
  48.   
  49.     @Override  
  50.     public Object getItem(int position) {  
  51.         // TODO Auto-generated method stub  
  52.         if (mList == null) {   
  53.             return null;   
  54.         } else {   
  55.             return this.mList.get(position);   
  56.         }   
  57.     }  
  58.   
  59.     @Override  
  60.     public long getItemId(int position) {  
  61.         // TODO Auto-generated method stub  
  62.         return position;  
    63. <
声明：文章版权归原作者所有 部分文章转自互联网 如有侵权请联系 [邮箱地址] 删除

路过
雷人
1

握手
鲜花
鸡蛋

刚表态过的朋友 (1 人)

  • 握手

    匿名

收藏 分享 邀请
上一篇：手机淘宝前端的图片相关工作流程梳理下一篇：iOS 面试大全从简单到复杂（简单篇）

最新评论

相关分类

返回顶部