How to make multiline label in TextField react native?-CodePudding

this is my code

<View>
                <TextField
                  ref={this.layananMenu}
                  editable={false}
                  label={
                    'Produk investasi apa saja yang pernah kamu miliki?'
                  }
                  
                  value={this.state.product?.menuName}
                  renderRightAccessory={() =>
                    this.state.loadingUsaha ? ( //ganti
                      <ActivityIndicator animating={true} />
                    ) : (
                      <Icon name={'keyboard-arrow-down'} size={24} />
                    )
                  }
                />
              </View>

and the result is : my code result

my expectation is : my expectation from UI design

CodePudding user response：

Welcome to SOFlow.It can be done using multiline={true} or giving padding in the text field,<TextField style={...} Hope it would work.

<TextField 
      ref={this.layananMenu}
      editable={false}
      label={'Produk investasi apa saja yang pernah kamu miliki?'}
      multiline = {true}
    />

CodePudding user response：

Add multiline prop in TextField in this way:

<TextField 
 ref={this.layananMenu}
 editable={false}
 label={'Produk investasi apa saja yang pernah kamu miliki?'}
 multiline={true}
/>