Android实现京东首页效果
本文实例为大家分享了Android实现京东首页效果的具体代码，供大家参考，具体内容如下
1.效果图：
源码链接
<?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);
}
}
相关文章
Vala
2020-03-25
Madge
2020-07-28
Camille
2023-07-21
Ianthe
2023-07-21
Kohana
2023-07-21
Bambi
2023-07-21
Hanna
2023-07-21
Laila
2023-07-21
Hasana
2023-07-21
Jacinda
2023-07-21
Tanya
2023-07-21
Ipo
2023-07-21
Ophelia
2023-07-21
Mora
2023-07-21
Bella
2023-07-21
Jacuqeline
2023-07-21
Bonnie
2023-07-21
Hana
2023-07-21