Android实现京东首页效果

本文实例为大家分享了Android实现京东首页效果的具体代码,供大家参考,具体内容如下

1.效果图:

2.布局

源码链接

<?xml version="1.0" encoding="utf-8"?>

<com.scwang.smart.refresh.layout.SmartRefreshLayout xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:app="http://schemas.android.com/apk/res-auto"

android:id="@+id/refresh_view"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:background="@color/background_color"

app:srlDisableContentWhenRefresh="true"

app:srlEnableOverScrollBounce="false"

app:srlHeaderMaxDragRate="2"

app:srlPrimaryColor="@color/theme_color">

<RelativeLayout

android:layout_width="match_parent"

android:layout_height="match_parent">

<androidx.coordinatorlayout.widget.CoordinatorLayout

android:layout_width="match_parent"

android:layout_height="match_parent">

<com.google.android.material.appbar.AppBarLayout

android:id="@+id/app_bar"

android:layout_width="match_parent"

android:layout_height="wrap_content"

app:elevation="0dp"

app:layout_behavior="com.yuruiyin.appbarlayoutbehavior.AppBarLayoutBehavior">

<com.google.android.material.appbar.CollapsingToolbarLayout

android:layout_width="match_parent"

android:layout_height="wrap_content"

app:layout_scrollFlags="scroll|exitUntilCollapsed">

<RelativeLayout

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:background="@color/white_color">

<ImageView

android:layout_width="match_parent"

android:layout_height="180dp"

android:scaleType="fitXY"

android:visibility="gone"

android:src="@drawable/ic_launcher_background" />

<RelativeLayout

android:id="@+id/ll_header"

android:layout_width="match_parent"

android:layout_height="wrap_content"

/>

</RelativeLayout>

<!-- 给SlidingTabLayout占位的-->

<androidx.appcompat.widget.Toolbar

android:id="@+id/toolbar"

android:layout_width="match_parent"

android:layout_height="40dp" />

</com.google.android.material.appbar.CollapsingToolbarLayout>

<com.flyco.tablayout.SlidingTabLayout

android:id="@+id/tab_layout"

android:layout_width="match_parent"

android:layout_height="50dp"

android:background="@color/background_color"

app:tl_indicator_height="0dp"

app:tl_textBold="SELECT"

app:tl_textSelectColor="#f000"

app:tl_textUnselectColor="@color/txt_color"

app:tl_textsize="16sp" />

</com.google.android.material.appbar.AppBarLayout>

<androidx.viewpager.widget.ViewPager

android:id="@+id/view_pager"

android:layout_width="match_parent"

android:layout_height="match_parent"

app:layout_behavior="@string/appbar_scrolling_view_behavior" />

</androidx.coordinatorlayout.widget.CoordinatorLayout>

<RelativeLayout android:id="@+id/ll_fotter"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:layout_marginBottom="50dp"

android:layout_alignParentBottom="true">

</RelativeLayout>

<RelativeLayout

android:id="@+id/rl_float_search"

android:layout_width="match_parent"

android:layout_height="40dp"

android:background="@color/theme_color">

<include layout="@layout/top_view_layout" />

</RelativeLayout>

</RelativeLayout>

</com.scwang.smart.refresh.layout.SmartRefreshLayout>

3.功能

package com.example.doublesucktopdemo;

import android.os.Bundle;

import android.util.Log;

import android.view.View;

import android.widget.ImageView;

import android.widget.LinearLayout;

import android.widget.RelativeLayout;

import android.widget.Toast;

import androidx.annotation.NonNull;

import androidx.annotation.Nullable;

import androidx.cardview.widget.CardView;

import androidx.coordinatorlayout.widget.CoordinatorLayout;

import androidx.fragment.app.Fragment;

import androidx.fragment.app.FragmentActivity;

import androidx.recyclerview.widget.GridLayoutManager;

import androidx.recyclerview.widget.LinearLayoutManager;

import androidx.recyclerview.widget.RecyclerView;

import androidx.viewpager.widget.ViewPager;

import com.chad.library.adapter.base.BaseQuickAdapter;

import com.example.doublesucktopdemo.adapter.HomeViewPagerAdapter;

import com.example.doublesucktopdemo.adapter.MyBannerAdapter;

