Docs: ios-native-ui-guide RCTConvert categories edit
Summary: I was struggling a bit with the [iOS Native UI Components tutorial](https://facebook.github.io/react-native/docs/native-components-ios.html#content). As noted here it's outdated. https://github.com/facebook/react-native/issues/14436 In my opinion, these steps are more clear when the header files are also included in the example. Besides that, the tutorial can use the already existing `RCTConvert+CoreLocation` category for simplicity. Closes https://github.com/facebook/react-native/pull/14983 Differential Revision: D5409803 Pulled By: javache fbshipit-source-id: f7fe1d2b542e8df602dc0f0636efb4d764090811
This commit is contained in:
parent
d9f98191eb
commit
c41b5a02f2
|
@ -124,25 +124,24 @@ RCT_CUSTOM_VIEW_PROPERTY(region, MKCoordinateRegion, RNTMap)
|
||||||
|
|
||||||
Ok, this is more complicated than the simple `BOOL` case we had before. Now we have a `MKCoordinateRegion` type that needs a conversion function, and we have custom code so that the view will animate when we set the region from JS. Within the function body that we provide, `json` refers to the raw value that has been passed from JS. There is also a `view` variable which gives us access to the manager's view instance, and a `defaultView` that we use to reset the property back to the default value if JS sends us a null sentinel.
|
Ok, this is more complicated than the simple `BOOL` case we had before. Now we have a `MKCoordinateRegion` type that needs a conversion function, and we have custom code so that the view will animate when we set the region from JS. Within the function body that we provide, `json` refers to the raw value that has been passed from JS. There is also a `view` variable which gives us access to the manager's view instance, and a `defaultView` that we use to reset the property back to the default value if JS sends us a null sentinel.
|
||||||
|
|
||||||
You could write any conversion function you want for your view - here is the implementation for `MKCoordinateRegion` via two categories on `RCTConvert`:
|
You could write any conversion function you want for your view - here is the implementation for `MKCoordinateRegion` via a category on `RCTConvert`. It uses an already existing category of ReactNative `RCTConvert+CoreLocation`:
|
||||||
|
|
||||||
```objectivec
|
```objectivec
|
||||||
@implementation RCTConvert(CoreLocation)
|
// RCTConvert+Mapkit.h
|
||||||
|
#import <MapKit/MapKit.h>
|
||||||
|
#import <React/RCTConvert.h>
|
||||||
|
|
||||||
RCT_CONVERTER(CLLocationDegrees, CLLocationDegrees, doubleValue);
|
@interface RCTConvert (Mapkit)
|
||||||
RCT_CONVERTER(CLLocationDistance, CLLocationDistance, doubleValue);
|
|
||||||
|
|
||||||
+ (CLLocationCoordinate2D)CLLocationCoordinate2D:(id)json
|
+ (MKCoordinateSpan)MKCoordinateSpan:(id)json;
|
||||||
{
|
+ (MKCoordinateRegion)MKCoordinateRegion:(id)json;
|
||||||
json = [self NSDictionary:json];
|
|
||||||
return (CLLocationCoordinate2D){
|
|
||||||
[self CLLocationDegrees:json[@"latitude"]],
|
|
||||||
[self CLLocationDegrees:json[@"longitude"]]
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
@end
|
@end
|
||||||
|
|
||||||
|
// RCTConvert+Mapkit.m
|
||||||
|
#import <CoreLocation/CoreLocation.h>
|
||||||
|
#import <React/RCTConvert+CoreLocation.h>
|
||||||
|
|
||||||
@implementation RCTConvert(MapKit)
|
@implementation RCTConvert(MapKit)
|
||||||
|
|
||||||
+ (MKCoordinateSpan)MKCoordinateSpan:(id)json
|
+ (MKCoordinateSpan)MKCoordinateSpan:(id)json
|
||||||
|
@ -161,6 +160,8 @@ RCT_CONVERTER(CLLocationDistance, CLLocationDistance, doubleValue);
|
||||||
[self MKCoordinateSpan:json]
|
[self MKCoordinateSpan:json]
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@end
|
||||||
```
|
```
|
||||||
|
|
||||||
These conversion functions are designed to safely process any JSON that the JS might throw at them by displaying "RedBox" errors and returning standard initialization values when missing keys or other developer errors are encountered.
|
These conversion functions are designed to safely process any JSON that the JS might throw at them by displaying "RedBox" errors and returning standard initialization values when missing keys or other developer errors are encountered.
|
||||||
|
|
Loading…
Reference in New Issue