/Javascript/React/Width 100% react-native

Width 100% react-native

Width 100% react native

import { Dimensions } from 'react-native';

width: ${(Dimensions.get('window').width)}px;

How to take 100% width in react native

header : {
	height : 100,
  	backgroundColor: "favorite color",
    alignSelf: "stretch",
}

Width 100% react-native

First, define Dimensions.

import { Dimensions } from "react-native";

var width = Dimensions.get('window').width; //full width
var height = Dimensions.get('window').height; //full height

then, change line1 style like below:

line1: {
    backgroundColor: '#FDD7E4',
    width: width,
},

Similar codes

6 votes315 views1 answer
React state management
Javascript React
0 vote330 views1 answer
Geocoding react
Javascript React
13 votes261 views1 answer
Round button corner right react native
Javascript React
7 votes271 views6 answers
Shadow generator react native
Javascript React
0 vote304 views1 answer
Link tag react
Javascript React
4 votes307 views3 answers
React js get screen size
Javascript React
4 votes282 views1 answer
React propthpes or
Javascript React
2 votes342 views2 answers
React native asign width to image
Javascript React
0 vote304 views2 answers
A function whose declared type is neither 'void' nor 'any' must return a value.
Javascript React
0 vote279 views1 answer
Update array hooks react
Javascript React