https://github.com/logicwind/react-native-fold-detection
react-native library to detect fold device and also provide information related to fold status
https://github.com/logicwind/react-native-fold-detection
device-posture dual-screen fold-detection foldable foldable-device foldable-devices foldable-phone foldable-support multi-window react-native react-native-fold screen-posture
Last synced: 22 days ago
JSON representation
react-native library to detect fold device and also provide information related to fold status
- Host: GitHub
- URL: https://github.com/logicwind/react-native-fold-detection
- Owner: logicwind
- License: mit
- Created: 2023-11-08T06:18:06.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2025-08-07T16:35:51.000Z (9 months ago)
- Last Synced: 2025-09-11T01:37:10.257Z (8 months ago)
- Topics: device-posture, dual-screen, fold-detection, foldable, foldable-device, foldable-devices, foldable-phone, foldable-support, multi-window, react-native, react-native-fold, screen-posture
- Language: Java
- Homepage:
- Size: 1.76 MB
- Stars: 16
- Watchers: 4
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
README
# react-native-fold-detection
The purpose of the package is to provide details regarding the Android folding capability.
## Installation
```sh
npm install @logicwind/react-native-fold-detection
```
## iOS
You'll need to disable auto-linking for this package.
To do so, create react-native.config.js in the root of your project with this content:
```js
module.exports = {
dependencies: {
"react-native-fold-detection": {
platforms: {
ios: null, // this will disable autolinking for this package on iOS
},
},
},
};
```
## In App.js Wrap your app with FoldingFeatureProvider
```js
import * as React from "react";
import { FoldingFeatureProvider } from "@logicwind/react-native-fold-detection";
import SampleScreen from "./SampleScreen";
export default function App() {
return (
);
}
```
## In other screens
```js
import { useFoldingFeature } from "@logicwind/react-native-fold-detection";
const { layoutInfo, isTableTop, isBook, isFlat } = useFoldingFeature();
```
### useFoldingFeature Props
| Prop | Type | Default | Description |
| ---------- | ---------- | ------- | ------------------------------------------------------------------------------------------------------------------------ |
| layoutInfo | LayoutInfo | | Folding Feature from [android doc](https://developer.android.com/reference/kotlin/androidx/window/layout/FoldingFeature) |
| isTableTop | boolean | false | HALF_OPENED & HORIZONTAL |
| isBook | boolean | false | HALF_OPENED & VERTICAL |
| isFlat | boolean | true | |
## react-native-fold-detection is crafted mindfully at [Logicwind](https://www.logicwind.com?utm_source=github&utm_medium=github.com-logicwind&utm_campaign=react-native-fold-detection)
We are a 130+ people company developing and designing multiplatform applications using the Lean & Agile methodology. To get more information on the solutions that would suit your needs, feel free to get in touch by [email](mailto:sales@logicwind.com) or through or [contact form](https://www.logicwind.com/contact-us?utm_source=github&utm_medium=github.com-logicwind&utm_campaign=react-native-fold-detection)!
We will always answer you with pleasure 😁
## License
This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details