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