使用ItemTouchHelper.SimpleCallback在RecyclerView后面的视图上的属性动画

时间:2016-10-23 21:03:40

标签: java android android-recyclerview viewpropertyanimator itemtouchhelper

我正在尝试在视图上实现一个基本上在我的RecyclerView背后的动画。我正在使用ItemTouchHelper.SimpleCallback类来获取RecyclerView上的运动事件,并重写回调方法onChildDraw()以传播动画。

此动画基本上由用户滑动手势控制。所以这是我的问题。

我在卡片视图上有一个带有电子邮件内容的RecyclerView。在该卡片视图下方的屏幕左侧和右侧有两个图像。这个链接中的图像显示如下:

CardView inside a RecyclerView with left and right images behind card view

最初,红色和粉红色图像是不可见的,并且会根据白色卡片上的滑动量进行动画处理。现在,当我在白卡视图上向左侧和右侧滑动时,红色和粉红色的图像将按比例显示,alpha动画。缩放动画从0.8开始,alpha动画从0到255开始。当这两个动画完成后,红色和粉红色的图像将朝着滑动方向平移。

这是我的代码:

public class ViewItemTouchHelperCallback extends ItemTouchHelper.SimpleCallback {

  private Context mContext;
  private OnViewSwipedListener mOnSwipeListener;

  public interface OnViewSwipedListener {
    void onViewSwiped(float dX);
  }

  public FocusViewItemTouchHelperCallback(int dragDirs, int swipeDirs, Context context, OnViewSwipedListener listener) {
    super(dragDirs, swipeDirs);
    this.mContext = context;
    this.mOnSwipeListener = listener;
  }

  @Override
  public boolean onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target) {
    return false;
  }

  @Override
  public void onSwiped(RecyclerView.ViewHolder viewHolder, int swipeDir) {
    if(mContext instanceof ViewActivity) {
      if(viewHolder != null) {
        WebView webView = ((ViewAdapter.MailObjectHolder) viewHolder).webViewBody;
        if(webView != null) {
          webView.clearView();
          webView.loadUrl(Constants.ABOUT_BLANK);

          if(swipeDir == ItemTouchHelper.LEFT) {
            ((ViewActivity) mContext).onSwipedLeft();
          } else if(swipeDir == ItemTouchHelper.RIGHT) {
            ((ViewActivity) mContext).onSwipedRight();
          }
        }
      }
    }
  }

  @Override
  public void onChildDraw(Canvas canvas, RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, float dX, float dY, int actionState, boolean isCurrentlyActive) {
    if(actionState == ItemTouchHelper.ACTION_STATE_SWIPE) {
      if(mOnSwipeListener != null) {
        mOnSwipeListener.onViewSwiped(dX);
      }

      super.onChildDraw(canvas, recyclerView, viewHolder, dX, dY, actionState, isCurrentlyActive);
    }
  }
}

下面是我的活动代码,我从上面的类中获得回调:

    @Override
  public void onViewSwiped(float dX) {
    if(dX == 0) {
      mFlagEmailIcon.setVisibility(View.INVISIBLE);
      mNextEmailIcon.setVisibility(View.INVISIBLE);
    } else if(dX > 0) {
      //Left to right - flag email

      float swipedWidth = Math.abs(dX) / mFlagEmailIcon.getMeasuredWidth();
      if(swipedWidth >= 1) {
        LogUtils.log(TAG, "Left to right dX = " + dX + "and Swiped width = " + swipedWidth);
        mFlagEmailIcon.setVisibility(View.VISIBLE);
        float scaleChange = Math.scalb(Math.abs(dX) / mFlagEmailIcon.getMeasuredWidth(), 1);
        if(scaleChange >= 0.8 && scaleChange <= 1) {
          mFlagEmailIcon.animate().scaleX(scaleChange).scaleY(scaleChange);
        }

        mFlagEmailIcon.animate().alpha(scaleChange);
      } else {

      }
    } else {
      //Right to left - next email

      float swipedWidth = Math.abs(dX) / mNextEmailIcon.getMeasuredWidth();
      if(swipedWidth >= 1) {
        LogUtils.log(TAG, "Right to left dX = " + dX + "and Swiped width = " + swipedWidth);
        mNextEmailIcon.setVisibility(View.VISIBLE);
        float scaleChange = Math.scalb(Math.abs(dX) / mNextEmailIcon.getMeasuredWidth(), 1);
        if(scaleChange >= 0.8 && scaleChange <= 1) {
          mNextEmailIcon.animate().scaleX(scaleChange).scaleY(scaleChange);
        }

        mNextEmailIcon.animate().alpha(scaleChange);
      } else {

      }
    }
  }

在上面的代码中,我试图根据白卡视图上的用户滑动量来设置红色和粉红色图像的动画。但我真的陷入了基于&#34; dX&#34;并且无法弄清楚如何计算动画的值。

  

注意: - 当用户在卡上从左向右滑动时,然后是红色图像   应该是动画的,当用户在卡上从右向左滑动时   粉红色的图像应该是动画的。动画将包含比例和alpha   最初动画,当动画完成红色或粉红色时   图像将开始向滑动方向转换。

任何人都可以帮我根据用户滑动来计算动画值。如果您有任何与此问题相关的疑问,请询问。我真的陷入了这个问题,网上任何地方都没有解决方案。

任何帮助将不胜感激。提前谢谢。

0 个答案:

没有答案