Files
react-native/Libraries/Utilities/useWindowDimensions.js
T
Tim Yung c47a03563d RN: Change Dimensions to Return EventSubscription
Summary:
Changes `Dimensions.addEventListener` to return an `EventSubscription` object that has a `remove()` method on it.

In an upcoming commit, calling `Dimensions.removeEventListener` will lead to a deprecation warning.

Changelog:
[General][Change] - `Dimensions.addEventListener` now returns an `EventSubscription`.

Reviewed By: kacieb

Differential Revision: D26808827

fbshipit-source-id: 0cfdc65b83c177f60937c1aa3a4cf633592f73d7
2021-03-10 16:06:26 -08:00

39 lines
1.2 KiB
JavaScript

/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @format
* @flow strict-local
*/
import Dimensions from './Dimensions';
import {type DisplayMetrics} from './NativeDeviceInfo';
import {useEffect, useState} from 'react';
export default function useWindowDimensions(): DisplayMetrics {
const [dimensions, setDimensions] = useState(() => Dimensions.get('window'));
useEffect(() => {
function handleChange({window}) {
if (
dimensions.width !== window.width ||
dimensions.height !== window.height ||
dimensions.scale !== window.scale ||
dimensions.fontScale !== window.fontScale
) {
setDimensions(window);
}
}
const subscription = Dimensions.addEventListener('change', handleChange);
// We might have missed an update between calling `get` in render and
// `addEventListener` in this handler, so we set it here. If there was
// no change, React will filter out this update as a no-op.
handleChange({window: Dimensions.get('window')});
return () => {
subscription.remove();
};
}, [dimensions]);
return dimensions;
}