Files

32 lines
946 B
JavaScript

import React from 'react';
import { Dimensions, Text } from 'react-native';
import Example from '../../shared/example';
export default function DimensionsPage() {
const [screenDims, setScreen] = React.useState(Dimensions.get('screen'));
const [windowDims, setWindow] = React.useState(Dimensions.get('window'));
React.useEffect(() => {
const handleChange = ({ screen, window: win }) => {
setScreen(screen);
setWindow(win);
};
const subscription = Dimensions.addEventListener('change', handleChange);
return () => {
subscription.remove();
};
}, [setScreen, setWindow]);
return (
<Example title="Dimensions">
<Text style={{ marginVertical: '1em' }} suppressHydrationWarnings={true}>
window: {JSON.stringify(windowDims, null, 2)}
</Text>
<Text suppressHydrationWarnings={true}>
screen: {JSON.stringify(screenDims, null, 2)}
</Text>
</Example>
);
}