Android如何实现仿简书搜索框效果-创新互联

这篇文章给大家分享的是有关Android如何实现仿简书搜索框效果的内容。小编觉得挺实用的，因此分享给大家做个参考，一起跟随小编过来看看吧。

直接上图：

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如何实现仿简书搜索框效果”这篇文章就分享到这里了，希望以上内容可以对大家有一定的帮助，让大家可以学到更多知识，如果觉得文章不错，可以把它分享出去让更多的人看到吧！