Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

React Native : Call method of RCTViewManager and Render a View

In React Native, It is possible to render a UIView of a RCTBridgeModule and also call method of this Module ? Below i post the module i have created with two method. but i don't know if its correct :

RCTAugmentPlayerManager.h

#import "RCTBridgeModule.h"

@interface RCTAugmentPlayerManager : NSObject <RCTBridgeModule>
@end

RCTAugmentPlayerManager.m

@implementation RCTAugmentPlayerManager

RCT_EXPORT_MODULE();

// Method which execute treatment 
RCT_EXPORT_METHOD(oneMethod:(NSString *)name )
{
  RCTLogInfo(@"Display name %@", name);
}

// Method which return a view to render in Javascript
RCT_EXPORT_METHOD(methodWithReturnView)
{
   UIView * view = [[UIView alloc] init];
   return view;
}
@end

AugmentPlayer.js

import { NativeModules } from 'react-native';
var RCTAugmentPlayerManager = NativeModules.RCTAugmentPlayerManager;

index.ios.js

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

class mobileApp extends Component {

    constructor(props){
        super(props);

        var augment = NativeModules.AugmentPlayer; 
        augment.oneMethod('test');
    }
  render() {

    return (

    <View style={{height:200, width:200}}>      
        {AugmentPlayer.methodWithReturnView}
    </View>
    );
  }
}    

AppRegistry.registerComponent('mobileApp', () => mobileApp);

Thank you

like image 497
Lionel Avatar asked Oct 27 '25 05:10

Lionel


1 Answers

TL;DR: No you can't.

To render a UIView you must subclass RCTViewManager and return your view in the view method:

@interface MyCoolViewManager: RCTViewManager
@end

@implementation MyCoolViewManager

RCT_EXPORT_MODULE()

-(UIView *)view {
   return [MyCoolView new];
}

@end

See the doc for more info, it's quite detailed in what you need to do:

http://facebook.github.io/react-native/docs/native-components-ios.html

like image 145
rogchap Avatar answered Oct 29 '25 20:10

rogchap