The sixth day of Mobile Mall, using the GridView to implement the recommended areas and hot areas

Code has been submitted code cloud, interested can be downloaded to see

Https://git.oschina.net/joy_yuan/ShoppingMall

This code effect:

650) this.width=650; "Src=" https://s1.51cto.com/wyfs02/M02/05/78/wKiom1mlhtTCNdIVAAHLpCj-7As965.png-wh_500x0-wm_ 3-wmp_4-s_95162089.png "title=" qq picture 20170829232324.png "alt=" Wkiom1mlhttcndivaahlpcj-7as965.png-wh_50 "/>

The effect is shown in 2 regions, one is divided into three columns, one is 2 columns, the code is similar, take an area to do an example.

First, recommended area

Layout file: The whole is a linear layout with 2 sub-layouts, a linear layout, and a GridView.

The focus is on the GridView, setting numcloumns=3 to show the data in three columns

<?xml version= "1.0"  encoding= "Utf-8"? ><linearlayout xmlns:android= "http// Schemas.android.com/apk/res/android "               android:background= "#fff"                android:orientation= "Vertical"                android:layout_width= "Match_parent"                android:layout_height= "Match_parent" >    <linearlayout         android:padding= "10DP"          android:gravity= "Center_vertical"         android:layout_ Width= "Match_parent"         android:layout_height= "Wrap_content" >       &nBsp; <imageview            android:src= "@ Drawable/home_arrow_left_new "            android: Layout_width= "Wrap_content"             android: layout_height= "Wrap_content"/>        <textview             android:text= "New Product Recommendation"              android:textcolor= "#000"              android:layout_marginleft= "10DP"              android:layout_width= "Wrap_content"              android:layout_height= "Wrap_content"/>         <textview             android:id= "@+id/tv_more_remommend"              android:text= "See more"              android:gravity= "End"              android:drawableright= "@drawable/home_arrow_right"              android:drawablepadding= "5DP"              android:layout_weight= "1"              android:layout_width= "Wrap_content"              android:layout_height= "Wrap_content"/>    </linearlayout>     <gridview        android:id= "@+id/gv_ Commend "         android:numcolumns= "3"         android:layout_ Width= "Match_parent"         android:layout_height= "380DP" ></ Gridview></linearlayout>

The layout of each item of the GridView is as follows:

The perimeter is a linear layout, which then contains pictures, text

<?xml version= "1.0"  encoding= "Utf-8"? ><linearlayout xmlns:android= "http// Schemas.android.com/apk/res/android "               android:orientation= "Vertical"                android:gravity= "Center_horizontal"                android:padding= "10DP"                android:layout_width= "Match_parent"                android:layout_height= "Match_parent" >    < Imageview        android:id= "@+id/iv_recommend"          android:background= "@drawable/new_img_loading_2"          android:layout_width= "100DP "        android:layout_height=" 100DP "/>     <textview        android:id= "@+id/tv_name"          android:textcolor= "#000"         android:text= " Full-time Pre-sale "meow deer sauce" Cherry honey   woolen embroidery   small high waist half skirt "        android:lines=" 2 "         android:ellipsize= "End"          android:layout_margintop= "10DP"         android:layout_width= " 100DP "        android:layout_height=" Wrap_content "/>     <textview        android:id= "@+id/tv_price"          android:textcolor= "#ff4242"          android:text= "￥88.00" &nbSp;       android:layout_width= "Wrap_content"          android:layout_height= "Wrap_content"/></linearlayout>

Second, in the Homefragmentadapter

1, create the viewholder of the recommended area

