Dimensions API

PHOTO EMBED

Wed Mar 16 2022 14:00:37 GMT+0000 (Coordinated Universal Time)

Saved by @markmarleydev

 
  // Using the dimension to dynamically change the size
Import {dimensions} from "react-native"


width: Dimensions.get("window").width / 4
// Can be used on other properties but mainly height 

// Use cases within terniary

marginTop: Dimensions.get("window").height > 600? 20 : 5

// use cases wit if statement

if(Dimensions.get("window").width < 350){
  listContainerStyle = styles.listContainerBig;
}

// Setting the height using Dimensions

MarginVertical: Dimensions.get("window").height / 20 
// sets it to 5 % of the device height

MarginVertical: Dimensions.get("window").height / 40 
// sets it to 2.5 % of the device height
content_copyCOPY