Android瀑布流仿京东,（二） 仿京东顶部伸缩渐变丶自定义viewpager指示器丶viewpager3D回廊丶recyclerview瀑布流...

效果图如下：

demo2.gif

Demo2

1.仿京东首页顶部轮播图+搜索栏渐变

public class GradientScrollView extends ScrollView {

public interface ScrollViewListener {

void onScrollChanged(GradientScrollView scrollView, int x, int y,

int oldx, int oldy);

}

private ScrollViewListener scrollViewListener = null;

public GradientScrollView(Context context) {

super(context);

}

public GradientScrollView(Context context, AttributeSet attrs,

int defStyle) {

super(context, attrs, defStyle);

}

public GradientScrollView(Context context, AttributeSet attrs) {

super(context, attrs);

}

public void setScrollViewListener(ScrollViewListener scrollViewListener) {

this.scrollViewListener = scrollViewListener;

}

@Override

public void scrollTo(int x, int y) {

super.scrollTo(x, y);

}

@Override

protected void onScrollChanged(int x, int y, int oldx, int oldy) {

super.onScrollChanged(x, y, oldx, oldy);

if (scrollViewListener != null) {

scrollViewListener.onScrollChanged(this, x, y, oldx, oldy);

}

}

}

//滑动监听 控制状态栏变化

@Override

public void onScrollChanged(GradientScrollView scrollView, int x, int y, int oldx, int oldy) {

Drawable search_white = ContextCompat.getDrawable(this, R.mipmap.icon_search_white);

Drawable search_black = ContextCompat.getDrawable(this, R.mipmap.icon_search_black);

// 这一步必须要做,否则不会显示.

search_white.setBounds(0, 0, search_white.getMinimumWidth(), search_white.getMinimumHeight());

// 这一步必须要做,否则不会显示.

search_black.setBounds(0, 0, search_black.getMinimumWidth(), search_black.getMinimumHeight());

if (y <= 0) {

llTitle.setBackgroundColor(Color.argb((int) 0, 255, 255, 255));

rlLeft.setBackgroundResource(R.drawable.oval_shadow);

rlRight.setBackgroundResource(R.drawable.oval_shadow);

ivLeft.setImageResource(R.mipmap.icon_ewm);

ivRight.setImageResource(R.mipmap.icon_ewm);

tvSearch.setBackgroundResource(R.drawable.rec_shadow_r25);

tvSearch.setCompoundDrawables(search_white, null, null, null);

tvSearch.setCompoundDrawablePadding((int) getResources().getDimension(R.dimen.dimen_5));

tvSearch.setHintTextColor(color(R.color.white));

} else if (y > 0 && y <= height) {

float scale = (float) y / height;

float alpha = (255 * scale);

llTitle.setBackgroundColor(Color.argb((int) alpha, 255, 255, 255));

if (y > 0 && y <= height / 2) {

rlLeft.setBackgroundResource(R.drawable.oval_shadow);

rlRight.setBackgroundResource(R.drawable.oval_shadow);

ivLeft.setImageResource(R.mipmap.icon_ewm);

ivRight.setImageResource(R.mipmap.icon_ewm);

tvSearch.setBackgroundResource(R.drawable.rec_shadow_r25);

tvSearch.setCompoundDrawables(search_white, null, null, null);

tvSearch.setCompoundDrawablePadding((int) getResources().getDimension(R.dimen.dimen_5));

tvSearch.setHintTextColor(color(R.color.white));

} else {

rlLeft.setBackground(null);

rlRight.setBackground(null);

ivLeft.setImageResource(R.mipmap.icon_ewm_black);

ivRight.setImageResource(R.mipmap.icon_ewm_black);

tvSearch.setBackgroundResource(R.drawable.rec_gray_r25);

tvSearch.setCompoundDrawables(search_black, null, null, null);

tvSearch.setCompoundDrawablePadding((int) getResources().getDimension(R.dimen.dimen_5));

tvSearch.setHintTextColor(color(R.color.black));

}

} else {

llTitle.setBackgroundColor(Color.argb((int) 255, 255, 255, 255));

rlLeft.setBackground(null);

rlRight.setBackground(null);

ivLeft.setImageResource(R.mipmap.icon_ewm_black);

ivRight.setImageResource(R.mipmap.icon_ewm_black);

tvSearch.setBackgroundResource(R.drawable.rec_gray_r25);

tvSearch.setCompoundDrawables(search_black, null, null, null);

tvSearch.setCompoundDrawablePadding((int) getResources().getDimension(R.dimen.dimen_5));

tvSearch.setHintTextColor(color(R.color.black));

}

}

2.viewpager+自定义指示器

