我试图在视图上实现一个基本上在我的RecyclerView背后的动画 . 我正在使用ItemTouchHelper.SimpleCallback类来获取RecyclerView上的运动事件,并重写回调方法 onChildDraw()
以传播动画 .
该动画基本上由用户滑动手势控制 . 所以这是我的问题 .
我在卡片视图上有一个带有电子邮件内容的RecyclerView . 在该卡片视图下方的屏幕左侧和右侧有两个图像 . 这个链接中的图像显示如下:
CardView inside a RecyclerView with left and right images behind card view
最初,红色和粉红色图像是不可见的,并将根据白色cardview上的滑动量进行动画处理 . 现在,当我在白卡视图上向左侧和右侧滑动时,红色和粉红色的图像将按比例显示,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 {
}
}
}
在上面的代码中,我试图根据白卡视图上的用户滑动量来设置红色和粉红色图像的动画 . 但我真的陷入了基于“dX”的计算中,无法弄清楚如何计算动画的值 .
注意: - 当用户在卡片上从左向右滑动时,红色图像应该是动画的,当用户在卡片上从右向左滑动时,粉红色图像应该是动画的 . 动画最初将包含缩放和alpha动画,当两个动画完成时,红色或粉红色图像将开始向滑动方向平移 .
任何人都可以帮我根据用户滑动计算动画值 . 如果您有任何与此问题相关的疑问,请询问 . 我真的陷入了这个问题,在网络上的任何地方都没有解决方案 .
任何帮助将不胜感激 . 提前致谢 .