react-native-safe-area-context#initialWindowMetrics JavaScript Examples

The following examples show how to use react-native-safe-area-context#initialWindowMetrics. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: App.js    From actual with MIT License 5 votes vote down vote up
render() {
    let { loadingText } = this.props;
    let { initializing } = this.state;

    let content;
    let showBackground = true;
    if (!initializing) {
      if (!this.props.budgetId) {
        content = <ManagementApp />;
      } else {
        content = <FinancesApp />;
        showBackground = false;
      }
    }

    return (
      <SafeAreaProvider initialMetrics={initialWindowMetrics}>
        <View style={{ flex: 1 }}>
          <StatusBar translucent backgroundColor="transparent" />
          {showBackground && (
            <>
              <View
                style={{
                  position: 'absolute',
                  top: 0,
                  left: 0,
                  right: 0,
                  bottom: 0,
                  backgroundColor: colors.n3,
                  justifyContent: 'center',
                  alignItems: 'center'
                }}
              >
                {(initializing || loadingText != null) && (
                  <Image style={{ width: 64, height: 64 }} source={logo} />
                )}
              </View>

              <View
                style={{
                  position: 'absolute',
                  top: 0,
                  left: 0,
                  right: 0,
                  bottom: 0,
                  justifyContent: 'center',
                  alignItems: 'center'
                }}
              >
                {(initializing || loadingText != null) && (
                  <View style={{ paddingTop: 125, alignItems: 'center' }}>
                    {loadingText !== '' && loadingText !== null && (
                      <Text
                        style={{
                          color: 'white',
                          fontSize: 16,
                          marginVertical: 10
                        }}
                      >
                        {loadingText}
                      </Text>
                    )}
                    <AnimatedLoading width={30} height={30} color="white" />
                  </View>
                )}
              </View>
            </>
          )}
          {content}
        </View>
      </SafeAreaProvider>
    );
  }
Example #2
Source File: index.js    From stayaway-app with European Union Public License 1.2 5 votes vote down vote up
export default function Root () {
  const dispatch = useDispatch();

  const appLaunched = useSelector(isAppLaunched);
  const storedTheme = useSelector(getTheme);
  const systemTheme = useColorScheme();

  const theme = THEMES[storedTheme] || THEMES[systemTheme || LIGHT];

  // Set navigationr reference
  const ref = useRef(null);
  NavigationService.setNavigationRef(ref);

  // Startup app
  useEffect(() => {
    if (appLaunched) {
      setTimeout(() => {
        // Set status bar
        if (Platform.OS === 'android') {
          StatusBar.setBackgroundColor('transparent');
          StatusBar.setTranslucent(true);
        }

        // Hide splash screen on resume
        SplashScreen.hide();
      }, 1500);
    } else {
      // Dispatch startup action
      dispatch(startupActions.startup());
    }
  }, [appLaunched]);

  // Re-render when theme changes
  useEffect(() => {}, [storedTheme]);

  if (! appLaunched) {
    return null;
  }

  return (
    <ThemeProvider value={theme}>
      <SafeAreaProvider initialMetrics={initialWindowMetrics}>
        <NavigationContainer ref={ref}>
          <RootNavigator />
        </NavigationContainer>
        <Modals />
      </SafeAreaProvider>
    </ThemeProvider>
  );
}