- Welcome
- Getting started
- Latest updates
- Foundations
-
Components
- Accordion
- Alert
- Alignment
- Aria live
- Autosuggest
- Badge
- Banner alert
- Bar chart
- Blockquote
- Bottom navigation
- Bottom sheet
- Breadcrumb
- Breakpoint
- Button
- Calendar
- Card
- Card List
- Card button
- Carousel
- Checkbox
- Chip
- Chip group
- Code
- Content cards
- Data Table
- Datepicker
- Description list
- Dialog
- Divider
- Drawer
- Field Set
- Flare
- Flat list
- Flight leg
- Floating action button
- Floating notification
- Form label
- Form validation
- Graphic promotion
- Horizontal navigation
- Icon
- Image
- Infinite scroll
- Link
- List
- Map
- Mobile scroll container
- Modal
- Navigation bar
- Nudger
- Overlay
- Page indicator
- Pagination
- Panel
- Phone input
- Picker
- Popover
- Price
- Progress bar
- Radio button
- Rating
- Scrollable calendar
- Section header
- Section list
- Select
- Skeleton
- Skip link
- Slider
- Snackbar
- Snippet
- Spinner
- Split input
- Star rating
- Switch
- Table
- Text
- Text input
- Theming
- Ticket
- Toast
- Tooltip
- Touchable native feedback
- Touchable overlay
- Content
- Accessibility
Touchable overlay
This component is a replacement for the default React Native Touchable Highlight component. The default Touchable Highlight component works by decreasing the opacity of the wrapped view to show an underlay colour. When views are nested within a Touchable Highlight wrapped view, their opacity is unchanged which produces an undesirable result. Have a look at the example below to see them both in action.
Note: This component is iOS only, for Android please use BpkTouchableNativeFeedback component.
Made with ❤️ by Skyscanner © 2023
© 2023 Skyscanner Backpack. Page last updated on Jan 16, 2023, 12:30