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
0
votes
0 answers

Why in React-Native-Paper TextInput.Icon not working when extracted to custom component

In react-native-paper if I am using TextInput with Icon like this it works fine. } /> But if I export the Icon part to custom element it stop showing the Icon. Am I doing…
0
votes
4 answers

Why is the text going multiple lines when I unselect it?

I'm using React Native and React Native Paper and I am fiddling around with the TextInput component. I type some random text inside so it overflows No problem, but when I deselect it, it goes on multiple lines. How can I make it so it stays on one…
da coconut
  • 809
  • 2
  • 9
  • 11
0
votes
0 answers

Bottom Tabs in Drawer Navigator

I read the documentation of react-navigation to create drawer and tab navigator. The drawer is good but the tab navigator does not meet my need. I wish a bottom tab navigation was a shorcut to drawer menu and it should be displayed to all other…
0
votes
1 answer

how to flex space-between 2 elements in react native paper card.actions

Using: https://callstack.github.io/react-native-paper/card-actions.html How I can position 2 buttons with flex space between? Nothing I am trying is working.
BennKingy
  • 1,265
  • 1
  • 18
  • 43
0
votes
1 answer

React Native Paper FAB.Group Icon stays on screen after navigating to another screen using react-native-navigator

Whenever I try to swop between screens the FAB still remains visible and sometimes interferes with the functionality of components on the lower part of the screen as if a large square is rendered over the lower half of the page. I tried using…
0
votes
0 answers

React-Native Paper Drawer.Navigator is invisible when Appbar has Appbar.Actions

I have a fairly simple React Native app that I am using to showcase a custom component library. I recently upgraded the app from React Native version 0.67.2 to 0.70.6. React Navigation is still on version 5.x (latest is 6.x). My issue is that when I…
GreatDane
  • 23
  • 5
0
votes
0 answers

create table layout in react native which supports clicks and icons with nested columns

I want to create a table layout in react native, which should support custom views, like clicking or showing of icons. Something like this, where in last two columns are further divided. How can i achieve this. Tried using DataTable of react native…
0
votes
1 answer

Dialog not going up upon input

So in my application, I'm using a dialog to edit a list item. When clicking the cog a Dialog shows up with two text fields. Upon clicking on one of those the Dialog stays in place instead of moving up to make space for the keyboard. The expected…
kalempster
  • 397
  • 3
  • 13
0
votes
1 answer

How to pass props to forwardref

I am using a forwardref to pass a library component into another library component. I need a way to also pass some props into the forwardref, such as text input label. I searched high and low and can't seem to find how to do this. When I check the…
Nika Bo
  • 63
  • 1
  • 11
0
votes
0 answers

Turn off dark mode and change label from date picker in react-native-paper

I have a Date picker from react-native-paper. Import import { DateTimePicker } from '@hashiprobr/react-native-paper-datetimepicker'; But this picker is dark mode, I want design like this but I got this How to change the theme and label? Here is…
0
votes
0 answers

Styled component - how to add a render prop to create masked input

I am trying to add masked input to a styled component based on react-native-paper Text Input. Here is my styled component : const StyledTextInput = styled.TextInput` border-color: #68c25a; border-width: 1px; border-radius: 5px; height:…
Nika Bo
  • 63
  • 1
  • 11
0
votes
2 answers

Date Picker from react-native-paper styles

I need to implement Date-Picker from react-native-paper with this design, start date and end date and I need to choose dates from calendar. This is the design that I need to implement I create this but it's not the same. import * as React from…
Manche
  • 47
  • 2
  • 10
0
votes
1 answer

How to use React Native Paper Checkbox or Checkbox.Item using FlatList?

You can only check and uncheck at once with the current source. I want to do it one by one... The number of lines in the obdngList list is not determined. As an example, I wrote two lines. Help :( thank you!! const [checked, setChecked] =…
0
votes
1 answer

react-native-paper TextInput icon color not working

I'm using react-native-paper TextInput to show email icon on the left side of text input and that icon should be green (#22C55E) but it's still showing the default color.
Armin Dervić
  • 165
  • 2
  • 11
0
votes
0 answers

react-native-paper: remove highlight of RadioButton.Item when pressed

When you press the Radio button behind appears an highlight animation which I want to remove I looked the doc but I didn't see anything that could help it, my version: "^4.12.4" here is the link of snack if anyone needs it ==>…