Phecda / NGPlay

Go to a project
Toggle navigation Toggle navigation pinning
Phecda
9114e0e8 1 parent 557b3ee6

feat: add RNCode and RNImageCropPicker/RNSVG

Expand all
Inline Side-by-side
Showing 10 changed files with 117 additions and 1 deletions
... ... @@ -137,6 +137,7 @@ android {
versionName "1.0"
missingDimensionStrategy 'react-native-camera', 'general'
multiDexEnabled true
vectorDrawables.useSupportLibrary true
}
splits {
abi {
... ...
... ... @@ -30,7 +30,7 @@ allprojects {
// Android JSC is installed from npm
url("$rootDir/../node_modules/jsc-android/dist")
}
maven { url 'https://maven.google.com' }
google()
jcenter()
maven { url 'https://www.jitpack.io' }
... ...
... ... @@ -427,6 +427,7 @@
);
inputPaths = (
"${PODS_ROOT}/Target Support Files/Pods-NGPlay-NGPlayTests/Pods-NGPlay-NGPlayTests-resources.sh",
"${PODS_CONFIGURATION_BUILD_DIR}/RNImageCropPicker/QBImagePicker.bundle",
"${PODS_ROOT}/../../node_modules/react-native-vector-icons/Fonts/AntDesign.ttf",
"${PODS_ROOT}/../../node_modules/react-native-vector-icons/Fonts/Entypo.ttf",
"${PODS_ROOT}/../../node_modules/react-native-vector-icons/Fonts/EvilIcons.ttf",
... ... @@ -443,9 +444,11 @@
"${PODS_ROOT}/../../node_modules/react-native-vector-icons/Fonts/Octicons.ttf",
"${PODS_ROOT}/../../node_modules/react-native-vector-icons/Fonts/SimpleLineIcons.ttf",
"${PODS_ROOT}/../../node_modules/react-native-vector-icons/Fonts/Zocial.ttf",
"${PODS_ROOT}/RSKImageCropper/RSKImageCropper/RSKImageCropperStrings.bundle",
);
name = "[CP] Copy Pods Resources";
outputPaths = (
"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/QBImagePicker.bundle",
"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/AntDesign.ttf",
"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/Entypo.ttf",
"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/EvilIcons.ttf",
... ... @@ -462,6 +465,7 @@
"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/Octicons.ttf",
"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/SimpleLineIcons.ttf",
"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/Zocial.ttf",
"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/RSKImageCropperStrings.bundle",
);
runOnlyForDeploymentPostprocessing = 0;
shellPath = /bin/sh;
... ... @@ -541,6 +545,7 @@
);
inputPaths = (
"${PODS_ROOT}/Target Support Files/Pods-NGPlay/Pods-NGPlay-resources.sh",
"${PODS_CONFIGURATION_BUILD_DIR}/RNImageCropPicker/QBImagePicker.bundle",
"${PODS_ROOT}/../../node_modules/react-native-vector-icons/Fonts/AntDesign.ttf",
"${PODS_ROOT}/../../node_modules/react-native-vector-icons/Fonts/Entypo.ttf",
"${PODS_ROOT}/../../node_modules/react-native-vector-icons/Fonts/EvilIcons.ttf",
... ... @@ -557,9 +562,11 @@
"${PODS_ROOT}/../../node_modules/react-native-vector-icons/Fonts/Octicons.ttf",
"${PODS_ROOT}/../../node_modules/react-native-vector-icons/Fonts/SimpleLineIcons.ttf",
"${PODS_ROOT}/../../node_modules/react-native-vector-icons/Fonts/Zocial.ttf",
"${PODS_ROOT}/RSKImageCropper/RSKImageCropper/RSKImageCropperStrings.bundle",
);
name = "[CP] Copy Pods Resources";
outputPaths = (
"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/QBImagePicker.bundle",
"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/AntDesign.ttf",
"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/Entypo.ttf",
"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/EvilIcons.ttf",
... ... @@ -576,6 +583,7 @@
"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/Octicons.ttf",
"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/SimpleLineIcons.ttf",
"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/Zocial.ttf",
"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/RSKImageCropperStrings.bundle",
);
runOnlyForDeploymentPostprocessing = 0;
shellPath = /bin/sh;
... ...
... ... @@ -247,6 +247,8 @@ PODS:
- React
- react-native-camera/RN (3.23.1):
- React
- react-native-code (1.0.0-0):
- React
- react-native-netinfo (5.7.1):
- React
- react-native-safe-area-context (0.7.3):
... ... @@ -322,6 +324,15 @@ PODS:
- React
- RNGestureHandler (1.6.1):
- React
- RNImageCropPicker (0.28.0):
- React-Core
- React-RCTImage
- RNImageCropPicker/QBImagePickerController (= 0.28.0)
- RSKImageCropper
- RNImageCropPicker/QBImagePickerController (0.28.0):
- React-Core
- React-RCTImage
- RSKImageCropper
- RNLocalize (1.4.0):
- React
- RNPermissions (2.1.2):
... ... @@ -330,8 +341,11 @@ PODS:
- React
- RNScreens (2.4.0):
- React
- RNSVG (12.1.0):
- React
- RNVectorIcons (6.6.0):
- React
- RSKImageCropper (2.2.3)
- Yoga (1.14.0)
- YogaKit (1.18.1):
- Yoga (~> 1.14)
... ... @@ -362,6 +376,7 @@ DEPENDENCIES:
- React-jsiexecutor (from `../node_modules/react-native/ReactCommon/jsiexecutor`)
- React-jsinspector (from `../node_modules/react-native/ReactCommon/jsinspector`)
- react-native-camera (from `../node_modules/react-native-camera`)
- "react-native-code (from `../node_modules/@phecdas/react-native-code`)"
- "react-native-netinfo (from `../node_modules/@react-native-community/netinfo`)"
- react-native-safe-area-context (from `../node_modules/react-native-safe-area-context`)
- react-native-webview (from `../node_modules/react-native-webview`)
... ... @@ -381,10 +396,12 @@ DEPENDENCIES:
- "RNCMaskedView (from `../node_modules/@react-native-community/masked-view`)"
- RNDeviceInfo (from `../node_modules/react-native-device-info`)
- RNGestureHandler (from `../node_modules/react-native-gesture-handler`)
- RNImageCropPicker (from `../node_modules/react-native-image-crop-picker`)
- RNLocalize (from `../node_modules/react-native-localize`)
- RNPermissions (from `../node_modules/react-native-permissions`)
- RNReanimated (from `../node_modules/react-native-reanimated`)
- RNScreens (from `../node_modules/react-native-screens`)
- RNSVG (from `../node_modules/react-native-svg`)
- RNVectorIcons (from `../node_modules/react-native-vector-icons`)
- Yoga (from `../node_modules/react-native/ReactCommon/yoga`)
... ... @@ -401,6 +418,7 @@ SPEC REPOS:
- Flipper-RSocket
- FlipperKit
- OpenSSL-Universal
- RSKImageCropper
- YogaKit
EXTERNAL SOURCES:
... ... @@ -440,6 +458,8 @@ EXTERNAL SOURCES:
:path: "../node_modules/react-native/ReactCommon/jsinspector"
react-native-camera:
:path: "../node_modules/react-native-camera"
react-native-code:
:path: "../node_modules/@phecdas/react-native-code"
react-native-netinfo:
:path: "../node_modules/@react-native-community/netinfo"
react-native-safe-area-context:
... ... @@ -476,6 +496,8 @@ EXTERNAL SOURCES:
:path: "../node_modules/react-native-device-info"
RNGestureHandler:
:path: "../node_modules/react-native-gesture-handler"
RNImageCropPicker:
:path: "../node_modules/react-native-image-crop-picker"
RNLocalize:
:path: "../node_modules/react-native-localize"
RNPermissions:
... ... @@ -484,6 +506,8 @@ EXTERNAL SOURCES:
:path: "../node_modules/react-native-reanimated"
RNScreens:
:path: "../node_modules/react-native-screens"
RNSVG:
:path: "../node_modules/react-native-svg"
RNVectorIcons:
:path: "../node_modules/react-native-vector-icons"
Yoga:
... ... @@ -519,6 +543,7 @@ SPEC CHECKSUMS:
React-jsiexecutor: e9698dee4fd43ceb44832baf15d5745f455b0157
React-jsinspector: f74a62727e5604119abd4a1eda52c0a12144bcd5
react-native-camera: 1b52abea404d04e040edb3e74b7c5523c01a3089
react-native-code: 8a278a6a05c9f039be48c01957f6902027bd5180
react-native-netinfo: 4fa023c153d582aeae8435df95c9a975c5986449
react-native-safe-area-context: e200d4433aba6b7e60b52da5f37af11f7a0b0392
react-native-webview: 0633fd7861a9bd7a80bacaee7da763c3afc248fa
... ... @@ -537,11 +562,14 @@ SPEC CHECKSUMS:
RNCMaskedView: 76c40a1d41c3e2535df09246a2b5487f04de0814
RNDeviceInfo: 6a3d16fce033f6979c4a6a41e62244d183e8c765
RNGestureHandler: 8f09cd560f8d533eb36da5a6c5a843af9f056b38
RNImageCropPicker: cf129d17e042ce3e96fb9ada967c28f21f977c82
RNLocalize: b6df30cc25ae736d37874f9bce13351db2f56796
RNPermissions: a96580116f7894146552e92b000ac30bf1661947
RNReanimated: 4e102df74a9674fa943e05f97f3362b6e44d0b48
RNScreens: b5c0e1b2b04512919e78bd3898e144a157ce2363
RNSVG: ce9d996113475209013317e48b05c21ee988d42e
RNVectorIcons: 0bb4def82230be1333ddaeee9fcba45f0b288ed4
RSKImageCropper: a446db0e8444a036b34f3c43db01b2373baa4b2a
Yoga: 50fb6eb13d2152e7363293ff603385db380815b1
YogaKit: f782866e155069a2cca2517aafea43200b01fd5a
... ...
... ... @@ -14,6 +14,7 @@
"@huse/boolean": "^1.0.2",
"@huse/immer": "^1.0.2",
"@huse/previous-value": "^1.0.1",
"@phecdas/react-native-code": "^1.0.0-1",
"@react-native-community/art": "^1.2.0",
"@react-native-community/masked-view": "^0.1.7",
"@react-native-community/netinfo": "^5.7.1",
... ... @@ -30,12 +31,14 @@
"react-native-device-info": "^5.5.4",
"react-native-elements": "^1.2.7",
"react-native-gesture-handler": "^1.6.1",
"react-native-image-crop-picker": "^0.28.0",
"react-native-localize": "^1.4.0",
"react-native-permissions": "^2.1.2",
"react-native-progress": "^4.1.2",
"react-native-reanimated": "^1.7.1",
"react-native-safe-area-context": "^0.7.3",
"react-native-screens": "^2.4.0",
"react-native-svg": "^12.1.0",
"react-native-tab-view": "^2.13.0",
"react-native-vector-icons": "^6.6.0",
"react-native-webview": "9.1.1",
... ...
... ... @@ -22,6 +22,7 @@ import RNLocalize from './RNLocalize';
import { useI18nStrings } from '../i18n';
import CameraScreen from './CameraScreen';
import Library from './Library';
import ReadableCode from './ReadableCode';
const MainTab = createBottomTabNavigator<MainTabParamList>();
... ... @@ -123,6 +124,7 @@ const Container = () => {
/>
<MainStack.Screen name="RNLocalize" component={RNLocalize} />
<MainStack.Screen name="RNCamera" component={CameraScreen} />
<MainStack.Screen name="RNCode" component={ReadableCode} />
</MainStack.Navigator>
</NavigationContainer>
);
... ...
... ... @@ -35,6 +35,12 @@ const Library = ({ navigation }: MainTabScreenProps<'Library'>) => {
onPress={() => navigation.navigate('RNCamera')}
chevron
/>
<Divider />
<ListItem
title={'Readable Code'}
onPress={() => navigation.navigate('RNCode')}
chevron
/>
</BGScroll>
);
};
... ...
import React, { useState } from 'react';
import { QRCode, BarCode, readCodeFromUri } from '@phecdas/react-native-code';
import ImagePicker from 'react-native-image-crop-picker';
import { BGScroll, Card, ListItem } from '../component/View';
import { Input } from 'react-native-elements';
import { View, StyleSheet, Platform } from 'react-native';
const styles = StyleSheet.create({
codeWrapper: { alignItems: 'center', padding: 20 },
});
const ReadableCode = () => {
const [qrValue, setQRValue] = useState('A brave new world');
const [barValue, setBarValue] = useState('1234567890');
const [readResult, setResult] = useState('');
return (
<BGScroll>
<Card round>
<Input
defaultValue={qrValue}
onSubmitEditing={(e) => setQRValue(e.nativeEvent.text)}
placeholder="QR Code"
/>
{!!qrValue && (
<View style={styles.codeWrapper}>
<QRCode value={qrValue} size={200} />
</View>
)}
</Card>
<Card round>
<Input
defaultValue={barValue}
onSubmitEditing={(e) => setBarValue(e.nativeEvent.text)}
placeholder="Bar Code"
keyboardType="number-pad"
/>
{!!barValue && (
<View style={styles.codeWrapper}>
<BarCode value={barValue} width={200} height={100} />
</View>
)}
</Card>
<Card round>
<ListItem
title="Read from image..."
rightTitle={readResult}
onPress={async () => {
try {
const result = await ImagePicker.openPicker({
mediaType: 'photo',
});
const path = Array.isArray(result) ? result[0].path : result.path;
const value = await readCodeFromUri(
Platform.OS === 'ios' ? 'file://' : '' + path
);
setResult(value);
} catch (err) {
setResult('error: ' + err.message);
}
}}
/>
</Card>
</BGScroll>
);
};
export default ReadableCode;
... ...
... ... @@ -14,6 +14,7 @@ export type MainStackParamList = {
WebviewScreen: { uri: string } | undefined;
RNLocalize: undefined;
RNCamera: undefined;
RNCode: undefined;
};
export type MainTabScreenProps<RouteName extends keyof MainTabParamList> = {
... ...
This diff is collapsed. Click to expand it.