Security News
The Dark Side of Open Source
At Node Congress, Socket CEO Feross Aboukhadijeh uncovers the darker aspects of open source, where applications that rely heavily on third-party dependencies can be exploited in supply chain attacks.
react-native-iphone-x-helper
Advanced tools
Readme
A library to help you design your react-native app for notched iPhones.
npm i react-native-iphone-x-helper --save
this method it for creating stylesheets with the iPhone X in mind
iphoneXStyle - the style to apply if you're on iPhone X
regularStyle (optional) - the style to apply if you're not on iPhone X
// in style.js
import { StyleSheet } from 'react-native';
import { ifIphoneX } from 'react-native-iphone-x-helper'
export default StyleSheet.create({
header:{
position: 'absolute',
top: 0,
left: 0,
right: 0,
padding:10,
height: 60,
backgroundColor: 'transparent',
...ifIphoneX({
paddingTop: 50
}, {
paddingTop: 20
})
},
});
returns - true
if you running on an iPhone X.
import { isIphoneX } from 'react-native-iphone-x-helper'
// ...
if (isIphoneX()) {
// do this...
} else {
// do that...
}
safe - whether you want for get safe area height or not
returns - the height of the status bar: 44
for safe iPhoneX, 30
for unsafe iPhoneX, 20
for other iOS devices and StatusBar.currentHeight
for Android.
// in style.js
import { StyleSheet } from 'react-native';
import { getStatusBarHeight } from 'react-native-iphone-x-helper'
export default StyleSheet.create({
header:{
position: 'absolute',
top: 0,
left: 0,
right: 0,
padding:10,
height: 60,
backgroundColor: 'transparent',
paddingTop: getStatusBarHeight()
},
});
NOTE: If your using the the unsafe statusbar height, make sure to add 14dp of padding to your content, otherwise it's going to be flush against the notch
returns - the height of the bottom to fit the safe area: 34
for iPhone X and 0
for other devices.
// in style.js
import { StyleSheet } from 'react-native';
import { getBottomSpace } from 'react-native-iphone-x-helper'
export default StyleSheet.create({
totalview: {
flex: 1,
backgroundColor: 'transparent',
marginBottom: getBottomSpace()
},
});
MIT
FAQs
A library to help you design your react-native app for the iPhone X
The npm package react-native-iphone-x-helper receives a total of 368,218 weekly downloads. As such, react-native-iphone-x-helper popularity was classified as popular.
We found that react-native-iphone-x-helper demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
At Node Congress, Socket CEO Feross Aboukhadijeh uncovers the darker aspects of open source, where applications that rely heavily on third-party dependencies can be exploited in supply chain attacks.
Research
Security News
The Socket Research team found this npm package includes code for collecting sensitive developer information, including your operating system username, Git username, and Git email.
Security News
OpenJS is warning of social engineering takeovers targeting open source projects after receiving a credible attempt on the foundation.