I'm trying to pass an event from my module to react native. I followed these steps Here but it didn't work as expected.I don't receive errors but it simply doesn't work.
Here is my code in Android Studio inside my module:
package com.coinboxcollector;import android.util.Log;import androidx.annotation.NonNull;import com.facebook.react.bridge.Promise;import com.facebook.react.bridge.ReactApplicationContext;import com.facebook.react.bridge.ReactContext;import com.facebook.react.bridge.ReactContextBaseJavaModule;import com.facebook.react.bridge.ReactMethod;import com.facebook.react.module.annotations.ReactModule;import com.facebook.react.modules.core.DeviceEventManagerModule;@ReactModule(name = CoinboxCollectorModule.NAME)public class CoinboxCollectorModule extends ReactContextBaseJavaModule { public static final String NAME = "CoinboxCollector"; public CoinboxCollectorModule(ReactApplicationContext reactContext) { super(reactContext); } @NonNull @Override public String getName() { return "CoinBoxCollector"; } private static String port="/dev/tty.usbserial-fa14"; public MyCCT cct; public CoinObserver coinObserver = new CoinObserver() { private ReactContext reactContext; @Override public void update(MyCCT cct, float coin) { Log.d("Coin", Float.toString(coin)); try { this.reactContext .getJSModule(DeviceEventManagerModule.RCTDeviceEventEmitter.class) .emit("onReceivedCoin", coin); }catch (Exception ex){ } } }; @ReactMethod public void initialize(Promise promise) { try{ Log.d("stato", "inizializzazione "); if(cct == null){ cct = new MyCCT(port, this.getReactApplicationContext()); } cct.addCoinObserver(coinObserver); cct.start(); promise.resolve(true); }catch (Exception err){ promise.resolve(false); } } @ReactMethod public void stop(Promise promise) { try{ cct.stop(); cct = null; promise.resolve(true); }catch (Exception err){ promise.resolve(false); } } @ReactMethod public void addListener(String eventName) { } @ReactMethod public void removeListeners(Integer count) { } @ReactMethod public void multiply(double a, double b, Promise promise) { promise.resolve(a * b); }}
My code in react native:
import {useNavigation} from '@react-navigation/native';import React, {useEffect, useRef, useState} from 'react';import { Alert, DeviceEventEmitter, NativeEventEmitter, NativeModules, Pressable, StyleSheet, Text, View,} from 'react-native';const {CoinBoxCollector} = NativeModules;export default function HomeScreen() { const [off, setOff] = useState(true); const navigation = useNavigation(); let coinInserted = 0; const coinValueStartExperience = 2; async function onCoinDetected(coin: any) { Alert.alert('ricevuti soldi', coin); console.log('ricevuti soldi'); } const pressInit = async () => { return await CoinBoxCollector.initialize(); }; const pressStop = async () => { return await CoinBoxCollector.stop(); }; useEffect(() => { const eventEmitter = new NativeEventEmitter(NativeModules.CoinBoxCollector); const eventListener = eventEmitter.addListener('onReceivedCoin', onCoinDetected, ); return eventListener.remove(); }, []); return (<View style={styles.container}><Pressable style={styles.btn} onPress={pressInit}><Text style={styles.btnText}>Initialize</Text></Pressable><Pressable style={styles.btn} onPress={pressStop}><Text style={styles.btnText}>Stop it</Text></Pressable></View> );}const styles = StyleSheet.create({ container: { flex: 1, justifyContent: 'center', alignContent: 'center', }, btn: { marginTop: 30, backgroundColor: '#841584', width: '5%', height: 30, marginLeft: '48%', }, btnText: { color: 'white', textAlign: 'center', },});
In general I'm trying to do all of that to take the coin from the event (coin which I insert in the coinbox) and put it in a future condition.Thank you all in advance for the help