public class PageIndicator extends View {

private int count;

private int selection = 0;

private Paint mSelectedPaint;

private Paint mUnSelectedPaint;

private int selectedW;

private int unSelectedW;

private int height;

private int gapW;

private int unSelectedColor;

private int selectedColor;

public PageIndicator(Context context) {

this(context,null);

}

public PageIndicator(Context context, @Nullable AttributeSet attrs) {

this(context, attrs,0);

}

public PageIndicator(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {

super(context, attrs, defStyleAttr);

TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.PageIndicator);

unSelectedColor = ta.getColor(R.styleable.PageIndicator_unselected_color, ContextCompat.getColor(context,R.color.grayCC));

selectedColor = ta.getColor(R.styleable.PageIndicator_selected_color, ContextCompat.getColor(context,R.color.black));

count=ta.getInt(R.styleable.PageIndicator_count,3);

ta.recycle();

init(context);

}

private void init(Context context){

mSelectedPaint = new Paint();

mSelectedPaint.setColor(selectedColor);

mSelectedPaint.setAntiAlias(true);

mSelectedPaint.setStyle(Paint.Style.FILL);

mUnSelectedPaint = new Paint();

mUnSelectedPaint.setColor(unSelectedColor);

mUnSelectedPaint.setAntiAlias(true);

mUnSelectedPaint.setStyle(Paint.Style.FILL);

selectedW = PhoneUtil.dp2px(context,20f);

unSelectedW = PhoneUtil.dp2px(context,10f);

height = PhoneUtil.dp2px(context,2f);

gapW = PhoneUtil.dp2px(context,5f);

}

public void setCount(int count){

this.count = count;

requestLayout();

invalidate();

}

public void setSelection(int position){

selection = position;

invalidate();

}

@Override

protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {

int width = (count - 1)*(unSelectedW + gapW) + selectedW;

setMeasuredDimension(width,height);

}

@Override

protected void onDraw(Canvas canvas) {

super.onDraw(canvas);

boolean isHasSelect = false;

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

if (i == selection){

isHasSelect = true;

RectF rectF = new RectF(i*(unSelectedW + gapW),0,i*(unSelectedW + gapW) + selectedW,height);

canvas.drawRoundRect(rectF,200,200,mSelectedPaint);

}else {

if (isHasSelect){

RectF rectF = new RectF((i-1)*(unSelectedW + gapW)+(selectedW + gapW),0,(i-1)*(unSelectedW + gapW)+(selectedW + gapW) + unSelectedW,height);

canvas.drawRoundRect(rectF,200,200,mUnSelectedPaint);

}else {

RectF rectF = new RectF(i*(unSelectedW + gapW),0,i*(unSelectedW + gapW) + unSelectedW,height);

canvas.drawRoundRect(rectF,200,200,mUnSelectedPaint);

}

}

}

}

}

3.viewpager3D效果

private PagerAdapter pagerAdapter = new PagerAdapter() {

@Override

public int getCount() {

return imgIds.length;

}

@Override

public boolean isViewFromObject(View view, Object object) {

return view == object;

}

@Override

public void destroyItem(ViewGroup container, int position, Object object) {

container.removeView((View) object);

}

@Override

public Object instantiateItem(ViewGroup container, final int position) {

ClipView clipView;

if (imageViewList.containsKey(position)) {

clipView = imageViewList.get(position);

} else {

clipView = (ClipView) View.inflate(mActivity, R.layout.item_image, null);

ImageView imageView = (ImageView) clipView.findViewById(R.id.iv_img);

TextView tvTitle = clipView.findViewById(R.id.tv_title);

imageView.setImageResource(imgIds[position]);

imageViewList.put(position, clipView);

}

container.addView(clipView);

clipView.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

ToastUtil.normal("点击了" + (position + 1));

fvpPagers.setCurrentItem(position, true);

}

});

return clipView;

}

};

4.recyclerview瀑布流

android:overScrollMode="never"

android:layout_marginTop="@dimen/dimen_10"

android:layout_marginLeft="@dimen/dimen_10"

android:id="@+id/demo_list"

app:spanCount="2"

app:layoutManager="android.support.v7.widget.StaggeredGridLayoutManager"

tools:listitem="@layout/item_demo2_list"

android:layout_width="match_parent"

android:layout_height="match_parent"/>

@Override

public void setData(List data) {

super.setData(data);

heightList = new ArrayList<>();

for (int i = 0; i < data.size(); i++) {

int height = new Random().nextInt(300) + 650;//随机数控制高度

heightList.add(height);

}

}

@Override

protected void fillData(BGAViewHolderHelper helper, int position, String model) {

CardView layout=helper.getView(R.id.layout);

ViewGroup.LayoutParams layoutParams=layout.getLayoutParams();

layoutParams.height=heightList.get(position);

layout.setLayoutParams(layoutParams);

}

将持续更新.. 不喜勿喷，仅个人分享，希望能帮助到你