'How to customize react native paper TextInput marker on Android

I wanna set a specific color for the text input marker on Android (shown on the image below), using the TextInput component from the react-native-paper library.

android text input marker

I've already tried the props: selectionColor, underlineColor, activeUnderlineColor, outlineColor, activeOutlineColor. But none of these works for my problem.

I've already tried to set the primary and accent colors on the theme used by the component, but that didn't work either.

This is my current code snippet:

import React, { useState } from 'react';

import styled from 'styled-components/native';
import { TextInput } from 'react-native-paper';

const Input = styled(TextInput)`
  background-color: transparent;
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 10px;
  padding-horizontal: 0px;
`;

function LoginForm() {
  const [email, setEmail] = useState('');
  const [password, setPassword] = useState('');

  const theme = {
    colors: {
      text: 'white',
      placeholder: 'white',
      primary: '#0f0',
      accent: '#0f0',
      background: '#0f0',
      surface: '#0f0',
      disabled: '#0f0',
      backdrop: '#0f0',
      onSurface: '#0f0',
      notification: '#0f0',
    },
  };

  return (
    <>
      <Input
        autoComplete
        mode="flat"
        theme={theme}
        value={email}
        label='Email'
        onChangeText={(text: string) => setEmail(text)}
        selectionColor='#ff0'
        activeUnderlineColor='#ff0'
        underlineColor='#ff0'
      />
      <Input
        autoComplete
        mode="flat"
        theme={theme}
        value={password}
        label='Password'
        onChangeText={(text: string) => setPassword(text)}
        selectionColor='#f00'
        activeUnderlineColor='#f00'
        underlineColor='#f00'
      />
    </>
  );
}

export default LoginForm;

I'd be appreciate for any help.



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source