【Android檢視效果】仿QQ空間滑動改變標題欄顏色
阿新 • • 發佈:2018-11-17
最近在倒騰公司之前的專案,發現之前的介面是個白色標題欄,不是很美觀,所以做了些改進。
先看效果圖
簡單說下思路,整個佈局大體上是ScrollView裡面包含了一個ImageView和RecyclerView,所以先得到ImageView的高度,當ScrollView向上滑動時,設定標題欄的背景色、文字顏色,當超過ImageView的高度時,設定其背景為白色,字型為黑色。
首先想到的是ScrollView 的setOnScrollChangeListener方法,但是這是6.0之後才可以用
偶爾發現5.0新增的NestedScrollView 可以設定這個滑動監聽,看了看原始碼
原來如此,我們也仿照著寫個,先定義一個介面;
public interface OnScrollChangedListener {
/**
* 滑動監聽
*
* @param scrollView ScrollView控制元件
* @param x x軸座標
* @param y y軸座標
* @param oldx 上一個x軸座標
* @param oldy 上一個y軸座標
*/
void onScrollChanged(ScrollView scrollView, int x, int y, int oldx, int oldy);
}
然後自定義MyScrollView繼承於ScrollView
public class MyScrollView extends ScrollView {
private OnScrollChangedListener mOnScrollChangedListener;
public void setmOnScrollChangedListener(OnScrollChangedListener mOnScrollChangedListener) {
this .mOnScrollChangedListener = mOnScrollChangedListener;
}
public MyScrollView(Context context) {
super(context);
}
public MyScrollView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public MyScrollView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
}
在他的onScrollChanged方法中調下我們剛寫的介面
@Override
protected void onScrollChanged(int x, int y, int oldx, int oldy) {
super.onScrollChanged(x, y, oldx, oldy);
if (mOnScrollChangedListener != null) {
mOnScrollChangedListener.onScrollChanged(this, x, y, oldx, oldy);
}
}
然後是計算滑動高度,設定顏色
lsv.setmOnScrollChangedListener(new SlideToBottomScrollView.OnScrollChangedListener() {
@Override
public void onScrollChanged(ScrollView scrollView, int x, int y, int oldx, int oldy) {
int minHeight = 50;
int maxHeight = rl_userhome_top.getMeasuredHeight();
if (maxHeight == 0) {
maxHeight = 500;
}
if (scrollView.getScrollY() <= minHeight) {
mAlpha = 0;
} else if (scrollView.getScrollY() > maxHeight) {
mAlpha = 255;
} else {
mAlpha = (scrollView.getScrollY() - minHeight) * 255 / (maxHeight - minHeight);
}
if (mAlpha <= 0) {
tv_title.setTextColor(Color.rgb(255, 255, 255));
iconColorFilter(Color.parseColor("#ffffff"));
rl_userhome_title.setBackgroundColor(Color.argb(0, 255, 255, 255));
} else if (mAlpha >= 255) {
tv_title.setTextColor(Color.rgb(0, 0, 0));
iconColorFilter(Color.parseColor("#000000"));
rl_userhome_title.setBackgroundColor(Color.argb(mAlpha, 255, 255, 255));
} else {
tv_title.setTextColor(Color.rgb(255 - mAlpha, 255 - mAlpha, 255 - mAlpha));
iconColorFilter(Color.rgb(255 - mAlpha, 255 - mAlpha, 255 - mAlpha));
rl_userhome_title.setBackgroundColor(Color.argb(mAlpha, mAlpha, mAlpha, mAlpha));
}
}
});
/**
* 標題欄/導航欄icon 顏色改變
*
* @param color
*/
private void iconColorFilter(int color) {
PorterDuffColorFilter colorFilter = new PorterDuffColorFilter(color, PorterDuff.Mode.SRC_ATOP);
iv_back.setColorFilter(colorFilter);
}