d4dpocket
v0.1.8
Published
Doraemon's 4D Pocket for React Native
Downloads
39
Maintainers
Readme
Installation
yarn add d4dpocket
Usage
// Example
import { isIphoneX } from 'd4dpocket';
scale
Use for padding, margin, size, fontSize, borderRadius, ....
padding: scale(10)
wScale
Use for width
width: wScale(100)
hScale
Use for height
height: hScale(100)
RFValue
Use for size, fontSize
fontSize: RFValue(16)
StylePlatforms
const styles = StyleSheet.create({
box: {
...StylePlatforms({
tablet: {
width: 20,
},
iPad: {
width: 25,
backgroundColor: 'grey',
},
iPhoneX: {
width: 18,
backgroundColor: 'grey',
},
base: {
width: 15,
},
}),
},
});
isIphone
if (isIphone()) {
console.log("isIphone");
}
hasIsland
Support iPhone 14 Pro & Pro Max. View more react-native-iphone-x-helper/pull/44
if (hasIsland()) {
console.log("hasIsland");
}
isIphoneX
if (isIphoneX()) {
console.log("isIphoneX");
}
isTablet
if (isTablet()) {
console.log("isTablet");
}
isNewerVersion
Compare software version
// isNewerVersion(oldVer, newVer)
isNewerVersion("1.0.1", "1.0.10"); // true
isUUID
isUUID("9b1deb4d-3b7d-4bad-9bdd-2b0d7b3dcb6d");
// true
toVnd
Format string to Vnd
toVnd("1000000"); // 1,000,000
limitedString
Default: limitedString(string, maxLength = 9)
limitedString("Lorem Ipsum is simply dummy text of the printing and typesetting industry");
// Lorem Ipsum is simply dummy text of the printing...
formatComma
Default: formatComma(string, toFixed = 2)
formatComma("100000");
// 100,000
removeAccent
Remove accent in vietnamese
removeAccent("chấm và hỏi");
// cham va hoi
Components
Button
Inherits TouchableOpacity
<Button>Button</Button>
KeyboardSpacer
Inherits react-native-keyboard-spacer
<KeyboardSpacer />
ScrollView
Inherits ScrollView
<ScrollView>{children}</ScrollView>
ImageAspectRatio
Inherits Image
<ImageAspectRatio
source={{ uri: 'https://exmaple.com/image.png' }}
style={{ width: 100, height: 100 }}
/>
init.sh
Create default folders and file in project
Reset default style Text
, TextInput
in root/index.js
# root
# /documents
# /src/actions/index.js
# /src/components/index.js
# /src/context/index.js
# /src/hooks/index.js
# /src/screens
# /AppNavigator.js
# /routes.js
# /src/icons/index.js
# /src/store/index.js
# /src/themes/index.js
# /colors.js
# /fontSize.js
# /src/utils/index.js
# .env
Run
bash node_modules/d4dpocket/src/scripts/init.sh
createChangeEnv.js
Generate file bash script change env
node node_modules/d4dpocket/src/scripts/createChangeEnv.js 'env' 'app_name' 'package_name'
Example
node node_modules/d4dpocket/src/scripts/createChangeEnv.js 'dev' 'ABC' 'com.abc.dev'
File change-[dev].sh
generated in root project
Run
bash change-dev.sh
checkInfoPlist.sh
Check file Info.plist
when release app on App Store
Run
bash node_modules/d4dpocket/src/scripts/checkInfoPlist.sh
# Do you used Camera? (y/n) y
# Do you used Photo Library? (y/n) y
# Do you used Location Always And When In Use? (y/n) y
# Results:
# +----+----------------------------------------------+
# | ❌ | NSAppleMusicUsageDescription
# |---------------------------------------------------|
# | ❌ | NSUserTrackingUsageDescription
# |---------------------------------------------------|
# | ❌ | NSCameraUsageDescription
# |---------------------------------------------------|
# | ❌ | NSPhotoLibraryUsageDescription
# |---------------------------------------------------|
# | ❌ | NSLocationAlwaysAndWhenInUseUsageDescription
# +----+----------------------------------------------+
usePaging
Generate file usePaging.js
in src/hooks
Run
bash node_modules/d4dpocket/src/scripts/usePaging.sh
Running the example app
- Run
yarn
in repo root - Run
yarn example android
oryarn example ios
- Run
yarn example start
to start Metro Bundler
Contributing
See the contributing guide to learn how to contribute to the repository and the development workflow.