"dependencies": {
"react": "18.2.0",
"react-native": "0.71.4",
"react-native-vision-camera": "^2.15.4",
"react-native-wifi-p2p": "^3.4.1"
},
"devDependencies": {
"@babel/core": "^7.20.0",
"@babel/preset-env": "^7.20.0",
"@babel/runtime": "^7.20.0",
"@react-native-community/eslint-config": "^3.2.0",
"@tsconfig/react-native": "^2.0.2",
"@types/jest": "^29.2.1",
"@types/react": "^18.0.24",
"@types/react-test-renderer": "^18.0.0",
"babel-jest": "^29.2.1",
"eslint": "^8.19.0",
"jest": "^29.2.1",
"metro-react-native-babel-preset": "0.73.8",
"prettier": "^2.4.1",
"react-test-renderer": "18.2.0",
"typescript": "4.8.4"
},
"jest": {
"preset": "react-native"
}
}
我一直在寻找各种图书馆并尝试使用您制作的东西。我正在尝试创建两个功能。
e.g) 安卓手机 + 带摄像头的扫地机器人 ㄴ安卓手机可以看到扫地机器人拍摄的视频,可以控制扫地机器人的移动方向
Q1.我想知道一个可以实现以上功能的库 Q2.Kotlin可以实现上面的功能吗?
import React, {PureComponent} from 'react';
import {StyleSheet, View, Button} from 'react-native';
import {
initialize,
startDiscoveringPeers,
stopDiscoveringPeers,
subscribeOnConnectionInfoUpdates,
subscribeOnThisDeviceChanged,
subscribeOnPeersUpdates,
connect,
cancelConnect,
createGroup,
removeGroup,
getAvailablePeers,
sendFile,
receiveFile,
getConnectionInfo,
getGroupInfo,
receiveMessage,
sendMessageTo,
} from 'react-native-wifi-p2p';
import {PermissionsAndroid} from 'react-native';
import Camera from 'react-natve-vision-camera'
type Props = {};
export default class App extends PureComponent<Props> {
peersUpdatesSubscription;
connectionInfoUpdatesSubscription;
thisDeviceChangedSubscription;
state = {
devices: [],
};
async componentDidMount() {
try {
await initialize();
// since it's required in Android >= 6.0
await Camera.getCameraPermissionStatus()
await Camera.getMicrophonePermissionStatus()
const granted = await PermissionsAndroid.request(
PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION,
{
title: 'Access to wi-fi P2P mode',
message: 'ACCESS_FINE_LOCATION',
buttonPositive: 'Okay',
},
);
const granted2 = await PermissionsAndroid.request(
PermissionsAndroid.PERMISSIONS.NEARBY_WIFI_DEVICES,
{
title: 'Access to wi-fi P2P mode',
message: 'NEARBY_WIFI_DEVICES',
buttonPositive: 'Okay',
},
);
console.log(
granted === PermissionsAndroid.RESULTS.GRANTED
? 'You can use the p2p mode'
: 'Permission denied: p2p mode will not work',
);
this.peersUpdatesSubscription = subscribeOnPeersUpdates(
this.handleNewPeers,
);
this.connectionInfoUpdatesSubscription = subscribeOnConnectionInfoUpdates(
this.handleNewInfo,
);
this.thisDeviceChangedSubscription = subscribeOnThisDeviceChanged(
this.handleThisDeviceChanged,
);
const status = await startDiscoveringPeers();
console.log('startDiscoveringPeers status: ', status);
} catch (e) {
console.error(e);
}
}
componentWillUnmount() {
this.peersUpdatesSubscription?.remove();
this.connectionInfoUpdatesSubscription?.remove();
this.thisDeviceChangedSubscription?.remove();
}
handleNewInfo = info => {
console.log('OnConnectionInfoUpdated', info);
};
handleNewPeers = ({devices}) => {
console.log('OnPeersUpdated', devices);
this.setState({devices: devices});
};
handleThisDeviceChanged = groupInfo => {
console.log('THIS_DEVICE_CHANGED_ACTION', groupInfo);
};
connectToFirstDevice = () => {
console.log('Connect to: ', this.state.devices[0]);
connect(this.state.devices[0].deviceAddress)
.then(() => console.log('Successfully connected'))
.catch(err => console.error('Something gone wrong. Details: ', err));
};
onCancelConnect = () => {
cancelConnect()
.then(() =>
console.log('cancelConnect', 'Connection successfully canceled'),
)
.catch(err =>
console.error('cancelConnect', 'Something gone wrong. Details: ', err),
);
};
onCreateGroup = () => {
createGroup()
.then(() => console.log('Group created successfully!'))
.catch(err => console.error('Something gone wrong. Details: ', err));
};
onRemoveGroup = () => {
removeGroup()
.then(() => console.log("Currently you don't belong to group!"))
.catch(err => console.error('Something gone wrong. Details: ', err));
};
onStopInvestigation = () => {
stopDiscoveringPeers()
.then(() => console.log('Stopping of discovering was successful'))
.catch(err =>
console.error(
`Something is gone wrong. Maybe your WiFi is disabled? Error details`,
err,
),
);
};
onStartInvestigate = () => {
startDiscoveringPeers()
.then(status =>
console.log(
'startDiscoveringPeers',
`Status of discovering peers: ${status}`,
),
)
.catch(err =>
console.error(
`Something is gone wrong. Maybe your WiFi is disabled? Error details: ${err}`,
),
);
};
onGetAvailableDevices = () => {
getAvailablePeers().then(peers => console.log(peers));
};
onSendFile = () => {
//const url = '/storage/sdcard0/Music/Rammstein:Amerika.mp3';
const url =
'/storage/emulated/0/Music/Bullet For My Valentine:Letting You Go.mp3';
PermissionsAndroid.request(
PermissionsAndroid.PERMISSIONS.READ_EXTERNAL_STORAGE,
{
title: 'Access to read',
message: 'READ_EXTERNAL_STORAGE',
buttonPositive: 'Okay',
},
)
.then(granted => {
if (granted === PermissionsAndroid.RESULTS.GRANTED) {
console.log('You can use the storage');
} else {
console.log('Storage permission denied');
}
})
.then(() => {
return PermissionsAndroid.request(
PermissionsAndroid.PERMISSIONS.WRITE_EXTERNAL_STORAGE,
{
title: 'Access to write',
message: 'WRITE_EXTERNAL_STORAGE',
buttonPositive: 'Okay',
},
);
})
.then(() => {
return sendFile(url)
.then(metaInfo => console.log('File sent successfully', metaInfo))
.catch(err => console.log('Error while file sending', err));
})
.catch(err => console.log(err));
};
onReceiveFile = () => {
PermissionsAndroid.request(
PermissionsAndroid.PERMISSIONS.READ_EXTERNAL_STORAGE,
{
title: 'Access to read',
message: 'READ_EXTERNAL_STORAGE',
buttonPositive: 'Okay',
},
)
.then(granted => {
if (granted === PermissionsAndroid.RESULTS.GRANTED) {
console.log('You can use the storage');
} else {
console.log('Storage permission denied');
}
})
.then(() => {
return PermissionsAndroid.request(
PermissionsAndroid.PERMISSIONS.WRITE_EXTERNAL_STORAGE,
{
title: 'Access to write',
message: 'WRITE_EXTERNAL_STORAGE',
buttonPositive: 'Okay',
},
);
})
.then(() => {
return receiveFile(
'/storage/emulated/0/Music/',
'BFMV:Letting You Go.mp3',
)
.then(() => console.log('File received successfully'))
.catch(err => console.log('Error while file receiving', err));
})
.catch(err => console.log(err));
};
onSendMessageTo = () => {
sendMessageTo('Hello world!', 'aa:79:8d:42:01:c0').then(msg =>
console.log('Message sent successfully', msg),
);
};
onReceiveMessage = () => {
receiveMessage()
.then(msg => console.log('Message received successfully', msg))
.catch(err => console.log('Error while message receiving', err));
};
onGetConnectionInfo = () => {
getConnectionInfo().then(info => console.log('getConnectionInfo', info));
};
onGetGroupInfo = () => {
getGroupInfo().then(info => console.log('getGroupInfo', info));
};
render() {
const {devices} = this.state;
return (
<View style={styles.container}>
{devices.map(device => (
<Button
key={device.deviceAddress}
title={device.deviceName}
onPress={this.connectToFirstDevice}
/>
))}
<Button title="Connect" onPress={this.connectToFirstDevice} />
<Button title="Cancel connect" onPress={this.onCancelConnect} />
<Button title="Create group" onPress={this.onCreateGroup} />
<Button title="Remove group" onPress={this.onRemoveGroup} />
<Button title="Investigate" onPress={this.onStartInvestigate} />
<Button
title="Prevent Investigation"
onPress={this.onStopInvestigation}
/>
<Button
title="Get Available Devices"
onPress={this.onGetAvailableDevices}
/>
<Button
title="Get connection Info"
onPress={this.onGetConnectionInfo}
/>
<Button title="Get group info" onPress={this.onGetGroupInfo} />
<Button title="Send file" onPress={this.onSendFile} />
<Button title="Receive file" onPress={this.onReceiveFile} />
<Button title="Send message" onPress={this.onSendMessageTo} />
<Button title="Receive message" onPress={this.onReceiveMessage} />
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
welcome: {
fontSize: 20,
textAlign: 'center',
margin: 10,
},
instructions: {
textAlign: 'center',
color: '#333333',
marginBottom: 5,
},
});