Customize Button Pressed State Using the React Native v0.63 Pressable Component

Create a button in React Native using Text and Pressable, customise the look and feel of your button and text depending on the pressed state, and handle long presses separately to regular presses.

The Pressable component, released in React Native 0.63 is a relatively recent addition to the library. It is by far the most versatile way of creating buttons. With Pressable, you get access to the pressed state which is a boolean value that indicated whether the button is currently being pressed or not. This value can be used to render a different button style or text depending on the pressed state. You can also pass in functions that get triggered when the button was pressed and released, and handle long presses separately from regular presses.