Stack Overflow
Stack Overflow

Questions tagged [react-native-stylesheet]

React Native Stylesheets provide styling capabilities similar to CSS stylesheets. Use this tag for questions about working with React Native Stylesheets or styling React Native code in general.

React Native Stylesheets provide styling capabilities similar to CSS stylesheets.

See https://reactnative.dev/docs/stylesheet.html for more info.

210 questions
0
votes
2 answers

How to make a border-radius on MaterialTopTabNavigator in react-native

I'm making a top navigation bar in react native. Here is the image of output I have: The result of image I need to get: I need to add a border and a background color in each tab Here is my code: import React, { Component, useState } from…
Rahman Haroon
  • 1,088
  • 2
  • 12
  • 36
0
votes
1 answer

Make Image Fit Inside a View React native

there's a gap above the Image inside the View. Im trying to make it fit the Image inside my View My Output What i want to achieve Here is my code import React from 'react'; import {View, Text, StyleSheet, Image, TouchableOpacity} from…
Кріс
  • 147
  • 1
  • 2
  • 7
0
votes
1 answer

How to get real screen resolution using Dimensions in react-native / expo and style the app?

i am working on a react-native/expo app. yesterday i got to the styling stage and learned that Dimensions.get('window').width returns half of the real width of my devices (one android, one iPad), but the real width of an emulated android device. it…
deadmanone
  • 15
  • 1
  • 5
0
votes
1 answer

Top view and Bottom view heights are fixed, middle view need to fit in remaining space

I have 3 views top view, middle view, bottom view. The top view and bottom view has it's components and they are fixed in height in a vertically aligned container view. Now, I need the middle view to be flexible in height, i.e., the height of middle…
Harsha
  • 760
  • 1
  • 7
  • 21
0
votes
2 answers

adding form validation in react-native, removing extra spaces

I have a login form that looks like this (1): when I add form validation it looks like this (2): the spcaes between the textInputs are because I have something like this:
S. N
  • 3,456
  • 12
  • 42
  • 65
0
votes
1 answer

React Native: keeping the icons position fixed

I am using react-native-autocomplete-input component's I inserted two icons at left(search) and right(close) of AutoComplete.
Om Sao
  • 7,064
  • 2
  • 47
  • 61
0
votes
1 answer

How to achieve something like this using React Native

How can i make a component like this: I managed to do it until now: Here's how my code looks like: viewStyle: { backgroundColor: color.bgColor, alignSelf: 'center', width: 100, height: '100%', top: '30%', …
Talha Nadeem
  • 99
  • 1
  • 4
  • 22
0
votes
1 answer

React native need to render rounded shadow on rounded button

I need to render rounded shadow on rounded button. Shadow should be render like given in image but some how i am not able to render like that. But it is not render properly and display like below. It looks like below Style will be like this const…
Chirag Shah
  • 3,034
  • 1
  • 30
  • 61
0
votes
1 answer

React Native component loose arrangement when a new component is added

I have the following view in a React Native app: And this is the code for it: index.js import React, {useContext} from 'react'; import {View, StyleSheet} from 'react-native'; import {Headline, Button, IconButton} from 'react-native-paper'; import…
HuLu ViCa
  • 5,077
  • 10
  • 43
  • 93
0
votes
2 answers

How to call multiple screens on one page in React Native

I have made a Home page in which there are three buttons in the header (like a tab navigator) I want something like on clicking each button a screen appears beneath the header, as shown in the image below: Here's what I have…
Talha Nadeem
  • 99
  • 1
  • 4
  • 22
0
votes
1 answer

React Native TouchableOpacity not working after setting styles of text

Hi I am new with React Native I've made a form and at the bottom of form I've added these lines New here? Create an account which on clicking "Create an account" text it should navigate on the directed screen.. but as soon as I'have added the styles…
Talha Nadeem
  • 99
  • 1
  • 4
  • 22
0
votes
1 answer

How to apply values from props to styles?

I created a custom component: import React from 'react'; import {View, StyleSheet, TouchableOpacity} from 'react-native'; const Square = ({size, color, onPress, children}) => { return (
Leem.fin
  • 40,781
  • 83
  • 202
  • 354
0
votes
1 answer

How to make this kind of dialog in react native

I tried this but, i do't get my actual output. I am trying many solution but not getting proper. share your answeer for this solution. card:{ height:150, width:"80%", backgroundColor:"white", borderRadius:15, padding:10, elevation:10, …
Hitesh Tarbundiya
  • 464
  • 4
  • 13
0
votes
2 answers

react-native cant achieve borderRadius result as I want

Hi guys so i try to add two icons of hearts like in this picture: I tried to make these components: my…
Emilis
  • 152
  • 1
  • 4
  • 21
0
votes
3 answers

Right aligning a single item in React Native

In my React Native app, I have a card with a bunch of buttons at the bottom of it -- see image below. I want to leave the first two icons where they are, on the left but move the (X) button all the way to the right. How do I accomplish this? Here's…
Sam
  • 26,817
  • 58
  • 206
  • 383
1 2 3
…
13 14