import com.example.doublesucktopdemo.adapter.RecommendAdapter;

import com.example.doublesucktopdemo.grid.MyAdapter2;

import com.example.doublesucktopdemo.grid.PagerConfig;

import com.example.doublesucktopdemo.grid.PagerGridLayoutManager;

import com.example.doublesucktopdemo.widget.RecyclerViewDivider;

import com.example.doublesucktopdemo.widget.RefreshHeaderView.TodayNewsHeader;

import com.flyco.tablayout.SlidingTabLayout;

import com.flyco.tablayout.listener.OnTabSelectListener;

import com.google.android.material.appbar.AppBarLayout;

import com.leaf.library.StatusBarUtil;

import com.scwang.smart.refresh.layout.SmartRefreshLayout;

import com.scwang.smart.refresh.layout.api.RefreshLayout;

import com.scwang.smart.refresh.layout.listener.OnRefreshListener;

import com.youth.banner.Banner;

import com.youth.banner.config.IndicatorConfig;

import com.youth.banner.indicator.CircleIndicator;

import java.util.ArrayList;

import java.util.List;

/**

* Created by weioule

* on 2019/6/26.

*/

public class MainActivity extends FragmentActivity implements PagerGridLayoutManager

.PageListener {

private SmartRefreshLayout refreshView;

private AppBarLayout mAppBarLayout;

private RelativeLayout mFloatSearchRl;

///非常重要

private RelativeLayout mHeaderLl;

private RelativeLayout mFotterLl;

CardView mCardView;

private SlidingTabLayout mTabView;

private ViewPager mViewPager;

private int totalScrollRange, oldVerticalOffset = -1;

private HomeViewPagerAdapter fragmentAdapter;

private String[] titles = {"首页", "手机", "食品", "生鲜", "休闲零食", "家居厨具", "美妆"};

private ArrayList<ProductBean> list = new ArrayList<>();

private List<Fragment> fragmentList;

private int mRows = 1; //设置行数

private int mColumns = 4; //设置列数

private RecyclerView mRecyclerView;

private MyAdapter2 mAdapter;

private PagerGridLayoutManager mLayoutManager;

private RelativeLayout lineParent;

private int mTotal = 0;

private int mCurrent = 0;

private View lineChild;

private ImageView iv_icon_bottom;

private RelativeLayout rl_cancel_bottom;

private String[] names = {"多多果园","九块九特卖","多多爱消除","天天领现金"

,"行家帮你选","限时秒杀","断码清仓","跟着好评买"

,"充值中心","医药馆","签到","多多赚大钱"

,"砍价免费拿","多多精灵","省钱月卡","现金大转盘"

};

@Override

protected void onCreate(@Nullable Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

initView();

addListener();

}

private void initView() {

// StatusBarUtil.setColor(this, getColor(R.color.theme_color));

refreshView = findViewById(R.id.refresh_view);

mFloatSearchRl = findViewById(R.id.rl_float_search);

mAppBarLayout = findViewById(R.id.app_bar);

mTabView = findViewById(R.id.tab_layout);

mViewPager = findViewById(R.id.view_pager);

mHeaderLl = findViewById(R.id.ll_header);

mFotterLl = findViewById(R.id.ll_fotter);

refreshView.setRefreshHeader(new TodayNewsHeader(this));

addProductBeans();

getData();

}

private void addListener() {

mAppBarLayout.addOnOffsetChangedListener(offsetChangedListener);

refreshView.setOnRefreshListener(new OnRefreshListener() {

@Override

public void onRefresh(@NonNull RefreshLayout refreshLayout) {

loadData();

}

});

}

private void loadData() {

refreshView.postDelayed(new Runnable() {

@Override

public void run() {

refreshView.finishRefresh();

refreshView.setEnabled(true);

}

}, 800);

}

// 这里的处理是当AppBarLayout处于最顶部也就是完全打开状态verticalOffse=0时才允许刷新控件可用.

private AppBarLayout.OnOffsetChangedListener offsetChangedListener = new AppBarLayout.OnOffsetChangedListener() {

@Override

public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffse) {

totalScrollRange = appBarLayout.getTotalScrollRange();

if (oldVerticalOffset == verticalOffse) return;

if (verticalOffse == 0) {

refreshView.setEnabled(true);

} else {

refreshView.setEnabled(false);

}

if (verticalOffse <= -Utils.dp2px(40)) {

mFloatSearchRl.setVisibility(View.VISIBLE);

} else {

mFloatSearchRl.setVisibility(View.GONE);

}

if (Math.abs(verticalOffse) >= totalScrollRange && totalScrollRange != 0) {

mTabView.setBackgroundColor(getResources().getColor(R.color.white_color));

} else {

mTabView.setBackgroundColor(getResources().getColor(R.color.background_color));

}

oldVerticalOffset = verticalOffse;

}

};

