Even if you’re never touched an iPhone before, you’re probably familiar with the infamous “slide to unlock” button.

The original purpose behind this button was to prevent a device from getting accidentally unlocked while in a pocket. In the mobile apps you create, there may be a similar use case where you want to give the user the option to confirm a definitive action. The Uber app for drivers has such a button which the driver swipes from left to right to confirm that they want to start a journey.

Usually the solution is to prompt the user with a popup to confirm the action, but this is not an inspired solution. Let’s try creating our own swipe button for Android.

For the functionality required, you’ll have to play with the onTouchEvent listener of the Button. In the listener you capture when the user presses, swipes across or releases the button. Override the onTouchEvent by adding the following to the SwipeButton class:

Several attributes, such as gradient colors, have been hard-coded for now. These will be set for each instance of the button, and to be able to set callback functions for when a user performs certain actions with the button.

Set Attributes

The attributes that you can customize for each instance of SwipeButton are:

The three gradient colors.

The width covered by the second gradient color.

Fraction of distance of the width of the Button that the user needs to swipe to confirm the action.

The text that appears when the user presses, or is swiping the button.

You can also provide the option to assign callbacks for cases when the user:

Presses the button.

Swipes the button up to the required distance for confirmation.

Releases the button without confirming.

To accept these attributes and callbacks, make another class, and make it abstract.

Now you need a setter in the main SwipeButton class which introduces an instance of this abstract class. Using the setter you can set the desired attributes and callbacks. With all cases covered and attributes and callbacks taken from the abstract class’ instance, here’s how the SwipeButton class now looks:

Use Cases

Using this type of button interaction could be an interesting alternative to the annoying confirmation alert. I would be interested to know what use cases you would have, please add your thoughts in the comments below.