Android如何实现仿简书搜索框效果
这篇文章给大家分享的是有关Android如何实现仿简书搜索框效果的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。
成都创新互联公司主要从事做网站、网站建设、网页设计、企业做网站、公司建网站等业务。立足成都服务嘉兴,十载网站建设经验,价格优惠、服务专业,欢迎来电咨询建站服务:13518219792
直接上图:
Activity 布局:
这里的TextView要添加maxLines=1属性,如果不添加,当text=“搜索简书内容和朋友”时会有2行变1行的效果,看起来效果不太好。
头部视图:
activity 头部 xml.png
下面咱们省略findViewById的代码,直接看核心代码:
变量初始化:
//获取屏幕宽度 mMaxWidth = ScreenUtil.getScreenWidth(); //搜索框距离屏幕边缘的margin int rightMargin = Px2DpUtil.dp2px(this, 17); //屏幕宽度减去左右margin后的搜索框宽度最大值 mMaxWidth = mMaxWidth -rightMargin*2; //搜索框宽度最小值 mMinWidth = Px2DpUtil.dp2px(this, R.dimen.d_80); //header布局高度 mHeaderHeight=Px2DpUtil.dp2px(this,R.dimen.d_120);
RecyclerView 滚动监听:
mRecyclerView.addOnScrollListener(new RecyclerView.OnScrollListener() { @Override public void onScrollStateChanged(RecyclerView recyclerView, int newState) { super.onScrollStateChanged(recyclerView, newState); } @Override public void onScrolled(RecyclerView recyclerView, int dx, int dy) { super.onScrolled(recyclerView, dx, dy); LinearLayoutManager l = (LinearLayoutManager)recyclerView.getLayoutManager(); //获取第一个可见视图的position int position = l.findFirstVisibleItemPosition(); //获取第一个完全可见视图的position int firstCompletelyVisibleItemPosition = l.findFirstCompletelyVisibleItemPosition(); //当position=0时,对标题栏执行透明度变化 if (position == 0) { //计算滚动的距离占header高度的比例 double delta = Math.floor(((float) getScollYDistance(recyclerView) % mHeaderHeight)); //给标题栏设置透明度 mLlTitle.getBackground().setAlpha((int) delta); } //当position=1时,搜索框最大 if (position == 1) { ObjectAnimator animator = ObjectAnimator.ofInt(new ViewWidthWrapper(mRlTitleLayout), "width", mMaxWidth); setAnimatorListener(animator,1); } //当position=0时,搜索框最小 if(firstCompletelyVisibleItemPosition==0){ ObjectAnimator animator = ObjectAnimator.ofInt(new ViewWidthWrapper(mRlTitleLayout), "width", mMinWidth); setAnimatorListener(animator,0); } } });
获取RecycleView垂直滚动的距离:
public int getScollYDistance(RecyclerView rv) { LinearLayoutManager layoutManager = (LinearLayoutManager) rv.getLayoutManager(); //获取第一个可见item的position int position = layoutManager.findFirstVisibleItemPosition(); //获取第一个position的View View firstVisiableChildView = layoutManager.findViewByPosition(position); //获取第一个可见View的高度 int itemHeight = firstVisiableChildView.getHeight(); return (position) * itemHeight - firstVisiableChildView.getTop(); }
搜索框执行的动画(ObjectAnimator):
animator.addListener(new Animator.AnimatorListener() { @Override public void onAnimationStart(Animator animation) { } @Override public void onAnimationEnd(Animator animation) { if (visibity == 1) { mMinTvSearchView.setText("搜索简书内容和朋友"); } if (visibity == 0) { mMinTvSearchView.setText("搜索"); } } @Override public void onAnimationCancel(Animator animation) { } @Override public void onAnimationRepeat(Animator animation) { } }); animator.setDuration(100).start();
感谢各位的阅读!关于“Android如何实现仿简书搜索框效果”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!
分享标题:Android如何实现仿简书搜索框效果
网页地址:http://scyanting.com/article/iecphi.html