What I want to achieve are these:
When an item in the recyclerView is clicked, the details activity should reveal, starting from the point that my finger touches the screen.
When I touch the up arrow button or back button, the details activity should finish with a circular reveal and stop at the point where my finger touched the screen initially.
MY CODE:
MyRecyclerViewHolder
private OnGridItemClickedListener itemClickedListener
public MyRecyclerViewHolder(View itemView, OnGridItemClickedListener itemClickedListener) {
super(itemView);
ButterKnife.bind(this, itemView);
this.itemClickedListener = itemClickedListener;
rippleView.setOnTouchListener(touchListener);
}
private View.OnTouchListener touchListener = new View.OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
if (event.getAction() == MotionEvent.ACTION_UP) {
itemClickedListener.onItemClick(getAdapterPosition(), null, (int)event.getY(), (int)event.getX());
}
return true;
}
};
MyFragment
// Removed irrelevant codes
MyAdapter adapter = new MyAdapter(itemsList, true);
recyclerView.setLayoutManager(new GridAutoFitLayoutManager(getActivity(), MyConvert.dpToPx(150, getActivity())));
recyclerView.setAdapter(adapter);
recyclerView.setHasFixedSize(true);
adapter.setOnGridItemClickedListener(new OnGridItemClickedListener() {
@Override
public void onItemClick(int position, String stringId, int y, int x) {
launchMyDetailsActivity(position, y, x);
}
});
private void launchMyDetailsActivity(int index, int y, int x) {
Intent intent = new Intent(getActivity(), MyDetailsActivity.class);
intent.putExtra(Keys.EXTRA_Y, y);
intent.putExtra(Keys.EXTRA_X, x);
startActivity(intent);
}
MyDetailsActivity
// Removed irrelevant codes
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_grid_details);
ButterKnife.bind(this);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
setViewListeners();
startEnterTransition();
}
private void startEnterTransition () {
coordinatorLayout.post(new Runnable() {
@Override
public void run() {
int x = getIntent().getIntExtra(Keys.EXTRA_X, 0);
int y = getIntent().getIntExtra(Keys.EXTRA_Y, 0);
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP && x != 0 && y != 0) {
// get the final radius for the clipping circle
int finalRadius = Math.max(coordinatorLayout.getWidth(), coordinatorLayout.getHeight()) / 2;
// create the animator for this view (the start radius is zero)
Animator anim = ViewAnimationUtils.createCircularReveal(coordinatorLayout, x, y, 0, finalRadius);
// make the view visible and start the animation
coordinatorLayout.setVisibility(View.VISIBLE);
anim.start();
}
}
});
}
private void startExitTransition () {
int x = getIntent().getIntExtra(Keys.EXTRA_X, 0);
int y = getIntent().getIntExtra(Keys.EXTRA_Y, 0);
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP && x != 0 && y != 0) {
int initialRadius = coordinatorLayout.getWidth() / 2;
Animator anim = ViewAnimationUtils.createCircularReveal(coordinatorLayout, x, y, initialRadius, 0);
anim.addListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
super.onAnimationEnd(animation);
coordinatorLayout.setVisibility(View.INVISIBLE);
supportFinishAfterTransition();
}
});
anim.start();
} else {
supportFinishAfterTransition();
}
}
@Override
public void onBackPressed() {
startExitTransition();
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()) {
case android.R.id.home:
startExitTransition();
return true;
}
return super.onOptionsItemSelected(item);
}
Problems
The reveal animation starts from the top-left of the screen, close to the burger icon even when the item I clicked is close to the bottom of the screen. The same goes for the exit animation, it stops at the top-left of the screen
After the exit animation ends, the screen flashes, it doesn't always happen but it does happen.
Implemented solution
I have tried this in the viewHolder: itemView.getX()
and itemView.getY()
, itemView.getRight()
and itemView.getTop()
. These appeared
to solve number one problem above but the point of entry and exit of the animations are always off from the point of the recyclerView item.
Please how do I fix numbers and 2 problems above?