/** *  create viewholder  equivalent to GetView in Baseadapter, equivalent to viewholder part code  *  @param  parent  *  @param  viewType   Current type  *  @return    returns the layout of a control to display, such as r below. Layout.banner_viewpager This layout page, etc.  */@Overridepublic  recyclerview.viewholder oncreateviewholder ( Viewgroup parent, int viewtype)  {    if  (Viewtype==banner) {         return new bannerviewholder (context,layoutInflater.inflate (R.layout.banner_viewpager,null));     }else if  (Viewtype==channel) {         return new channelviewholder (Context,layoutinflater.inflate (r.layout.channel_item,null));     }else if  (viewtype==act) {         Return new actviewholder (Context,layoutinflater.inflate (R.layout.act_item,null));    & nbSP;} else if  (Viewtype==seckill) {  //seconds kill         return   new seckillviewholder (Context,layoutinflater.inflate (r.layout.seckill_item,null));     }else if  (viewtype==recommend) {         Return new recommendviewholder (Context,layoutinflater.inflate (r.layout.recomment_item,null));     }else if  (viewtype==hot) {        return  new hotviewholder (Context, layoutinflater.inflate (r.layout.hot_item,null));     }    return null;} 2, bound data to this area/** *  equivalent to GetView in the binding data  *  @param  holder *  @param  position  */@Overridepublic  void onbindviewholder (recyclerview.viewholder holder, int  Position)  {    //through position to get what type is currently     if  (Getitemviewtype (position) ==banner) {        //is the BANNER type, Turn holder strong into bannerviewholder        bannerviewholder  bannerviewholder=  (Bannerviewholder)  holder;         Bannerviewholder.setdata (Resultbean.getbanner_info ());    }else if  ( Getitemviewtype (position) ==channel) {        channelviewholder  channelviewholder=  (Channelviewholder)  holder;         Channelviewholder.setdata (Resultbean.getchannel_info ());    }else if  ( Getitemviewtype (position) ==act) {        actviewholder  actviewholder=  (Actviewholder)  holder;         Actviewholder.setdata (Resultbean.getact_info ());    }else if  (getItemviewtype (position) ==seckill) {  //sec kill          seckillviewholder seckillviewholder=  (Seckillviewholder)  holder;         seckillviewholder.setdata (Resultbean.getseckill_info ());    }else  if  (Getitemviewtype (position) ==recommend) {         recommendviewholder recommendviewholder=  (Recommendviewholder)  holder;         recommendviewholder.setdata (Resultbean.getrecommend_info ());     } else if  (Getitemviewtype (position) ==hot) {         hotviewholder hotviewholder=  (Hotviewholder)  holder;         hotviewholder.setdata (Resultbean.gethot_info ());    }}/** *  recommended Viewholder  */class recommendviewholder extends&nbsP recyclerview.viewholder{    textview tv_more_remommend;     Gridview gv_commend;    public recommendviewholder (final Context  context, view inflate)  {        super (inflate);         tv_more_remommend=  (TextView)  inflate.findviewbyid (r.id.tv _more_remommend);        gv_commend=  (GridView)   Inflate.findviewbyid (r.id.gv_commend);         gv_ Commend.setonitemclicklistener (New adapterview.onitemclicklistener ()  {              @Override              public void onitemclick (Adapterview<?> parent, view view,  int position, long id)  {  &Nbsp;             toast.maketext (Context,   "position==" +position, toast.length_short). Show ();                 //Click to jump to the details page                  startgoodsinfoactivity ();             }        });     }    3,   Set the adapter to display the data     public void setdata (List <resultbeandata.resultbean.recommendinfobean> recommend_info)  {         recommendadapter adapter=new recommendadapter (Context,recommend_info);         gv_commend.setadapter (adapter);     }}

Third, the GridView adapter, similar to the ListView adapter, are extends Baseadapter, implement the method inside

Notice that inside the inner class Viewholder is created to temporarily store the item internal control for each gridview

package com.yuanlp.shoppingmall.home.adapter;import android.content.context;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.yuanlp.shoppingmall.r;import com.yuanlp.shoppingmall.home.model.resultbeandata;import  com.yuanlp.shoppingmall.utils.constants;import java.util.list;/** * created by  原立鹏  on 2017/8/29. */public class recommendadapter extends baseadapter {     private final Context context;    private  final list<resultbeandata.resultbean.recommendinfobean> recommend_info;     public recommendadapter (context context, list< Resultbeandata.resultbean.recommendinfobean> recommend_info)  {        this.context=context;         this.recommend_info=recommend_info;    }     @Override      public int getcount ()  {        return  Recommend_info.size ();    }     @Override     public  view getview (int position, view convertview, viewgroup parent)  {         viewholder viewholder=new viewholder ();         if  (convertview==null) {             convertview=view.inflate (context, r.layout.item_recommend,null);             viewholder.iv_recommend=  (ImageView)  convertview.findviewbyid (R.id.iv_recoMmend);            viewholder.tv_name=  ( TextView)  convertview.findviewbyid (r.id.tv_name);             viewholder.tv_price=  (TextView)  convertview.findviewbyid (r.id.tv_price);             convertview.settag (Viewholder);         }else{             viewholder=  (Viewholder)  convertview.gettag ();         }        resultbeandata.resultbean.recommendinfobean  Recommendinfobean = recommend_info.get (position);         Glide.with (context). Load (Constants.img_url+recommendinfobean.getfigure ()). into (viewholder.iv_recommend);        &nbSp;viewholder.tv_name.settext (Recommendinfobean.getname ());         Viewholder.tv_price.setText (Recommendinfobean.getcover_price ());         return convertView;    }     @Override      public object getitem (int position)  {         return recommend_info.get (position);    }     @Override     public long getitemid (int position)  {         return position;    }    class  viewholder {        textview tv_name;         textview tv_price;        imageview  iv_recommend;    }}

Tomorrow the use of Scrollviewcontainer this third-party plug-in, to achieve click on the product to jump to the Product Details page.

This article is from the "Yuangushi" blog, make sure to keep this source http://cm0425.blog.51cto.com/10819451/1960968

The sixth day of Mobile Mall, using the GridView to implement the recommended areas and hot areas