Изменение цвета ввода текста на бумаге React Native Paper

#reactjs #react-native #react-native-paper

#reactjs #react-native #react-native-paper

Вопрос:

Это мой собственный код React, использующий React Native Paper для генерации ввода текста.

 import * as React from 'react';
import { TextInput } from 'react-native-paper';

class MyComponent extends React.Component {
  state = {
    text: ''
  };

  render(){
    return (
      <TextInput
        label='Email'
        value={this.state.text}
        onChangeText={text => this.setState({ text })}
      />
    );
  }
}
  

Он сгенерирует следующий текстовый ввод :

Как я могу изменить цвет текста «Метки ввода» с синего на красный?

это официальная документация:https://callstack.github.io/react-native-paper/1.0/text-input.html но, похоже, не могу найти способ изменить цвет с синего на красный.

Ответ №1:

Согласно их документации, вы должны изменить тему. Если вы хотите заменить синий везде, вы можете изменить основной цвет здесь:

 const theme = {
  ...DefaultTheme,
  roundness: 2,
  colors: {
    ...DefaultTheme.colors,
    primary: '#ff0000',
  },
};
  

Вы также должны иметь возможность изменять цвет вашего ввода только с помощью:

 <TextInput theme={{ colors: { primary: #ff0000 } }}/>
  

Ответ №2:

у меня есть эта тема, но она не меняет цвет входных данных

 export const theme = {
  ...DefaultTheme,
  colors: {
    ...DefaultTheme.colors,
    text: '#000000',
    primary: '#1cb0f6',
    secondary: '#e5e5e5',
    error: '#f13a59',
  },
}
  

вы можете изменить вот так:

  <Input
    style={styles.input}
    selectionColor={theme.colors.primary}
    underlineColor="transparent"
    mode="outlined"
    theme={{ colors: { primary: theme.colors.primary } }}
    {...props}
  />