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
1 answer

How to make a 3 column - 4 row layout of responsive squares?

I want to create a 3x4 grid layout of squares that is device independent. The container for these squares has an unknown width/height. I want the squares to grow to fill the available container. Code for container: squaresContainer: { …
pfinferno
  • 1,779
  • 3
  • 34
  • 62
0
votes
1 answer

React Native: cant change button style

I am trying to change the style of a button in React Native, but the edits for the button colour, margin, outlines etc aren't working at all. Here is the pic. Below is my code for HomeScreen.js import React from 'react'; import { StyleSheet, …
btzy
  • 45
  • 1
  • 1
  • 6
0
votes
1 answer

Align Item Right within container

This is probably a simple answer but I am still learning js / react native and am a bit at a loss. Could someone explain why the following code fails to right align the "handicap" element? import React from 'react'; import {View, StyleSheet } from…
user16541120
0
votes
3 answers

React Native - Scalable Stylesheet for Specified Screen Sizes

I need to change style sizes into 3 different sizes such as width<520, width<768, width<960 I tried to make a conditional stylesheet as {const width = useWindowDimensions().width; //Codes ...} if( 0 <= width <= 520) { const styles =…
nogabemist
  • 402
  • 5
  • 29
0
votes
1 answer

How to change style of a hook?

I have an if statement that sets a Hook, but I want to besides varying the text inside also vary the style, is it possible? here is the code const [ageLabel, setAgeLabel] = useState('Age'); const testDate = () => { let day = parseInt(dayText); …
Daniel Döbereiner
  • 47
  • 5
0
votes
1 answer

How to space the children of a View Component React Native

I want a gap of say 30px; between all children of my card (View) component. return ( ... ...
Ahmed Shaikh
  • 106
  • 8
0
votes
1 answer

Adding a value to a TextInput changes the font-weight for some reason

I'm trying to format the date while the user is typing but when I add the value field (value={this.state.dob}) the style changes for a bolder font-weight (and sometimes changes for the right font weight mid typing). It really seems to come from the…
EnligthenedOctopus
  • 11
  • 2
0
votes
1 answer

How to get information when the switch is flipped React-Native

I want to get the information whether the switch was switched or not. And import this information in other files. And then I want to make an IF query for StyleSheet. const DarkLightSwitch = () => { const [lock, setLock] = useState(); return ( …
fthkryksl
  • 27
  • 6
0
votes
1 answer

Dynamic Text Background Highlight Animation with Duration in React Native

I have stuck at this point to dynamically highlight some bunch of text in some duration. Like for example, I have this text : Lorem Ipsum is simply a dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard…
harshita
  • 457
  • 1
  • 5
  • 19
0
votes
1 answer

Accidentally put shadows on my text when creating a shadow border outline

When creating a border that has shadows, I noticed whatever text I put inside that border(which is a view) that my text also has the same shadow implementation. How can I achieve this same shadow effect on my border but leave my text to the default…
Justin Priede
  • 444
  • 6
  • 30
0
votes
1 answer

How to create a wave with my view on react native

I wanna create a specific form with my view. The view is supposed to do this But i struggling with react native. Also my code return StyleSheet.create({ parent: { height: '30%', width: '30%', transform: [{ skewX: '50deg' }, {…
Xwingoga06
  • 99
  • 1
  • 10
0
votes
1 answer

Native Base - _focus not changing certain component stylings

I'm working on editing the theme for our app and I've noticed something very strange. I'm trying to edit the Input component's border-color while it's being focused on. However, nothing seems to override the default color that's given. I'm wondering…
Brandon-Perry
  • 366
  • 4
  • 18
0
votes
1 answer

Can I use a function instead of color name in react native

I created a counter app using redux I want to change the color when the value is 0 and again change when the value is 1. I created a function for this, when I use console.log its shows the right color name but it does not show when I call a function…
Chaudhary Ahmad
  • 11
  • 3
0
votes
1 answer

Flex is not splitting components equally in react native

I'm trying to make a layout like this: In order to do so, I've made two components named HalfWidthFullHeightCard and HalfWithHalfHeightCard. I've created the HalfWidthFullHeightCell component as? …
Chaudhry Talha
  • 7,231
  • 11
  • 67
  • 116
0
votes
1 answer

How can I declare an object property in TypeScript?

This code snippet gives me this error: Type 'JustifyContent | undefined' is not assignable to type '"space-around" | "space-between" | "space-evenly" | "center" | "flex-end" | "flex-start" | undefined'. Type 'string & {}' is not assignable to type…
Victor Hugo
  • 71
  • 4
1 2 3
…
13 14