I have a iOS Native View which is a UIView with a map view and a UIView. The map has a event called 'regionDidChangeAnimated', I want to send event to the React Native. But the reactTag is not right.
- (UIView *)view
{
CGRect screenRect = [[UIScreen mainScreen] bounds];
UIView *frameView = [[UIView alloc] initWithFrame:screenRect];
CGRect frameRect = frameView.bounds;
MAMapView *mapView;
mapView = [[MAMapView alloc] initWithFrame:frameRect];
self.mapview = mapView;
mapView.delegate = self;
[frameView addSubview:mapView];
RCTFixedPin* pin = [[RCTFixedPin alloc] initWithFrame:CGRectMake(0, 0, screenRect.size.width, 260)];
pin.userInteractionEnabled = NO;
[frameView addSubview:pin];
return frameView;
}
- (void)mapView:(MAMapView *)mapView regionDidChangeAnimated:(BOOL)animated {
if (self.dragging) {
self.dragging = NO;
}
MACoordinateRegion region = mapView.region;
NSDictionary *event = @{
***@"target": ,***
@"region": @{
@"latitude": @(region.center.latitude),
@"longitude": @(region.center.longitude),
@"latitudeDelta": @(region.span.latitudeDelta),
@"longitudeDelta": @(region.span.longitudeDelta),
}
};
[self.bridge.eventDispatcher sendInputEventWithName:@"topChange" body:event];
}
If you look in the react-native code for the native views they have implemented:
https://github.com/facebook/react-native/tree/master/React/Views
it looks like the documentation is out of date and rather than using:
[self.bridge.eventDispatcher sendInputEventWithName...
You should be doing the following:
@property (nonatomic, copy) RCTBubblingEventBlock onTopChange;
self.onTopChange(@{
@"region": @{
@"latitude": @(region.center.latitude),
@"longitude": @(region.center.longitude),
@"latitudeDelta": @(region.span.latitudeDelta),
@"longitudeDelta": @(region.span.longitudeDelta),
}
};
There's also a RCTDirectEventBlock
I'm not sure what the difference is between that and RCTBubblingEventBlock
Looking in RCTComponent.m
lines 160-169 it should handle the target setting for you automatically:
// Special case for event handlers
__weak RCTViewManager *weakManager = _manager;
setterBlock = ^(id target, __unused id source, id json) {
__weak id<RCTComponent> weakTarget = target;
((void (*)(id, SEL, id))objc_msgSend)(target, setter, [RCTConvert BOOL:json] ? ^(NSDictionary *body) {
body = [NSMutableDictionary dictionaryWithDictionary:body];
((NSMutableDictionary *)body)[@"target"] = weakTarget.reactTag;
[weakManager.bridge.eventDispatcher sendInputEventWithName:RCTNormalizeInputEventName(name) body:body];
} : nil);
};
Also in the Manager class make sure you add:
RCT_EXPORT_VIEW_PROPERTY(onTopChange, RCTBubblingEventBlock)
And don't forget to actually wire up the event in your JSX:
<MyComponent onTopChange={this.handleOnTopChange}/>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With