I am trying to create a fabric
module for iOS
using react-native's
new architecture
In my objective-c++
file while setting a UIView
, I have to assign a CGRect
at time of init
of UIView
. If I don't on the native
side and just give it on js
side the view
is not visible.
Following does not work
Objective-C++
_view = [[UIView alloc] init];
_gradient = [CAGradientLayer layer];
_gradient.frame = _view.bounds;
_gradient.startPoint = CGPointZero;
_gradient.endPoint = CGPointMake(1, 1);
_gradient.colors = @[(id)[UIColor redColor].CGColor,(id)[UIColor blackColor].CGColor,(id)[UIColor blueColor].CGColor];
[_view.layer insertSublayer:_gradient atIndex:0];
self.contentView = _view;
JS
<YourEdgeLinearGradientView
style=
/>
Following works
Objective-C++
_view = [[UIView alloc] initWithFrame:CGRectMake(0,0,400,400)];
...
...
JS
<YourEdgeLinearGradientView
style=
/>
but the issue is it occupies the width and height set on the native
side and ignores js
side I want to use
_view = [[UIView alloc] init];
without setting width and height on native
side but setting it on js
side
To add on more to this if I take a UIButton
or a UILAbel
instead of CAGradientLayer
and apply constraints
to UIView
then I don't have to set CGRectMake
to UIView
Also I don't want to pass width
and height
from the specs
file, whatever I set from the style property should be applied. It works fine for android
component but not for iOS
.
Check this repo https://github.com/PritishSawant/-ReactNativeMultipleTurboModulesAndFabricExample
Go to the iOS
folder => RNYourEdgeLinearGradientView.mm
, https://github.com/PritishSawant/-ReactNativeMultipleTurboModulesAndFabricExample/blob/main/ios/RNYourEdgeLinearGradientView.mm
I am currently using
view = [[UIView alloc] init];
which causes issue and is not visible on JS
side
If I use like below
_view = [[UIView alloc] initWithFrame:CGRectMake(0,0,200,200)];
then it works but I don't want to set width and height on iOS side. I want to use view = [[UIView alloc] init];
and whatever width and height I define in styles
on react-native side
, the view
should occupy that
from How to avoid setting manual UIView width and height on native side for Fabric component when using CAGradientLayer?
No comments:
Post a Comment