Skip to content

RadioGroup clicking row with children #808

@ferrannp

Description

@ferrannp

Current behaviour

RadioGroup will pass onPress to the RadioButton children. That makes not possible to for example have a whole row clickable.

Expected behaviour

Proposed solution:

  1. If children are solely RadioButton(s), place the onPress on it
  2. If children contain something else, place a TouchableRipple around it with the onPress prop
  3. Suggestions?

Code sample

<RadioButton.Group
  onValueChange={value => this.setState({ value })}
  value={this.state.value}
>
  <View style={styles.row}>
    <RadioButton value="first" />
    <Text>First</Text>
  </View>
  <View style={styles.row}>
    <RadioButton value="second" />
  </View>
</RadioButton.Group>

^ in this case, it'd be nice that RadioButton.Group would place a TouchabelRipple around the children and control the onPress.

Snack here.

Your Environment

software version
react-native-paper 2.9.1

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions