首页 > 系统 > Android > 正文

解析ScrollView--仿QQ空间标题栏渐变

2019-12-12 02:58:07
字体:
来源:转载
供稿:网友

先看一下效果图:

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context="com.hankkin.gradationtitlebar.QQSpeakActivity"> <com.hankkin.gradationscroll.GradationScrollView  android:id="@+id/scrollview"  android:layout_width="match_parent"  android:layout_height="match_parent"  android:scrollbars="none">  <LinearLayout   android:layout_width="match_parent"   android:layout_height="wrap_content"   android:orientation="vertical" >   <ImageView    android:id="@+id/iv_banner"    android:scaleType="fitXY"    android:src="@drawable/banner3"    android:layout_width="match_parent"    android:layout_height="200dp" />   <com.hankkin.gradationscroll.NoScrollListview    android:id="@+id/listview"    android:layout_width="match_parent"    android:layout_height="wrap_content" >   </com.hankkin.gradationscroll.NoScrollListview>  </LinearLayout> </com.hankkin.gradationscroll.GradationScrollView> <TextView  android:paddingBottom="10dp"  android:id="@+id/textview"  android:layout_width="match_parent"  android:layout_height="55dp"  android:gravity="center|bottom"  android:text="我是标题"  android:textSize="18sp"  android:textColor="@color/transparent"  android:background="#00000000" /></RelativeLayout>
public class GradationScrollView extends ScrollView { public interface ScrollViewListener {  void onScrollChanged(GradationScrollView scrollView, int x, int y,        int oldx, int oldy); } private ScrollViewListener scrollViewListener = null; public GradationScrollView(Context context) {  super(context); } public GradationScrollView(Context context, AttributeSet attrs,        int defStyle) {  super(context, attrs, defStyle); } public GradationScrollView(Context context, AttributeSet attrs) {  super(context, attrs); } public void setScrollViewListener(ScrollViewListener scrollViewListener) {  this.scrollViewListener = scrollViewListener; } @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);  } }}

我们需要获取图片的高度,并且设置滚动监听,随着滚动的距离来设置标题栏的颜色透明度和字体颜色的透明度

/** * 获取顶部图片高度后,设置滚动监听*/private void initListeners() {  ViewTreeObserver vto = ivBanner.getViewTreeObserver();  vto.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {   @Override   public void onGlobalLayout() {    textView.getViewTreeObserver().removeGlobalOnLayoutListener(      this);    height = ivBanner.getHeight();    scrollView.setScrollViewListener(QQSpeakActivity.this);   }  }); }  /**  * 滑动监听  * @param scrollView  * @param x  * @param y  * @param oldx  * @param oldy*/@Overridepublic void onScrollChanged(GradationScrollView scrollView, int x, int y,        int oldx, int oldy) {  // TODO Auto-generated method stub  if (y <= 0) { //设置标题的背景颜色   textView.setBackgroundColor(Color.argb((int) 0, 144,151,166));  } else if (y > 0 && y <= height) { //滑动距离小于banner图的高度时,设置背景和字体颜色颜色透明度渐变   float scale = (float) y / height;   float alpha = (255 * scale);   textView.setTextColor(Color.argb((int) alpha, 255,255,255));   textView.setBackgroundColor(Color.argb((int) alpha, 144,151,166));  } else { //滑动到banner下面设置普通颜色   textView.setBackgroundColor(Color.argb((int) 255, 144,151,166));  } }

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持武林网!

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表