相册识别二维码功能
This commit is contained in:
parent
5f6eb3b560
commit
b247ef32a4
|
|
@ -79,7 +79,7 @@ android {
|
|||
all*.exclude group: 'com.amap.api', module: 'location'
|
||||
}
|
||||
defaultConfig {
|
||||
missingDimensionStrategy 'react-native-camera', 'general'
|
||||
missingDimensionStrategy 'react-native-camera', 'general'
|
||||
applicationId "com.bikeapp_demo"
|
||||
minSdkVersion rootProject.ext.minSdkVersion
|
||||
targetSdkVersion rootProject.ext.targetSdkVersion
|
||||
|
|
@ -87,12 +87,6 @@ android {
|
|||
versionName "1.0"
|
||||
}
|
||||
signingConfigs {
|
||||
release {
|
||||
storeFile file('my-release-key.jks')
|
||||
storePassword 'jq888786' // 替换为你的密钥库密码
|
||||
keyAlias 'my-key-alias' // 替换为你的密钥别名
|
||||
keyPassword 'jq888786' // 替换为你的密钥密码
|
||||
}
|
||||
debug {
|
||||
storeFile file('debug.keystore')
|
||||
storePassword 'android'
|
||||
|
|
@ -107,7 +101,7 @@ android {
|
|||
release {
|
||||
// Caution! In production, you need to generate your own keystore file.
|
||||
// see https://reactnative.dev/docs/signed-apk-android.
|
||||
signingConfig signingConfigs.release
|
||||
signingConfig signingConfigs.debug
|
||||
minifyEnabled enableProguardInReleaseBuilds
|
||||
proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
|
||||
}
|
||||
|
|
@ -118,10 +112,10 @@ dependencies {
|
|||
// The version of react-native is set by the React Native Gradle Plugin
|
||||
|
||||
implementation("com.facebook.react:react-android")
|
||||
implementation "com.google.android.gms:play-services-vision:20.1.3"
|
||||
implementation "com.google.android.gms:play-services-vision:20.1.3"
|
||||
implementation "com.google.android.gms:play-services-vision-common:19.1.3"
|
||||
implementation project(':react-native-camera')
|
||||
implementation 'com.amap.api:3dmap:latest.integration'
|
||||
implementation 'com.amap.api:3dmap:latest.integration'
|
||||
implementation 'com.amap.api:location:latest.integration'
|
||||
if (hermesEnabled.toBoolean()) {
|
||||
implementation("com.facebook.react:hermes-android")
|
||||
|
|
|
|||
17377
package-lock.json
generated
Normal file
17377
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
|
|
@ -47,6 +47,7 @@
|
|||
"react-native-view-shot": "^4.0.0",
|
||||
"react-native-wheel-picker-android": "^2.0.6",
|
||||
"rn-fetch-blob": "^0.12.0",
|
||||
"rn-qr-generator": "^1.4.3",
|
||||
"utf8": "^3.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
|
|
|
|||
|
|
@ -18,17 +18,8 @@ import { RNCamera } from 'react-native-camera';
|
|||
import { TopNavigation, TopNavigationAction, Icon, Popover, Button } from '@ui-kitten/components';
|
||||
import Toast from 'react-native-toast-message';
|
||||
import { launchImageLibrary } from 'react-native-image-picker';
|
||||
|
||||
// 假设你有一个函数 checkIfImageContainsQRCode 和 decodeQRCodeFromImage
|
||||
const checkIfImageContainsQRCode = async (imageUri: string): Promise<boolean> => {
|
||||
// 实现判断图片是否包含二维码的逻辑
|
||||
return true; // 示例返回值
|
||||
};
|
||||
|
||||
const decodeQRCodeFromImage = async (imageUri: string): Promise<string> => {
|
||||
// 实现二维码解析的逻辑
|
||||
return 'example_sn=123456'; // 示例返回值
|
||||
};
|
||||
import QRReader from 'rn-qr-generator';
|
||||
import { apiService } from '../../utils/api';
|
||||
|
||||
type RootStackParamList = {
|
||||
Home: undefined;
|
||||
|
|
@ -46,10 +37,6 @@ const BackIcon = (props: any) => (
|
|||
<Icon {...props} name='arrow-back-outline'/>
|
||||
);
|
||||
|
||||
const MoreIcon = (props: any) => (
|
||||
<Icon {...props} name='more-vertical'/>
|
||||
);
|
||||
|
||||
const SnBind = () => {
|
||||
const navigation = useNavigation<NavigationProp>();
|
||||
const [sn, setSn] = useState('');
|
||||
|
|
@ -68,6 +55,52 @@ const SnBind = () => {
|
|||
setPopoverVisible(!popoverVisible);
|
||||
};
|
||||
|
||||
// 处理 keyId 的方法
|
||||
const handleKeyId = async (keyId: string) => {
|
||||
const res = await apiService.getUserInfo();
|
||||
|
||||
console.log('处理 keyId:', keyId);
|
||||
// TODO: 在这里添加处理 keyId 的逻辑
|
||||
};
|
||||
|
||||
// 处理扫描结果的方法
|
||||
const handleScanResult = (data: string) => {
|
||||
console.log('扫描结果:', data);
|
||||
try {
|
||||
// 检查是否包含 sn
|
||||
const snMatch = data.match(/[?&]sn=([^&]+)/);
|
||||
if (snMatch && snMatch[1]) {
|
||||
setSn(snMatch[1]);
|
||||
setIsScanning(false);
|
||||
Toast.show({
|
||||
type: 'success',
|
||||
text1: '扫描成功',
|
||||
});
|
||||
// 自动触发确认绑定
|
||||
navigation.navigate('ConfirmBind', { sn: snMatch[1].trim() });
|
||||
return;
|
||||
}
|
||||
|
||||
// 检查是否包含 keyId
|
||||
const keyIdMatch = data.match(/[?&]keyId=([^&]+)/);
|
||||
if (keyIdMatch && keyIdMatch[1]) {
|
||||
setIsScanning(false);
|
||||
handleKeyId(keyIdMatch[1]);
|
||||
return;
|
||||
}
|
||||
|
||||
Toast.show({
|
||||
type: 'error',
|
||||
text1: '未找到有效的识别码',
|
||||
});
|
||||
} catch (error) {
|
||||
Toast.show({
|
||||
type: 'error',
|
||||
text1: '二维码解析失败',
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
const handlePress = () => {
|
||||
if (!sn.trim()) {
|
||||
Toast.show({
|
||||
|
|
@ -81,83 +114,45 @@ const SnBind = () => {
|
|||
|
||||
const handleImagePicker = () => {
|
||||
setPopoverVisible(false);
|
||||
launchImageLibrary({ mediaType: 'photo' }, (response) => {
|
||||
launchImageLibrary({
|
||||
mediaType: 'photo',
|
||||
quality: 1,
|
||||
}, async (response) => {
|
||||
if (response.didCancel) {
|
||||
console.log('User cancelled image picker');
|
||||
} else if (response.errorCode) {
|
||||
console.log('ImagePicker Error: ', response.errorMessage);
|
||||
} else if (response.assets && response.assets.length > 0) {
|
||||
const imageUri = response.assets[0].uri;
|
||||
// 判断图片是否包含二维码
|
||||
checkIfImageContainsQRCode(imageUri)
|
||||
.then((containsQRCode) => {
|
||||
if (!containsQRCode) {
|
||||
Toast.show({
|
||||
type: 'error',
|
||||
text1: '图片不包含二维码',
|
||||
});
|
||||
return;
|
||||
}
|
||||
// 使用二维码解析库解析图片
|
||||
decodeQRCodeFromImage(imageUri)
|
||||
.then((data) => {
|
||||
console.log('二维码内容:', data);
|
||||
// 处理解析结果
|
||||
const snMatch = data.match(/[?&]sn=([^&]+)/);
|
||||
if (snMatch && snMatch[1]) {
|
||||
setSn(snMatch[1]);
|
||||
Toast.show({
|
||||
type: 'success',
|
||||
text1: '图片解析成功',
|
||||
});
|
||||
} else {
|
||||
Toast.show({
|
||||
type: 'error',
|
||||
text1: '未找到有效的SN码',
|
||||
});
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
Toast.show({
|
||||
type: 'error',
|
||||
text1: '图片解析失败或不包含二维码',
|
||||
});
|
||||
});
|
||||
})
|
||||
.catch((error) => {
|
||||
try {
|
||||
const { uri } = response.assets[0];
|
||||
|
||||
// 使用 QRReader 识别图片中的二维码
|
||||
const result = await QRReader.detect({
|
||||
uri: uri
|
||||
});
|
||||
|
||||
if (result.values && result.values.length > 0) {
|
||||
const qrData = result.values[0];
|
||||
handleScanResult(qrData);
|
||||
} else {
|
||||
Toast.show({
|
||||
type: 'error',
|
||||
text1: '无法判断图片内容',
|
||||
text1: '图片中未检测到二维码',
|
||||
});
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('扫描错误:', error);
|
||||
Toast.show({
|
||||
type: 'error',
|
||||
text1: '图片解析失败',
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const onSuccess = (e: { data: string }) => {
|
||||
console.log('扫描结果:', e.data);
|
||||
// 提取sn参数值
|
||||
try {
|
||||
const snMatch = e.data.match(/[?&]sn=([^&]+)/);
|
||||
if (snMatch && snMatch[1]) {
|
||||
setSn(snMatch[1]);
|
||||
setIsScanning(false);
|
||||
Toast.show({
|
||||
type: 'success',
|
||||
text1: '扫描成功',
|
||||
});
|
||||
} else {
|
||||
Toast.show({
|
||||
type: 'error',
|
||||
text1: '未找到有效的SN码',
|
||||
});
|
||||
}
|
||||
} catch (error) {
|
||||
Toast.show({
|
||||
type: 'error',
|
||||
text1: '二维码解析失败',
|
||||
});
|
||||
}
|
||||
handleScanResult(e.data);
|
||||
};
|
||||
|
||||
return (
|
||||
|
|
@ -385,7 +380,6 @@ const styles = StyleSheet.create({
|
|||
color: '#ffffff',
|
||||
fontSize: rpx(36),
|
||||
},
|
||||
// 扫码相关样式
|
||||
modalContainer: {
|
||||
flex: 1,
|
||||
backgroundColor: '#000',
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user