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

How to make custom dashed border with radius in react native?

I have searched all over the internet to find how to create a custom dashed border with radius in react native. This is what I am trying to achieve What I found best so far to work with what I need is a npm package called react-native-dash. This…
Nata Vacheishvili
  • 387
  • 1
  • 5
  • 18
0
votes
2 answers

How to make grid of squares with React Native and Flexbox?

I'd like to create the following grid with React Native using Flexbox. I tried creating this grid with the code below (see snack.expo.io for code and working version), but I get rectangles that are not spaced properly as shown here: import * as…
Chris
  • 5,444
  • 16
  • 63
  • 119
0
votes
1 answer

How do you add Margin to an Element with the flex-end property?

I am trying to position a View in the top right corner of the screen in my react native app and have done so using: alignSelf: 'flex-end' with position: absolute. This works, however I now want to add a margin around the box with margin: 15 but this…
M. Alex
  • 673
  • 5
  • 26
0
votes
1 answer

How to add Image instead of Icons in header react native elements

I am using react native elements Header to show my drawer, I am facing two problems: 1) My drawer does not cover entire top(header area). (As can be viewed in Picture the blue color not covering whole header) 2) How to add Image instead of Icon as I…
Talha Nadeem
  • 99
  • 1
  • 4
  • 22
0
votes
0 answers

TextInput Appearing at Botton in React Native

I am making a form which has Logo at its top with a back button, when I put TextInput in it, it appears at the bottom of my screen, if I try to style it on top my logo gets out of screen, Even any change in TextInput stylesheet ruin all my design, I…
Talha Nadeem
  • 99
  • 1
  • 4
  • 22
0
votes
1 answer

Text not showing in single line React Native

I want to show Text just on right side of my button but the Text didn't show in one line as it is showing like "Cre" in one line and other text in different line, The problem is with my Icon width and height which is less so it is making its child…
Talha Nadeem
  • 99
  • 1
  • 4
  • 22
0
votes
2 answers

React Native Styling, placing button in bottom left/bottom right of a pop up

So I have a box with some text inside it, below the text I want to add 2 buttons which will allow users to mark a parking space as available or taken. Below you can see the styling of the main grey box parkingPopUpText:{ fontSize: 16, …
cristian9804
  • 63
  • 1
  • 12
0
votes
1 answer

How to fill save between to views in React Native

I got two views and in my views there are two TextInput fileds in each view, the problem is that in between my each textinput filed there's a lot of space, How to fill gap between each one of them. Here's my views:
Talha Nadeem
  • 99
  • 1
  • 4
  • 22
0
votes
1 answer

React Native: Align Absolute positioned View to left/right center

I want to build a reusable component which can be docked to any edge of the parent container, please refer the following image for reference I can't use the flex for the blocks since there is supposed to be stuff rendered behind them in the parent…
Digvijay Upadhyay
  • 709
  • 1
  • 11
  • 25
0
votes
1 answer

Last item in React native flat list goes beyond screen

I have a flatlist with some styles on the outer containers as follows. // more jsx components come here (item.id &&…
Muljayan
  • 3,588
  • 10
  • 30
  • 54
0
votes
2 answers

React Native Styling problems

I have problems with styling in React Native inside a nested view. Desired Outcome: my Design : As you can see I have problems allocating the text horizontally Code: let width = Dimensions.get('window').width - 42; const styles =…
Fredyonge
  • 300
  • 1
  • 4
  • 17
0
votes
1 answer

React-native custom component renders list items under views of other components

I have created an autocomplete textbox component which basically renders a list of suggestions as the user types. When it is the only component on the screen it works fine but when I try putting it inside a view with another component its view seems…
Omri Ram
  • 37
  • 1
  • 7
0
votes
1 answer

Stylings added to a react-native view does not work correctly?

Problem: I have created a react native application and there the styling added to a one of styling does not work correctly. import React, { Component } from "react"; import { StyleSheet, KeyboardAvoidingView, View, ActivityIndicator, …
dwp
  • 908
  • 4
  • 24
  • 42
0
votes
1 answer

Displaying line bellow TouchableOpacity options wrapped in a View at the border of parent

I have a menu like component in React Native, which is wrapped in a View. This View has 3 options. I would like each option to have a line below it almost touching border of the view. In order to achieve this I have three TouchableOpacities with…
theJuls
  • 6,788
  • 14
  • 73
  • 160
0
votes
4 answers

How to find out the correct left and right margins of the content in react-native for multiple devices?

The Problem: I create a little iPhone app with React Native v 0.61 My content follows a general line on the left and right with a margin of 25px which looks very good on the bigger iPhones (iPhone X+) but when viewed on the Iphone SE it doesn't look…
GeraltDieSocke
  • 1,524
  • 3
  • 20
  • 51
1 2 3
…
13
14