首先先缕清思路,需要的效果,用到的东西,实现过程,做好笔记/** * 扩展式自定义View 在ScrollView的基础上添加新的功能 * 1.类继承基础控件 * 2.自定义一个ScrollView滑动监听的接口 * 3.覆写ScrollView自带的一个滑动监听 * 4.提供方法,让外界可以设置ScrollView的监听对象 * 5.使用ObserbvableScrollView自定义控件 * Obserbvable 可观察的 * * 做自定义控件的思路 * 1.看效果,判断是哪种类型的自定义控件 * 2.如果是继承式自定义控件,那么我们就要判断这个效果是基于哪种基础控件之上 * 3.获取顶部的图片高度,设置ScrollView的滚动监听时要使用到这个参数 * 获取控件的试图观察者,以便通过试图观察者得到控件的宽高参数 * 使用试图观察者设置监听 以便获取观察控件的高度 *回调监听后 先移除该监听,减少内存的消耗 得到控件的高度 * 4.设置ScrollView的滚动监听,一般滑动时.最上面的标题显示 *自定义ObeservableScrollView的监听器 ,是ObeservableScrollView在把图片滑到消失后,显示出标题的效果 *以上数据是具体实现的 */
1.首先自定义一个类继承ScrollView 重写构造方法public class MyScrollView extends ScrollView { //重写构造方法 这里让它都去使用第三中构造方法 public MyScrollView(Context context) { this(context,null); } public MyScrollView(Context context, AttributeSet attrs) { this(context, attrs,0); } //每次都只会 调用这个方法 public MyScrollView(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); } //覆写滑动监听方法 再做一个自己的接口 @Override protected void onScrollChanged(int l, int t, int oldl, int oldt) { super.onScrollChanged(l, t, oldl, oldt); if(mOnScrollViewListenner!=null){ mOnScrollViewListenner.onScrollChanged(this,l,t,oldl,oldt); } } //自定义接口 public interface OnScrollViewListenner{ //把方法放进去 做修改加入本类对象参数 void onScrollChanged(MyScrollView mMyScrollView,int l, int t, int oldl, int oldt); } //定义自己的接口变量 private OnScrollViewListenner mOnScrollViewListenner ; //设置Set方法 public void setmOnScrollViewListenner(OnScrollViewListenner mOnScrollViewListenner) { this.mOnScrollViewListenner = mOnScrollViewListenner; } }2.在XML中引用它 注意这里的title是隐藏的<?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:id="@+id/activity_main" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" tools:context="com.example.administrator.wwbq.MainActivity"> <com.example.administrator.wwbq.MyScrollView android:id="@+id/scrollView" android:layout_width="match_parent" android:layout_height="match_parent" > <LinearLayout android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <ImageView android:layout_gravity="center_horizontal" android:id="@+id/image_title" android:src="@drawable/e" android:layout_width="200dp" android:layout_height="200dp" /> <TextView android:layout_width="match_parent" android:layout_height="1000dp" /> </LinearLayout> </com.example.administrator.wwbq.MyScrollView> <RelativeLayout android:id="@+id/title_layout" android:gravity="top" android:layout_width="match_parent" android:layout_height="50dp"> <TextViewandroid:visibility="gone"android:id="@+id/title_text" android:layout_centerInParent="true" android:textSize="25sp" android:text="aaa" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </RelativeLayout></RelativeLayout>3.MainActivity//设置图片可随意public class MainActivity extends AppCompatActivity implements MyScrollView.OnScrollViewListenner { private ImageView mImageTitle; private MyScrollView mScrollView; private TextView mTitleText; private RelativeLayout mTitleLayout; private int height; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); //找控件 initView(); //找顶部图片的高度 随时变化的一个高度 findHeighOfTopView(); //为ScrollView设置监听 mScrollView.setmOnScrollViewListenner(this); } private void findHeighOfTopView() { //获取控件的试图观察者,以便通过试图观察者得到控件的宽高参数 ViewTreeObserver viewTreeObserver = mImageTitle.getViewTreeObserver(); //添加观察者监听 viewTreeObserver.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() { @Override public void onGlobalLayout() { //回调监听后首先移除该监听 占资源 mImageTitle.getViewTreeObserver().removeOnGlobalLayoutListener(this); //得到高度 height = mImageTitle.getHeight(); } }); } private void initView() { mImageTitle = (ImageView) findViewById(R.id.image_title); mScrollView = (MyScrollView) findViewById(R.id.scrollView); mTitleText = (TextView) findViewById(R.id.title_text); mTitleLayout = (RelativeLayout) findViewById(R.id.title_layout); } //自定义ObeservableScrollView的监听器 ,是ObeservableScrollView在把图片滑到消失后,显示出标题的效果 @Override public void onScrollChanged(MyScrollView mMyScrollView, int l, int t, int oldl, int oldt) { //对T轴进行判断,就俩种状态1.消失没有了 2.随着滑动,颜色越来越深 if(t<=0){//没有往下滑 //设置标题隐藏 mTitleText.setVisibility(View.GONE); //设置标题所在背景为透明 mTitleLayout.setBackgroundColor(Color.argb(0,0,0,0)); } //大于0表示有位移 正在拖动中,发生颜色变化的同时不超过顶部图片的高度 else if(t>0 && t<height){ //显示标题 mTitleText.setVisibility(View.VISIBLE); //获取ScrollView向下滑动,图片消失部分的比例 注意在配置比例时 一定要强转float float scale = (float)t / height; //根据这个比例,让标题的颜色慢慢的由浅入深 float alpha = (255 * scale); //设置标题的内容和颜色 mTitleText.setText("标题标题"); mTitleText.setTextColor(Color.argb((int)alpha ,0,0,0)); //设置标题布局颜色 mTitleLayout.setBackgroundColor(Color.argb((int)alpha,255,255,255)); } } }
自定义View控件值ScrollView,监听实现标题透明到显示
最新推荐文章于 2024-06-03 18:31:31 发布