如何在React Native的IOS扩展中添加事件监听器

时间:2018-07-23 10:44:22

标签: javascript ios react-native

我对IOS和React Native非常陌生。 我正在尝试从IOS广播上传扩展插件并遵循this link触发事件监听器。

我遇到Native module cannot be null错误。 下面是我的代码:

SampleHandler.h文件:

#import <React/RCTBridgeModule.h>
#import <React/RCTEventEmitter.h>
#import <ReplayKit/ReplayKit.h>

@interface SampleHandler : RPBroadcastSampleHandler

@end

SampleHandler.m文件:

#import <React/RCTLog.h>
#import "React/RCTEventEmitter.h"
#import "SampleHandler.h"

@implementation SampleHandler
RCT_EXPORT_MODULE();

- (NSArray<NSString *> *)supportedEvents
{
return @[@"EventVideo", @"EventAudio"];
}

- (void)broadcastStartedWithSetupInfo:(NSDictionary<NSString *,NSObject *> *)setupInfo {
    // User has requested to start the broadcast. Setup info from the UI extension can be supplied but optional. 
}

- (void)broadcastPaused {
    // User has requested to pause the broadcast. Samples will stop being delivered.
}

- (void)broadcastResumed {
    // User has requested to resume the broadcast. Samples delivery will resume.
}

- (void)broadcastFinished {
    // User has requested to finish the broadcast.
}

- (void)processSampleBuffer:(CMSampleBufferRef)sampleBuffer withType:(RPSampleBufferType)sampleBufferType {
    RCTEventEmitter *eventEmitter = [[RCTEventEmitter alloc]init];
    switch (sampleBufferType) {
        case RPSampleBufferTypeVideo:
            // Handle video sample buffer
            RCTLogInfo(@"Hello");
            [eventEmitter sendEventWithName:@"EventVideo" body:@{@"name": @"Hello"}];
            //printf(sampleBuffer);
            break;
        case RPSampleBufferTypeAudioApp:
            // Handle audio sample buffer for app audio
            break;
        case RPSampleBufferTypeAudioMic:
            // Handle audio sample buffer for mic audio
            break;

        default:
            break;
    }
}

@end

JS代码:

import React, {
    Component
} from 'react';
import {
    Text,
    View,
    AppRegistry,
    NativeEventEmitter,
    NativeModules
} from 'react-native';

const {
    SampleHandler
} = NativeModules;

const screencamptureEvent = new NativeEventEmitter(SampleHandler);

export default class App extends Component {

    constructor(props) {
        super(props);
        this.subscription = screencamptureEvent.addListener(
            'EventVideo',
            (reminder) => {
                console.log(reminder.name);
                alert(reminder.name);
            }
        );
    }

    componentWillUnmount() {
        this.subscription.remove();
    }

    render() {
        return (
            <View> 
                <Text>Test Application</Text>
            </View>
        );
    }
}


AppRegistry.registerComponent("TestApp", () => App);

0 个答案:

没有答案