Quantcast
Channel: Active questions tagged react-native+ios - Stack Overflow
Viewing all articles
Browse latest Browse all 16750

Is there a way for a TextInput to behave like a button i.e. be able to be selected (onPress) or can the user enter the title of a button?

$
0
0

I am making a react native health app in which the user can select tags to describe certain symptoms they are facing. I am trying to let the user create their own tags, at the moment the user can enter tags but cannot select them. Is there a way to allow them to select text inputs?

Here is how I have allowed users to create text inputs

 addTextInput = (index) => {    let textInput = this.state.textInput;    textInput.push(<TextInput            style={styles.textInput}            onChangeText={(text) => this.addValues(text, index)}            editable={true}                      />    );    this.setState({ textInput });}removeTextInput = () => {    let textInput = this.state.textInput;    let inputData = this.state.inputData;    textInput.pop();    inputData.pop();    this.setState({ textInput, inputData });}

and this is what my current tags look like:

https://i.stack.imgur.com/5znWo.jpg

on the picture when the user presses the plus a new tag/TextInput is created, what I want is when the user presses it, it should be able to change color or the like.

here is the code for the plus button:

<View style={{ flexDirection: 'row', flexGrow: '1', flexWrap: 'wrap', width: Responsive.width(300) }}>                            {this.state.textInput.map((value) => {                                return value                            })}<TouchableWithoutFeedback onPress={() => {                                this.addTextInput(this.state.textInput.length)                            }                            }><Image                                    style={{ marginLeft: 8, width: 38, height: 38 }}                                    source={require('../../../assets/plusButton.png')}                                /></TouchableWithoutFeedback>                            {/* <Button title='Get Values' onPress={() => this.getValues()} /> */}</View><View style={styles.row}><View style={{ margin: 10, top: Responsive.height(75) }}><Button onPress={() => this.removeTextInput()}>Remove</Button></View></View>

Viewing all articles
Browse latest Browse all 16750

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>