Increasing the visibility of a view on Swipe using gestures in android

Question

I am using the following code

private GestureDetector.OnGestureListener mGestureListener = new GestureDetector.OnGestureListener() { private float lastDeltaValue; private static final int MIN_DISTANCE = 15; private static final int MIN_DISTANCE_Y = 25; @Override public boolean onDown(MotionEvent e) { lastDeltaValue = 0; return false; } @Override public void onShowPress(MotionEvent e) { } @Override public boolean onSingleTapUp(MotionEvent e) { return false; } @Override public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) { float startingX = (int)e1.getRawX(); float startingY = (int)e1.getRawY(); float endingX = (int)e2.getRawX(); float endingY = (int)e2.getRawY(); float deltaX = startingX - endingX; float deltaY = startingY - endingY; // swipe horizontal? if(Math.abs(deltaX) > MIN_DISTANCE && Math.abs(deltaY) < MIN_DISTANCE_Y) { // left or right if(deltaX > 0) { shouldCallBtn = SHOULD_CALL_WHERE; if (gestureLayout.getVisibility() == View.GONE) { gestureLayout.setVisibility(View.VISIBLE); gestureLayout.setAlpha(0.3f); } gestureText.setText(getString(R.string.option_where)); if (deltaX > lastDeltaValue) { if (gestureLayout.getAlpha() > 0.29 && gestureLayout.getAlpha() < 0.80) gestureLayout.setAlpha(gestureLayout.getAlpha() + 0.1f); } else { if (gestureLayout.getAlpha() < 0.81 && gestureLayout.getAlpha() > 0.29) gestureLayout.setAlpha(gestureLayout.getAlpha() - 0.1f); } Log.d("DELTA VALUES", String.valueOf(deltaX) + " == " + String.valueOf(lastDeltaValue) + " " +String.valueOf(gestureLayout.getAlpha())); lastDeltaValue = deltaX; } else if(deltaX < 0) { shouldCallBtn = SHOULD_CALL_ONMYWAY; if (gestureLayout.getVisibility() == View.GONE) { gestureLayout.setVisibility(View.VISIBLE); gestureLayout.setAlpha(0.3f); } gestureText.setText(getString(R.string.option_onway)); if (deltaX > lastDeltaValue) { if (gestureLayout.getAlpha() > 0.29 && gestureLayout.getAlpha() < 0.80) gestureLayout.setAlpha(gestureLayout.getAlpha() - 0.1f); } else { if (gestureLayout.getAlpha() < 0.81 && gestureLayout.getAlpha() > 0.29) gestureLayout.setAlpha(gestureLayout.getAlpha() + 0.1f); } Log.d("DELTA VALUES", String.valueOf(deltaX) + " == " + String.valueOf(lastDeltaValue) + " " +String.valueOf(gestureLayout.getAlpha())); lastDeltaValue = deltaX; } } else { } return false; } @Override public void onLongPress(MotionEvent e) { gestureLayout.setVisibility(View.VISIBLE); gestureLayout.setAlpha(0.8f); gestureText.setText(getString(R.string.option_my_location)); sendLocBtn.performClick(); } @Override public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) { return false; } }; 

Originally GestureLayout Visibility GONE . After scrolling, its visibility will increase from 0.3 to 0.8. If I try to skip it, it increases the alpha of the View somewhere on the screen with some text (left scrolling), and this happens when scrolling correctly.

This code seems to work, but the low to high alpha animation is not standard.

Any help would be helpful

NOTE. I do not need animation. I want this to be based on a finger napkin.

Answer 1

Allows you to call the value 0.1f deltaAlpha . deltaAlpha should be based on the value of deltaX . You must determine the coefficient for your application, which is the ratio between deltaAlpha and deltaAlpha . For example, say 10px equal to 0.01 alpha change. Now you know that if your finger moves 40px on the screen, the alpha value can be changed with 0.04 without changing the speed of gestures. Thus, the animation will be smooth and will be based on the distance that the fingers moved to the screen. Try using the following java code:

 // 1 deltaX = 0.01 alpha // This is just an example coefficient. // Replace it with a value that fits your needs private static final float COEFFICIENT = 0.01; private float calculateDeltaAlpha(float deltaX) { return deltaX * COEFICIENT; } private void incrementViewAlpha(View view, float distanceX) { float oldAlpha = gestureLayout.getAlpha(); if (oldAlpha > 0.29 && oldAlpha < 0.80) { gestureLayout.setAlpha(oldAlpha + calculateAlphaDelta(distanceX)); } } private void decrementViewAlpha(View view, float distanceX) { float oldAlpha = gestureLayout.getAlpha(); if (oldAlpha > 0.29 && oldAlpha < 0.80) { gestureLayout.setAlpha(oldAlpha - calculateAlphaDelta(distanceX)); } } 

Calling the incrementViewAlpha and decrementViewAlpha methods when you want to increase or decrease the alpha version value.

Answer 2

I improved Cyril's code and avoided unnecessary code. You need to change the COEFFICIENT value to control the change / smoothness depending on the layout size, screen size, related parameters, etc. Let me know if it works for you. Changes have also been made to limit alpha within UPPER_BOUND_ALPHA and LOWER_BOUND_ALPHA.

 private static final float COEFFICIENT = 0.0001f; private static final float UPPER_BOUND_ALPHA = 0.8f; private static final float LOWER_BOUND_ALPHA = 0.3f; @Override public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) { float startingX = (int)e1.getRawX(); float startingY = (int)e1.getRawY(); float endingX = (int)e2.getRawX(); float endingY = (int)e2.getRawY(); float deltaX = startingX - endingX; float deltaY = startingY - endingY; // swipe horizontal? if(Math.abs(deltaX) > MIN_DISTANCE && Math.abs(deltaY) < MIN_DISTANCE_Y) { if (gestureLayout.getVisibility() == View.GONE) { gestureLayout.setVisibility(View.VISIBLE); gestureLayout.setAlpha(LOWER_BOUND_ALPHA); } // left or right if(deltaX > 0) { shouldCallBtn = SHOULD_CALL_WHERE; gestureText.setText(getString(R.string.option_where)); } else if(deltaX < 0) { shouldCallBtn = SHOULD_CALL_ONMYWAY; gestureText.setText(getString(R.string.option_onway)); } float alphaValue = gestureLayout.getAlpha() + COEFFICIENT * deltaX; if (alphaValue > UPPER_BOUND_ALPHA) { alphaValue = UPPER_BOUND_ALPHA; } else if (alphaValue < LOWER_BOUND_ALPHA) { alphaValue = LOWER_BOUND_ALPHA; } gestureLayout.setAlpha(alphaValue); Log.d("DELTA VALUES", deltaX + " == " + lastDeltaValue + " " + gestureLayout.getAlpha()); lastDeltaValue = deltaX; } return false; }