Skip to content

Instantly share code, notes, and snippets.

@kumar935

kumar935/SwipeButton.java

Last active May 24, 2017 04:53
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save kumar935/7bce770ee5e8e65a734d4ae66e450d77 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save kumar935/7bce770ee5e8e65a734d4ae66e450d77 to your computer and use it in GitHub Desktop.
Download ZIP
Swipe Button for android
Raw
SwipeButton.java
import android.content.Context;
import android.graphics.LinearGradient;
import android.graphics.Shader;
import android.graphics.drawable.ShapeDrawable;
import android.graphics.drawable.shapes.RectShape;
import android.util.AttributeSet;
import android.util.Log;
import android.view.MotionEvent;
import android.widget.Button;
public class SwipeButton extends Button {
private float x1;
//x coordinate of where user first touches the button
private float y1;
//y coordinate of where user first touches the button
private String originalButtonText;
//the text on the button
private boolean confirmThresholdCrossed;
//whether the threshold distance beyond which action is considered confirmed is crossed or not
private boolean swipeTextShown;
private boolean swiping = false;
private float x2Start;
//whether the text currently on the button is the text shown while swiping or the original text
private SwipeButtonCustomItems swipeButtonCustomItems;
//in this instance of the class SwipeButtonCustomItems we can accept callbacks and other params like colors
public SwipeButton(Context context) {
super(context);
}
public SwipeButton(Context context, AttributeSet attrs) {
super(context, attrs);
}
public SwipeButton(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
public void setSwipeButtonCustomItems(SwipeButtonCustomItems swipeButtonCustomItems) {
//setter for swipeButtonCustomItems
this.swipeButtonCustomItems = swipeButtonCustomItems;
}
@Override
public boolean onTouchEvent(MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN: {
// when user first touches the screen we get x and y coordinate
x1 = event.getX();
y1 = event.getY();
this.originalButtonText = this.getText().toString();
confirmThresholdCrossed = false;
if (!swipeTextShown) {
this.setText(swipeButtonCustomItems.getButtonPressText());
swipeTextShown = true;
}
swipeButtonCustomItems.onButtonPress();
break;
}
case MotionEvent.ACTION_MOVE: {
//here we'll capture when the user swipes from left to right and write the logic to create the swiping effect
float x2 = event.getX();
float y2 = event.getY();
if(!swiping){
x2Start = event.getX();
//this is to capture at what x swiping started
swiping = true;
}
//if left to right sweep event on screen
if (x1 < x2 && !confirmThresholdCrossed) {
this.setBackgroundDrawable(null);
ShapeDrawable mDrawable = new ShapeDrawable(new RectShape());
int gradientColor1 = swipeButtonCustomItems.getGradientColor1();
int gradientColor2 = swipeButtonCustomItems.getGradientColor2();
int gradientColor2Width = swipeButtonCustomItems.getGradientColor2Width();
int gradientColor3 = swipeButtonCustomItems.getGradientColor3();
double actionConfirmDistanceFraction = swipeButtonCustomItems.getActionConfirmDistanceFraction();
//Note that above we replaced the hard coded values by those from the SwipeButtonCustomItems instance.
Shader shader = new LinearGradient(x2, 0, x2 - gradientColor2Width, 0,
new int[]{gradientColor3, gradientColor2, gradientColor1},
new float[]{0, 0.5f, 1},
Shader.TileMode.CLAMP);
mDrawable.getPaint().setShader(shader);
this.setBackgroundDrawable(mDrawable);
if (swipeTextShown == false) {
this.setText(swipeButtonCustomItems.getButtonPressText());
//change text while swiping
swipeTextShown = true;
}
if ((x2-x2Start) > (this.getWidth() * actionConfirmDistanceFraction)) {
Log.d("CONFIRMATION", "Action Confirmed!");
//Note that below we inserted the desired callback from the SwipeButtonCustomItem instance.
swipeButtonCustomItems.onSwipeConfirm();
//confirm action when swiped upto the desired distance
confirmThresholdCrossed = true;
}
}
break;
}
case MotionEvent.ACTION_UP: {
//when the user releases touch then revert back the text
swiping = false;
float x2 = event.getX();
int buttonColor = swipeButtonCustomItems.getPostConfirmationColor();
String actionConfirmText = swipeButtonCustomItems.getActionConfirmText() == null ? this.originalButtonText : swipeButtonCustomItems.getActionConfirmText();
//if you choose to not set the confirmation text, it will set to the original button text;
this.setBackgroundDrawable(null);
this.setBackgroundColor(buttonColor);
swipeTextShown = false;
if ((x2-x2Start) <= (this.getWidth() * swipeButtonCustomItems.getActionConfirmDistanceFraction())) {
Log.d("CONFIRMATION", "Action not confirmed");
this.setText(originalButtonText);
swipeButtonCustomItems.onSwipeCancel();
confirmThresholdCrossed = false;
} else {
Log.d("CONFIRMATION", "Action confirmed");
this.setText(actionConfirmText);
}
break;
}
}
return super.onTouchEvent(event);
}
}
Raw
SwipeButtonCustomItems.java
public abstract class SwipeButtonCustomItems {
//These are the default values if we don't choose to set them later:
public int gradientColor1 = 0xFF333333;
public int gradientColor2 = 0xFF666666;
public int gradientColor2Width = 50;
public int gradientColor3 = 0xFF888888;
public int postConfirmationColor = 0xFF888888;
public double actionConfirmDistanceFraction = 0.7;
public String buttonPressText = ">> SWIPE TO CONFIRM >> ";
public String actionConfirmText = null;
public int getGradientColor1() {
return gradientColor1;
}
public SwipeButtonCustomItems setGradientColor1(int gradientColor1) {
this.gradientColor1 = gradientColor1;
return this;
}
public int getGradientColor2() {
return gradientColor2;
}
public SwipeButtonCustomItems setGradientColor2(int gradientColor2) {
this.gradientColor2 = gradientColor2;
return this;
}
public int getGradientColor2Width() {
return gradientColor2Width;
}
public SwipeButtonCustomItems setGradientColor2Width(int gradientColor2Width) {
this.gradientColor2Width = gradientColor2Width;
return this;
}
public int getGradientColor3() {
return gradientColor3;
}
public SwipeButtonCustomItems setGradientColor3(int gradientColor3) {
this.gradientColor3 = gradientColor3;
return this;
}
public double getActionConfirmDistanceFraction() {
return actionConfirmDistanceFraction;
}
public SwipeButtonCustomItems setActionConfirmDistanceFraction(double actionConfirmDistanceFraction) {
this.actionConfirmDistanceFraction = actionConfirmDistanceFraction;
return this;
}
public String getButtonPressText() {
return buttonPressText;
}
public SwipeButtonCustomItems setButtonPressText(String buttonPressText) {
this.buttonPressText = buttonPressText;
return this;
}
public String getActionConfirmText() {
return actionConfirmText;
}
public SwipeButtonCustomItems setActionConfirmText(String actionConfirmText) {
this.actionConfirmText = actionConfirmText;
return this;
}
public int getPostConfirmationColor() {
return postConfirmationColor;
}
public SwipeButtonCustomItems setPostConfirmationColor(int postConfirmationColor) {
this.postConfirmationColor = postConfirmationColor;
return this;
}
//These methods listed below can be overridden in the instance of SwipeButton and
public void onButtonPress(){
}
public void onSwipeCancel(){
}
abstract public void onSwipeConfirm();
}
Raw
where_button_will_be_used.xml
<whatever.package.path.SwipeButton
android:id="@+id/my_swipe_button"
android:layout_width="match_parent"
android:layout_height="45dp"
android:layout_margin="20dp"
android:text="BUTTON"
android:layout_alignParentBottom="true"/>
Raw
WhereButtonWillBeUsed.java
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.util.Log;
public class WhereButtonWillBeUsed extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.where_button_will_be_used);
SwipeButton mSwipeButton = (SwipeButton) findViewById(R.id.my_swipe_button);
SwipeButtonCustomItems swipeButtonSettings = new SwipeButtonCustomItems() {
@Override
public void onSwipeConfirm() {
Log.d("NEW_STUFF", "New swipe confirm callback");
}
};
swipeButtonSettings
.setButtonPressText(">> NEW TEXT! >>")
.setGradientColor1(0xFF888888)
.setGradientColor2(0xFF666666)
.setGradientColor2Width(60)
.setGradientColor3(0xFF333333)
.setPostConfirmationColor(0xFF888888)
.setActionConfirmDistanceFraction(0.7)
.setActionConfirmText("Action Confirmed");
if (mSwipeButton != null) {
mSwipeButton.setSwipeButtonCustomItems(swipeButtonSettings);
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment