react-native
react-native copied to clipboard
TouchableWithoutFeedback does not support style
Description
the TouchableWithoutFeedback
component does not support styling.
There was another issue about this problem which is closed, and not fixed. it was suggested to add a View
inside TouchableWithoutFeedback
and add style to View
.
But it does not fix the problem! for example if if you want to create a circular TouchableWithoutFeedback
, that is only touchable from inside the circle (onPress
be called only if the circle area is touched), you should be able to add a borderRadius
style to TouchableWithoutFeedback
component itself.
Steps to reproduce
create a TouchableWithoutFeedback
component, and add style to it.
React Native Version
0.73.6
Affected Platforms
Runtime - Android, Runtime - iOS
Output of npx react-native info
System:
OS: Linux 6.5 Ubuntu 22.04.4 LTS 22.04.4 LTS (Jammy Jellyfish)
CPU: (16) x64 13th Gen Intel(R) Core(TM) i7-13620H
Memory: 20.65 GB / 31.07 GB
Shell:
version: 5.8.1
path: /usr/bin/zsh
Binaries:
Node:
version: 20.12.1
path: ~/.nvm/versions/node/v20.12.1/bin/node
Yarn: Not Found
npm:
version: 10.5.0
path: ~/.nvm/versions/node/v20.12.1/bin/npm
Watchman: Not Found
SDKs:
Android SDK: Not Found
IDEs:
Android Studio: AI-232.10300.40.2321.11567975
Languages:
Java: Not Found
Ruby: Not Found
npmPackages:
"@react-native-community/cli": Not Found
react:
installed: 18.2.0
wanted: 18.2.0
react-native:
installed: 0.73.6
wanted: 0.73.6
npmGlobalPackages:
"*react-native*": Not Found
Android:
hermesEnabled: Not found
newArchEnabled: Not found
iOS:
hermesEnabled: Not found
newArchEnabled: Not found
### Stacktrace or Logs
```text
no log
Reproducer
http://localhost:3000
Screenshots and Videos
No response
:warning: | Missing Reproducible Example |
---|---|
:information_source: | We could not detect a reproducible example in your issue report. Please provide either:
|
Hey, @famdude! Check this custom file to support styling in the component https://gist.github.com/mensonones/d615f87ea752e181164e5170f115c0f8
After change file. Use
<TouchableWithoutFeedback onPress={() => Alert.alert('Hello, world!')} style={styles.button}>
<Text style={styles.paragraph}>Press me!</Text>
</TouchableWithoutFeedback>