Paper is a collection of customizable and production-ready components for React Native, following Google’s Material Design guidelines.
Material design for React Native.
Questions tagged [react-native-paper]
345 questions
2
votes
1 answer
Paper menu rendered but not clickable
I am setting up menu in headerRight of section like this:
const Tab1 = createStackNavigator({
S1: {
screen: CouponsScreen,
navigationOptions: () => ({
title: `Test`,
headerStyle: styles.headerStyle,
headerTitleStyle:…
ror
- 3,295
- 1
- 19
- 27
2
votes
3 answers
Display values of array of objects in Table format in ReactNative
I am new to React Native. My objective is to display this below array of objects in table format in React Native. I am using DataTable of React-Native-Paper.
var accounts=[
{
"accNumber": "56456454",
"accType": "D",
…
Archie
- 21
- 1
- 4
2
votes
1 answer
onDismiss function in snackbar doesn't work in react-native-paper
I'm building mobile application with react-native and react-native-paper.
And I'm using SnackBar component in react-native-paper, and if I use SnackBar component directly, onDismiss function in SnackBar component works well. (It means the snackbar…
Satoru Kikuchi
- 1,069
- 2
- 21
- 33
2
votes
3 answers
Only button text area is clickable
Clicking does not work for all parts of the button. Only the text area is clickable.
As a solution, I used contentStyle instead of style prop. But it changes only the color in the touching space of the button. I need to apply button click for the…
OS Hewawitharana
- 75
- 1
- 8
2
votes
2 answers
React Native performance for UI libraries. Which should I use : Native base vs React-Native paper?
I am developing an android app using React-Native. I bumped into two UI libraries: React-Native paper and Native-base.
I have noticed that my app is slow when I am debugging and I am worried about which of these two libraries has a better…
Daggie Blanqx - Douglas Mwangi
- 2,309
- 23
- 28
1
vote
1 answer
Why IOS Multiline Textinput not works correctly in React native paper Dialog?
I'm beginner in React native, I'm trying to have multiline textinput in dialog (dialog component from react native paper module), it works perfect on Android and Web but it not works on IOS.
There is my code:
1
vote
1 answer
How to customize React Native Paper Switch components for android?
When I use this code from react native paper I expect the switch component to be exactly look likse the **Material design 3 **switch, but unfortunately it is not and looks like older version, I was curios how to customize this component to looks…
Reza dev
- 25
- 3
1
vote
1 answer
React native TextInput shifting other element outside of screen
Here, I have a View component inside of which there is a TextInput and IconButton adjacent to each other. Where the TextInput takes the max width available because of flex-grow: 1.
The problem is when the text inside of TextInput has more increases…
Yash Sharma
- 232
- 2
- 12
1
vote
2 answers
How to Navigate in React Native Paper Bottom Navigation
How do I navigate from a screen in react native paper bottom navigation, in this example I should be able to navigate to albums screen from music screen, but navigation is undefined in the screen.
snack link:…
DarkCoder
- 93
- 1
- 11
1
vote
2 answers
How to style SegmentedButtons from react-native-paper library?
I want to custom style the SegmentedButtons from react-native-paper library.
I want to either remove the border or make them square shaped. By default the SegmentedButtons come with rounded corners.
As a solution I tried styling the SegmentedButtons…
Vikrant Bhurke
- 11
- 1
1
vote
0 answers
Searchbar from react-native-paper course view error
Every time I add in a searchbar from react-native-paper to my app, I continue to get two of these errors/warnings:
WARN (ADVICE) View #49 of type ABI48_0_0RCTView has a shadow set but cannot calculate shadow efficiently. Consider setting a…
Jordon
- 33
- 2
1
vote
0 answers
How to integrate react-native-paper (bottom-navigation) with reactnavigation?
I have my app which has react navigation like Stack Navigators, Bottom Tab navigator. I want to use the bottom navigation of react-native-paper which looks better than react-navigation.
But the problem is that when I use paper's example bottom…
chris aimsworth
- 15
- 4
1
vote
1 answer
How to change the label font in react-native-paper BottomNavigation
how can I change the font family of react-native-paper BottomNavigation label, like setting in the below example?
import * as React from "react";
import { BottomNavigation } from "react-native-paper";
import AllRiddles from…
Vahid
- 97
- 1
- 7
1
vote
0 answers
Upgrading to react-native-paper 5.2 changed @react-navigation/material-bottom-tabs
Material-Bottom-Tabs active icon with react-native-paper version 4.9.2 looks like
Material-Bottom-Tabs active icon with react-native-paper version 5.2.0 looks like
I tried searching for something like shadow, background, highlight etc. without…
tomwaitforitmy
- 509
- 3
- 16
1
vote
1 answer
How to customise the color of spinner with react-native-paper?
I try to customise the color of the spinner to green. But the color stays purple. Whatever I try to do.
So I have this:
/* eslint-disable prettier/prettier */
import { ActivityIndicator, Colors, Searchbar, withTheme } from…
mightycode Newton
- 3,229
- 3
- 28
- 54