React-native-paper: Stylization of TextInput

Created on 12 May 2020  路  1Comment  路  Source: callstack/react-native-paper

I can't change the color of the label, the characters inside the input, the borders. What procedure to style TextInput?

question

Most helpful comment

You can use the Theme property in the TextInput

Here I have changed the color to red

theme={{
  colors: {
    primary: "red",
  },
}}

Output
image

Full TextInput Code for Reference

<TextInput
  mode="outlined"
  label="Name*"
  value={this.state.name}
  theme={{
    colors: {
      primary: "red",
    },
  }}
  onChangeText={(name) => {
    this.setState({
      name,
    });
  }}
  style={styles.customStyles}
/>

>All comments

You can use the Theme property in the TextInput

Here I have changed the color to red

theme={{
  colors: {
    primary: "red",
  },
}}

Output
image

Full TextInput Code for Reference

<TextInput
  mode="outlined"
  label="Name*"
  value={this.state.name}
  theme={{
    colors: {
      primary: "red",
    },
  }}
  onChangeText={(name) => {
    this.setState({
      name,
    });
  }}
  style={styles.customStyles}
/>
Was this page helpful?
0 / 5 - 0 ratings