public void getData() {

mHeaderLl.removeAllViews();

mFotterLl.removeAllViews();

addTopView();

addBannerView();

addBannerTab();

addBottom();

// addRecommendView();

// addFeaturedView(); 图片

initViewpager();

}

private void addBannerTab() {

View mTopView = getLayoutInflater().inflate(R.layout.activity_two, mHeaderLl, false);

lineParent = mTopView.findViewById(R.id.rl_line_parent);

lineChild = mTopView.findViewById(R.id.view_line_child);

mLayoutManager = new PagerGridLayoutManager(mRows, mColumns, PagerGridLayoutManager

.HORIZONTAL);

// 系统带的 RecyclerView,无需自定义

mRecyclerView =mTopView.findViewById(R.id.recycler_view);

// 水平分页布局管理器

mLayoutManager.setPageListener(this); // 设置页面变化监听器

mRecyclerView.setLayoutManager(mLayoutManager);

// 如果需要查看调试日志可以设置为true,一般情况忽略即可

PagerConfig.setShowLog(true);

initData();

mHeaderLl.addView(mTopView);

}

private void initData() {

List<String> list = new ArrayList<>();

for (int i = 0; i < 16; i++) {

list.add(names[i]);

}

// mAdapter.refreshDataList(list);

// 使用原生的 Adapter 即可

mAdapter = new MyAdapter2(MainActivity.this, list);

mRecyclerView.setAdapter(mAdapter);

}

private void addTopView() {

View mTopView = getLayoutInflater().inflate(R.layout.top_view_layout, mHeaderLl, false);

mHeaderLl.addView(mTopView);

}

private void addBottom() {

View mTopView = getLayoutInflater().inflate(R.layout.bottom_layout, mFotterLl, false);

iv_icon_bottom = mTopView.findViewById(R.id.iv_icon_bottom);

rl_cancel_bottom= mTopView.findViewById(R.id.rl_cancel_bottom);

iv_icon_bottom.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View view) {

Log.e("TAG","click iv_icon_bottom ");

}

});

rl_cancel_bottom.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View view) {

Log.e("TAG","click cancel");

}

});

mFotterLl.addView(mTopView);

}

private void addBannerView() {

View mBannerView = getLayoutInflater().inflate(R.layout.banner_layout, mHeaderLl, false);

Banner mBanner = mBannerView.findViewById(R.id.banner);

ArrayList<ProductBean> list = new ArrayList<>();

for (int i = 0; i < 3; i++) {

list.add(new ProductBean("三会一课","2","会议",R.mipmap.ic_launcher));

}

mBanner.addBannerLifecycleObserver(this)

.setAdapter(new MyBannerAdapter(list))

.setIndicator(new CircleIndicator(this))

.setIndicatorGravity(IndicatorConfig.Direction.RIGHT)

.start();

mHeaderLl.addView(mBannerView);

}

private void addRecommendView() {

RecyclerView mRecyclerView = new RecyclerView(this);

GridLayoutManager gridLayoutManager = new GridLayoutManager(this, 6);

mRecyclerView.setLayoutManager(gridLayoutManager);

RecommendAdapter adapter = new RecommendAdapter(list);

adapter.setOnItemChildClickListener(new BaseQuickAdapter.OnItemChildClickListener() {

@Override

public void onItemChildClick(BaseQuickAdapter adapter, View view, int position) {

ProductBean productBean = (ProductBean) adapter.getItem(position);

Toast.makeText(MainActivity.this, productBean.getName(), Toast.LENGTH_SHORT).show();

}

});

mRecyclerView.setAdapter(adapter);

RecyclerViewDivider divider = new RecyclerViewDivider.Builder(this)

.setStyle(RecyclerViewDivider.Style.BOTH)

.setColor(0x00000000)

.setOrientation(RecyclerViewDivider.GRIDE_VIW)

.setSize(5)

.build();

mRecyclerView.addItemDecoration(divider);

mHeaderLl.addView(mRecyclerView);

}

