How can I make this curved svg pressable?

Question

I want to have a curved svg and want to ask you how to can I make this red circle pressable ?

Curved Bar

Answer 1

Use Pressable instead of View Component.

<View
  style={{
    position: 'absolute',
    width: middleIconSize,
    height: middleIconSize,
    borderRadius: midRadius,
    backgroundColor: 'red',
    left: width / 2 - midRadius,
    bottom: tabBarHeight - midRadius,
  }}
/>

to

<Pressable
  style={{
    position: 'absolute',
    width: middleIconSize,
    height: middleIconSize,
    borderRadius: midRadius,
    backgroundColor: 'red',
    left: width / 2 - midRadius,
    bottom: tabBarHeight - midRadius,
  }}
  onPress={() => {console.log('Do what you want!')}}
/>