仿京东商城系列7------商品分类页面

本项目来自菜鸟窝,有兴趣者点击http://www.cniao5.com/course/

项目已经做完,
https://github.com/15829238397/CN5E-shop


仿京东商城系列0------项目简介
仿京东商城系列1------fragmentTabHost实现底部导航栏
仿京东商城系列2------自定义toolbar
仿京东商城系列3------封装Okhttp
仿京东商城系列4------轮播广告条
仿京东商城系列5------商品推荐栏
仿京东商城系列6------下拉刷新上拉加载的商品列表
仿京东商城系列7------商品分类页面
仿京东商城系列8------自定义的数量控制器
仿京东商城系列9------购物车数据存储器实现
仿京东商城系列10------添加购物车,管理购物车功能实现
仿京东商城系列11------商品排序功能以及布局切换实现(Tablayout)
仿京东商城系列12------商品详细信息展示(nativie与html交互)
仿京东商城系列13------商品分享(shareSDK)
仿京东商城系列14------用户登录以及app登录拦截
仿京东长城系列15------用户注册,SMSSDK集成
仿京东商城系列16------支付SDK集成
仿京东商城系列17------支付功能实现
仿京东商城系列18------xml文件读取(地址选择器)
仿京东商城系列19------九宫格订单展示
仿京东商城系列20------终章


前言

本文我们将一起实现一个仿京东商品分类页面。废话不说,上图:

商品分类.gif

内容

  • 商品分类展示页面涉及到的技术有Okhttp , Fresco加载机制,MaterialRefreshLayout + recyclerview下拉加载控件。关于上述控件的说明在之前就已经有所说明。在此不做介绍。

  • 关于页面的布局如下:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <com.example.cne_shop.widget.CnToolbar
        android:id="@+id/toolBar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:minHeight="?attr/actionBarSize"
        android:minWidth="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        app:title="@string/tab_assort"
        android:titleTextColor="@color/white"
        app:isShowSearchView="false"

        ></com.example.cne_shop.widget.CnToolbar>

    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        >

        <android.support.v7.widget.RecyclerView
            android:layout_width="@dimen/classify_layout_width"
            android:layout_height="match_parent"
            android:id="@+id/ass_first_recyclerview"
            android:background="@color/white">

        </android.support.v7.widget.RecyclerView>

        <LinearLayout
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            >

            <com.daimajia.slider.library.SliderLayout
                android:layout_width="match_parent"
                android:layout_height="@dimen/classify_Slider_height"
                android:id="@+id/slidLayout">

            </com.daimajia.slider.library.SliderLayout>

            <com.cjj.MaterialRefreshLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:id="@+id/materialRefreshLayout">

                <android.support.v7.widget.RecyclerView
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:id="@+id/ass_show_recyclerview">

                </android.support.v7.widget.RecyclerView>

            </com.cjj.MaterialRefreshLayout>

        </LinearLayout>

    </LinearLayout>

</LinearLayout>

布局使用了一个slider轮播,控件,两个ReciclerView控件,其中一个被MaterialRefreshLayout包裹,具有上拉加载功能。
功能的具体实现在此不做说明,有兴趣者请看文章开头源码。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容