React Native Full Notes

Device Orientation Like Youtube -

First Go To App.json and set orientation:: "default";

Then go to project folder and run npm i @react-native-community/hooks

import {  } from 'expo-status-bar';

import React from 'react';

import { Dimensions, StyleSheet, SafeAreaView, Text, View, Button, Platform, StatusBar } from 'react-native';

import { useDimensions, useDeviceOrientation } from "@react-native-community/hooks";

 

export default function App() {

  const { landscape } = useDeviceOrientation();

  return (

    <SafeAreaView style={styles.container}>

      <View style={{

        backgroundColor: "dodgerblue",

        width: "100%",

        height: landscape ? "100%" : "30%",

      }}></View>

    </SafeAreaView>

  );

}

const styles = StyleSheet.create({

  container: {

    flex: 1,

    backgroundColor: '#000',

  },

});

Important: Go to Mosh First app project to see how to organize codes in folder