今天起把项目中写过的复杂的,简单的页面布局写一下,一方面给需要的人参考,另一方面加强自身熟练。
当我们拿到这样的一个效果图之后,要分析这个布局中存在哪些难点与冲突点,一般来说的话,所谓冲突无非就是控件使用的时候,执行类似的命令会达不到我们想要的效果,所以以上的图,我首先的想法是RecyclerView+ ScrollView,但是之前用过几次后发现滑动会产生很多冲突,所以我推荐使用Recyclerview+headerview的方式进行代码编写。
头布局及列表如下:
这样我们就可以轻松的使用RecyclerView啦。
适配器代码如下:
private class GoodsAdapter extends RecyclerView.Adapter {
private WeakReference<IntegralActivity> mReference;
private LayoutInflater mInflater;
private List<Goodlist> goodlist;
private final int POSITION_TOP = 1;
private final int POSITION_SINGLE = 2;
private List<BannerList> banlist;
private GoodsAdapter(IntegralActivity activity) {
mReference = new WeakReference<>(activity);
goodlist = new ArrayList<>();
banlist = new ArrayList<>();
if (mReference.get() != null) {
mInflater = mReference.get().getLayoutInflater();
goodlist = mReference.get().list;
banlist = mReference.get().bannerList;
}
}
@Override
public int getItemViewType(int position) {
if (position == 0)
return POSITION_TOP;
else
return POSITION_SINGLE;
}
@Override
public int getItemCount() {
return goodlist.size() + 1;
}
@Override
public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
IntegralActivity activity = mReference.get();
if (activity != null) {
//头部viewpager
if (viewType == POSITION_TOP) {
View view = mInflater.inflate(R.layout.item_viewpager,null);
TopViewHolder topViewHolder = new TopViewHolder(view);
topViewHolder.mViewPager = (AutoScrollViewPager) view.findViewById(R.id.viewpager_item);
topViewHolder.mIntagels = (TextView) view.findViewById(R.id.my_intagel_item);
topViewHolder.mFind = (TextView) view.findViewById(R.id.find_intage);
topViewHolder.mFirst = (TextView) view.findViewById(R.id.tv_first);
topViewHolder.mAll = (TextView) view.findViewById(R.id.tv_all);
topViewHolder.mLin = (RelativeLayout) view.findViewById(R.id.item_lin);
return topViewHolder;
} else {
View view = mInflater.inflate(R.layout.item_goods,null);
MainViewHolder holder = new MainViewHolder(view);
holder.mContent = (TextView) view.findViewById(R.id.content_item);
holder.mIntegal = (TextView) view.findViewById(R.id.inteali_item);
holder.mPrice = (TextView) view.findViewById(R.id.price_item);
holder.mPic = (ImageView) view.findViewById(R.id.goods_pic_item);
return holder;
}
}
return null;
}
// banner adapter
class ImageAdapter extends PagerAdapter {
@Override
public int getCount() {
if (banlist.size() == 0 || banlist.size() == 1) {
return 1;
} else {
return Integer.MAX_VALUE;
}
}
@Override
public Object instantiateItem(ViewGroup container, final int position) {
ImageView imageView = null;
imageView = new ImageView(mBaseActivity);
imageView.setScaleType(ImageView.ScaleType.FIT_XY);
// 加载图片
if (banlist.size() == 0) {
imageView.setImageResource(R.mipmap.error_top);
} else {
Glide.with(mBaseActivity).load(banlist.get(position % banlist.size()).getPicurl()).error(R.mipmap.error_top).fitCenter().into(imageView);
}
container.addView(imageView);
return imageView;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
((ViewPager) container).removeView((View) object);
}
@Override
public boolean isViewFromObject(View arg0, Object arg1) {
return arg0 == arg1;
}
}
@Override
public void onBindViewHolder(final RecyclerView.ViewHolder holder, final int position) {
IntegralActivity activity = mReference.get();
if (activity != null) {
if (holder instanceof TopViewHolder) {
TopViewHolder topholder = (TopViewHolder) holder;
ImageAdapter mImageAdapter = new ImageAdapter();
if (topholder.mViewPager != null)
topholder.mViewPager.setAdapter(mImageAdapter);
//若数据大小超过1,设置 自动轮播 若只有一张则不轮播,且不显示角标
if (banlist.size() > 1) {
topholder.mLin.setVisibility(View.VISIBLE);
// topholder.mViewPager.startAutoScroll();
topholder.mFirst.setText(1 + "");
} else {
topholder.mLin.setVisibility(View.INVISIBLE);
}
TopViewHolder topViewHolder = (TopViewHolder) holder;
topViewHolder.mFind.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
startActivity(new Intent(getApplicationContext(),IntegralWaterActivity.class));
}
});
topholder.mViewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
@Override
public void onPageSelected(int position) {
((TopViewHolder) holder).mFirst.setText((position + 1) + "");
}
@Override
public void onPageScrollStateChanged(int state) {
}
});
topholder.mAll.setText(banlist.size() + "");
} else {
MainViewHolder mainViewHolder = (MainViewHolder) holder;
mainViewHolder.mPrice.setText("价值"+goodlist.get(position -1).getPricedis());
mainViewHolder.mContent.setText("价值"+goodlist.get(position -1).getListname());
mainViewHolder.mIntegal.setText("价值"+goodlist.get(position -1).getNeedpoint());
if (goodlist.get(position- 1).getListpicurl() != null){
Glide.with(getApplicationContext()).load(goodlist.get(position - 1).getListpicurl()).placeholder(R.mipmap.error_goods).error(R.mipmap.error_goods).into(mainViewHolder.mPic);
}
mainViewHolder.itemView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Intent intent = new Intent(getApplicationContext(),GoodsDetailsActivity.class);
intent.putExtra("id",String.valueOf(goodlist.get(position).getGoodsid()));
startActivity(intent);
}
});
}
}
}
@Override
public void onAttachedToRecyclerView(RecyclerView recyclerView) {
super.onAttachedToRecyclerView(recyclerView);
RecyclerView.LayoutManager manager = recyclerView.getLayoutManager();
if(manager instanceof GridLayoutManager) {
final GridLayoutManager gridManager = ((GridLayoutManager) manager);
gridManager.setSpanSizeLookup(new GridLayoutManager.SpanSizeLookup() {
@Override
public int getSpanSize(int position) {
return getItemViewType(position) == POSITION_TOP
? gridManager.getSpanCount() : 1;
}
});
}
}
//主体
private class MainViewHolder extends RecyclerView.ViewHolder {
public MainViewHolder(View itemView) {
super(itemView);
}
private TextView mPrice,mIntegal,mContent;
private ImageView mPic;
}
/**
* 顶部 ViewHolder
*/
private class TopViewHolder extends RecyclerView.ViewHolder {
private TopViewHolder(View itemView) {
super(itemView);
}
private AutoScrollViewPager mViewPager;
private TextView mIntagels,mFind , mFirst,mAll;
private RelativeLayout mLin;
}
}
根据
getItemViewType
这个方法来显示不同的布局,有不懂可以问我撒,陆续会贡献在实际开发过程中用到的布局方式及控件的使用。