前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >安卓下滑渐显标题栏

安卓下滑渐显标题栏

作者头像
用户4458175
发布2020-02-12 16:40:06
5850
发布2020-02-12 16:40:06
举报
文章被收录于专栏:andy的小窝andy的小窝

第一步:导入自定义ScrollView的类 ObservableScrollView.Java

代码语言:javascript
复制
import android.content.Context;  
import android.util.AttributeSet;  
import android.widget.ScrollView;  
/** 
 * 带滚动监听的scrollview 
 * 
 */  
public class ObservableScrollView extends ScrollView {  
  
    public interface ScrollViewListener {  
  
        void onScrollChanged(ObservableScrollView scrollView, int x, int y,  
                int oldx, int oldy);  
  
    }  
  
    private ScrollViewListener scrollViewListener = null;  
  
    public ObservableScrollView(Context context) {  
        super(context);  
    }  
  
    public ObservableScrollView(Context context, AttributeSet attrs,  
            int defStyle) {  
        super(context, attrs, defStyle);  
    }  
  
    public ObservableScrollView(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);  
        }  
    }  
  
}  

第二步  界面文件

代码语言:javascript
复制
<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"   >  
  
    <cn.hwwwwh.cn.ObservableScrollView  
        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/imageview"  
                android:layout_width="match_parent"  
                android:layout_height="200dp"  
                android:background="@drawable/zuqiu" />  
  
        </LinearLayout>  
    </cn.hwwwwh.cn.ObservableScrollView>  
  
    <TextView  
        android:id="@+id/textview"  
        android:layout_width="match_parent"  
        android:layout_height="48dp"  
        android:gravity="center"  
        android:text="标题"  
        android:textSize="18sp"  
        android:textColor="@android:color/white"  
        android:background="#00000000" />  
  
</RelativeLayout>  

第三步 源代码调用以下两个方法

代码语言:javascript
复制
 private void initListeners() {  
        // 获取顶部图片高度后,设置滚动监听  
        ViewTreeObserver vto = imageView.getViewTreeObserver();  
        vto.addOnGlobalLayoutListener(new OnGlobalLayoutListener() {  
            @Override  
            public void onGlobalLayout() {  
                imageView.getViewTreeObserver().removeGlobalOnLayoutListener(  
                        this);  
                imageHeight = imageView.getHeight();  
  
                scrollView.setScrollViewListener(MainActivity.this);  
            }  
        });  
    }  
代码语言:javascript
复制
  @Override  
    public void onScrollChanged(ObservableScrollView scrollView, int x, int y,  
            int oldx, int oldy) {  
        // TODO Auto-generated method stub  
        // Log.i("TAG", "y--->" + y + "    height-->" + height);  
        if (y <= 0) {  
            textView.setBackgroundColor(Color.argb((int) 0, 227, 29, 26));//第一个参数0表示透明度范围是0~255,后面为RGB参数
        } else if (y > 0 && y <= imageHeight) {  
            float scale = (float) y / imageHeight;  
            float alpha = (255 * scale);  
            textView.setBackgroundColor(Color.argb((int) alpha, 227, 29, 26));  
        } else {  
            textView.setBackgroundColor(Color.argb((int) 255, 227, 29, 26));  
        }  
    }  
}  

到这里应该就可以实现,具体参数根据实际调整

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档