private void addFeaturedView() {

View view = getLayoutInflater().inflate(R.layout.featured_layout, mHeaderLl, false);

mHeaderLl.addView(view);

}

private void initViewpager() {

if (fragmentList == null) {

fragmentList = new ArrayList<>();

} else {

fragmentList.clear();

}

for (int i = 0; i < titles.length; i++) {

fragmentList.add(new HomeFragment(list));

}

fragmentAdapter = new HomeViewPagerAdapter(getSupportFragmentManager(), fragmentList);

mViewPager.setAdapter(fragmentAdapter);

mTabView.setOnTabSelectListener(onTabSelectListener);

mViewPager.addOnPageChangeListener(onPageChangeListener);

mTabView.setViewPager(mViewPager, titles);

}

private OnTabSelectListener onTabSelectListener = new OnTabSelectListener() {

@Override

public void onTabSelect(int position) {

mTabView.setCurrentTab(position);

}

@Override

public void onTabReselect(int position) {

}

};

private ViewPager.OnPageChangeListener onPageChangeListener = new ViewPager.OnPageChangeListener() {

@Override

public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

}

@Override

public void onPageSelected(int position) {

mTabView.setCurrentTab(position);

}

@Override

public void onPageScrollStateChanged(int state) {

}

};

/**

* 控制appbar的滑动

*

* @param isScroll true 允许滑动 false 禁止滑动

*/

private void banAppBarScroll(boolean isScroll) {

View mAppBarChildAt = mAppBarLayout.getChildAt(0);

AppBarLayout.LayoutParams mAppBarParams = (AppBarLayout.LayoutParams) mAppBarChildAt.getLayoutParams();

if (isScroll && mAppBarParams.getScrollFlags() == 0) {

mAppBarParams.setScrollFlags(AppBarLayout.LayoutParams.SCROLL_FLAG_SCROLL | AppBarLayout.LayoutParams.SCROLL_FLAG_EXIT_UNTIL_COLLAPSED);

mAppBarChildAt.setLayoutParams(mAppBarParams);

} else if (mAppBarParams.getScrollFlags() != 0)

mAppBarParams.setScrollFlags(0);

}

/**

* 控制appbar的开关

* 需要手动开关时调用

*

* @param open true 打开 false 关闭

*/

public void switchAppbarLayout(boolean open) {

CoordinatorLayout.Behavior behavior = ((CoordinatorLayout.LayoutParams) mAppBarLayout.getLayoutParams()).getBehavior();

if (behavior instanceof AppBarLayout.Behavior) {

AppBarLayout.Behavior appBarLayoutBehavior = (AppBarLayout.Behavior) behavior;

int topAndBottomOffset = appBarLayoutBehavior.getTopAndBottomOffset();

if (open && topAndBottomOffset != 0) {

//打开

appBarLayoutBehavior.setTopAndBottomOffset(0);

} else if (!open) {

//关闭

if (totalScrollRange == 0) totalScrollRange = mAppBarLayout.getHeight();

appBarLayoutBehavior.setTopAndBottomOffset(-totalScrollRange);

}

}

}

private void addProductBeans() {

for (int i = 0; i < 10; i++) {

list.add(new ProductBean("智慧美食","2","美食",R.mipmap.ic_launcher));

}

}

@Override

public void onPageSizeChanged(int pageSize) {

mTotal = pageSize;

Log.e("TAG", "总页数 = " + pageSize);

}

@Override

public void onPageSelect(int pageIndex, int pageSize) {

mCurrent = pageIndex;

Log.e("TAG", "选中页码 = " + pageIndex + "\t" + pageSize);

//计算滚动条宽度

float proportion = (float) ((pageIndex + 1) / pageSize);

float transMaxRange = lineParent.getWidth() - lineChild.getWidth();

//设置滚动条移动

lineChild.setTranslationX(transMaxRange * proportion);

}

}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。

以上是 Android实现京东首页效果 的全部内容, 来源链接: utcz.com/p/243590.html

回到顶部