Stack Overflow
Stack Overflow

Questions tagged [react-native-paper]

Paper is a collection of customizable and production-ready components for React Native, following Google’s Material Design guidelines.

Material design for React Native.

345 questions
20
votes
4 answers

Change text color of TextInput in React Native Paper

How can I change text color of TextInput in React Native Paper without wrapping in PaperProvider? Currently this works: const theme = { ...DefaultTheme, colors: { ...DefaultTheme.colors, text: "orange", } };
Adrian Bartholomew
  • 2,506
  • 6
  • 29
  • 37
15
votes
2 answers

How do I use the useTheme hook inside my Stylesheet create?

I want to use the colors from my react native paper theme inside the stylesheet create function inside my component. Here's my code import { StyleSheet, Text, View } from 'react-native'; import { useTheme } from 'react-native-paper'; const Home =…
laneherby
  • 405
  • 5
  • 15
13
votes
1 answer

Floating AutoComplete in React Native

I am looking for an autocomplete-text-input with the floating suggestion box. Please suggest me any package name that can help to make the same component. I tried to many packages but nothing helps, some are pushing the next fields, others do not…
Infopedia
  • 376
  • 2
  • 14
9
votes
2 answers

Icons not showing in React Native + React Native Paper app

This is a fresh React Native app using React Native Paper. I followed the instructions at https://callstack.github.io/react-native-paper/getting-started.html and installed react-native-paper and react-native-vector-icons. For some reason, none of…
Sam
  • 26,817
  • 58
  • 206
  • 383
8
votes
0 answers

React Native Paper - bug or am I stupid?

The problem is with React-native-papers and TextInput component.(And maybe the lack of my css/flexbox knowledge) When alignItems: 'center' is used on a View above TextInput in the tree the TextInput's rendering is wonky. It takes the full height of…
Rzll
  • 91
  • 5
8
votes
1 answer

How do I set custom drawer items to "focused" dynamically?

My end goal here is to give a few drawer items custom background colors depending on a few states set elsewhere. I understand that in order to give unique background colors to drawer items, I need to set up custom drawer content. However, I am…
jdperos
  • 97
  • 1
  • 7
8
votes
3 answers

React Native: Change text colour in Paper Button

I am relatively new in react native. I can easily show button (with shadow, etc) as in here. I am also…
Khant Thu Linn
  • 5,905
  • 7
  • 52
  • 120
7
votes
2 answers

How to change react native paper bottom navigation active color?

I want to change the color of react-native-paper naviagation. How can i change the color. I am able to change the color of background but not able to change the color of active tab round button. Image Link = https://i.stack.imgur.com/3Edpm.png I…
shoaibdevs
  • 401
  • 6
  • 18
7
votes
1 answer

How to change the width of table column in DataTable of react-native-paper

The columns are arranging by default, if I try to give width to cell and title, there is no change in result. So how can I arrange column width explicitly? …
Prajna
  • 578
  • 4
  • 8
  • 23
7
votes
3 answers

How to Change the Border Color in TextInput

I want to change the color or the border in this code before the focus I want the color red and on the focus I want the color yellow. This my work https://prnt.sc/o8evi5 This is the code I have and I am using React Native Paper…
Maher Aldous
  • 894
  • 1
  • 10
  • 14
6
votes
0 answers

How can I increase the size of the icon alone in FAB.Group in react-native-paper

I need to customize the FAB.Group with my custom icon and the text. If I set the width and height the image gets hiding and simultaneously it increasing the size of the text too. How can I style this image as big and text as it is in…
sejn
  • 2,040
  • 6
  • 28
  • 82
5
votes
4 answers

How to change ripple color of button in react-native-paper

I am using Button component from react-native-paper for my application. I set by background to some value. How can I change the ripple color that appears when touched. My button component
5
votes
0 answers

react-native-paper icons error on Android using Expo

I'm using Expo and react-native-paper. In the react-native-paper docs it says: "If you use Expo, you don't need to install vector icons" The icons work on the web version in Expo, but not on Android (emulator or through the app). On Android I get…
Otju
  • 51
  • 2
5
votes
2 answers

React native paper TextInput in Modal, cursor flashes backwards after a character is input

Some odd behaviour on a TextInput on a Modal in React Native Paper. When I type a character, it is input into the text box, but then the cursor flashes back (as if it is deleted) and then it reappears again. This all happens very quickly and the…
RiddleRiddlerRddler
  • 303
  • 3
  • 17
5
votes
4 answers

React native paper DataTable.Cell overflow text causes hide full text

Below code using DataTable.Cell. If text bigger than column width it hide text Please help need to display text if text bigger than column width need to break text in next line.
Cirff
  • 63
  • 1
  • 7
1
2 3
…
22 23