percentage width react native

codewi answered on January 22, 2022 Popularity 9/10 Helpfulness 7/10

answer percentage width react native

related Percentage Height And Width React Native

percentage width react native

Comment

// Firstly, import Dimensions, and save the window's width and height 
import {Dimensions} from "react-native";

var width = Dimensions.get("window").width; 
var height = Dimensions.get("window").height; 

// Then inside your stylesheet you can use something like this:
width: width * 0.9, // Sets width to 90%

Popularity 9/10 Helpfulness 7/10 Language javascript

Source: Grepper

Tags: javascript percentage react-native width

Link to this answer
Share Copy Link

Contributed on Jan 22 2022

codewi

0 Answers Avg Quality 2/10

Closely Related Answers

Percentage Height And Width React Native

Comment

import React from 'react';
import { View } from 'react-native';

const PercentageDimensionsBasics = () => {
  // Try removing the `height: '100%'` on the parent View.
  // The parent will not have dimensions, so the children can't expand.
  return (
    <View style={{ height: '100%' }}>
      <View style={{
        height: '33%', backgroundColor: 'red'
      }} />
      <View style={{
        width: '66%', height: '35%', backgroundColor: 'blue'
      }} />
      <View style={{
        width: '20%', height: '50%', backgroundColor: 'yellow'
      }} />
    </View>
  );
};

export default PercentageDimensionsBasics;

Popularity 9/10 Helpfulness 4/10 Language javascript

Source: Grepper

Tags: height he

Link to this answer
Share Copy Link

Contributed on Sep 07 2022

Javasper

0 Answers Avg Quality 2/10

percentage width react native

Contents

More Related Answers

percentage width react native

Closely Related Answers

Percentage Height And Width React Native

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.