Skip to content

Commit e7cfa13

Browse files
Saadnajmisahrens
Saadnajmi
and
sahrens
authored
Fix transforms (#1035)
* fix transforms #280 * remove duplicate * fix errors * Update from PR feedback Co-authored-by: Spencer Ahrens <spencer.ahrens@gmail.com>
1 parent dd8d3d0 commit e7cfa13

5 files changed

Lines changed: 59 additions & 39 deletions

File tree

‎React/Views/RCTView.h‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -128,6 +128,9 @@ extern const UIAccessibilityTraits SwitchAccessibilityTrait;
128128
/**
129129
* macOS Properties
130130
*/
131+
132+
@property (nonatomic, assign) CATransform3D transform3D;
133+
131134
@property (nonatomic, copy) RCTDirectEventBlock onDoubleClick;
132135
@property (nonatomic, copy) RCTDirectEventBlock onClick;
133136
@property (nonatomic, copy) RCTDirectEventBlock onMouseEnter;

‎React/Views/RCTView.m‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -162,6 +162,9 @@ - (instancetype)initWithFrame:(CGRect)frame
162162
_borderBottomEndRadius = -1;
163163
_borderStyle = RCTBorderStyleSolid;
164164
_hitTestEdgeInsets = UIEdgeInsetsZero;
165+
#if TARGET_OS_OSX // TODO(macOS GH#774)
166+
_transform3D = CATransform3DIdentity;
167+
#endif // TODO(macOS GH#774)
165168

166169
_backgroundColor = super.backgroundColor;
167170
}
@@ -1169,6 +1172,19 @@ - (void)displayLayer:(CALayer *)layer
11691172
backgroundColor = _backgroundColor.CGColor;
11701173
#endif
11711174

1175+
#if TARGET_OS_OSX // [TODO(macOS GH#1035)
1176+
CATransform3D transform = [self transform3D];
1177+
CGPoint anchorPoint = [layer anchorPoint];
1178+
if (CGPointEqualToPoint(anchorPoint, CGPointZero) && !CATransform3DEqualToTransform(transform, CATransform3DIdentity)) {
1179+
// https://developer.apple.com/documentation/quartzcore/calayer/1410817-anchorpoint
1180+
// This compensates for the fact that layer.anchorPoint is {0, 0} instead of {0.5, 0.5} on macOS for some reason.
1181+
CATransform3D originAdjust = CATransform3DTranslate(CATransform3DIdentity, self.frame.size.width / 2, self.frame.size.height / 2, 0);
1182+
transform = CATransform3DConcat(CATransform3DConcat(CATransform3DInvert(originAdjust), transform), originAdjust);
1183+
// Enable edge antialiasing in perspective transforms
1184+
[layer setAllowsEdgeAntialiasing:!(transform.m34 == 0.0f)];
1185+
}
1186+
[layer setTransform:transform];
1187+
#endif // ]TODO(macOS GH#1035)
11721188
if (useIOSBorderRendering) {
11731189
layer.cornerRadius = cornerRadii.topLeft;
11741190
layer.borderColor = borderColors.left;

‎React/Views/RCTViewManager.m‎

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -215,15 +215,16 @@ - (RCTShadowView *)shadowView
215215

216216
RCT_CUSTOM_VIEW_PROPERTY(transform, CATransform3D, RCTView)
217217
{
218-
#if !TARGET_OS_OSX // TODO(macOS GH#774)
218+
#if TARGET_OS_OSX // [TODO(macOS GH#460)
219+
CATransform3D transform = json ? [RCTConvert CATransform3D:json] : defaultView.layer.transform;
220+
[view setTransform3D:transform];
221+
[view setNeedsDisplay];
222+
#else // ]TODO(macOS GH#460)]
219223
view.layer.transform = json ? [RCTConvert CATransform3D:json] : defaultView.layer.transform;
220-
// Enable edge antialiasing in perspective transforms
221-
view.layer.allowsEdgeAntialiasing = !(view.layer.transform.m34 == 0.0f);
222-
#elif TARGET_OS_OSX // [TODO(macOS GH#774)
223-
view.layer.sublayerTransform = json ? [RCTConvert CATransform3D:json] : defaultView.layer.sublayerTransform;
224-
// TODO: Improve this by enabling edge antialiasing only for transforms with rotation or skewing
225-
view.layer.edgeAntialiasingMask = !CATransform3DIsIdentity(view.layer.sublayerTransform) ? kCALayerLeftEdge | kCALayerRightEdge | kCALayerBottomEdge | kCALayerTopEdge : 0;
226-
#endif // ]TODO(macOS GH#774)
224+
// Enable edge antialiasing in rotation, skew, or perspective transforms
225+
view.layer.allowsEdgeAntialiasing =
226+
view.layer.transform.m12 != 0.0f || view.layer.transform.m21 != 0.0f || view.layer.transform.m34 != 0.0f;
227+
#endif // [TODO(macOS GH#460)]
227228
}
228229

229230
RCT_CUSTOM_VIEW_PROPERTY(accessibilityRole, UIAccessibilityTraits, RCTView)

‎packages/rn-tester/Podfile.lock‎

Lines changed: 29 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -542,8 +542,8 @@ SPEC CHECKSUMS:
542542
boost-for-react-native: 8f7c9ecfe357664c072ffbe2432569667cbf1f1b
543543
CocoaAsyncSocket: 065fd1e645c7abab64f7a6a2007a48038fdc6a99
544544
DoubleConversion: ed15e075aa758ac0e4c1f8b830bd4e4d40d669e8
545-
FBLazyVector: c6aa9a9619d963282360abc4bb47d2712717504e
546-
FBReactNativeSpec: 0ca7ec65c7f09ab67e221ac5f0532b8385bc2138
545+
FBLazyVector: f9a49507e1136243adff1c1a795595a5e847d811
546+
FBReactNativeSpec: 0b76599045f10c00164afbc3b7dadbc0586b06aa
547547
Flipper: 30e8eeeed6abdc98edaf32af0cda2f198be4b733
548548
Flipper-Boost-iOSX: fd1e2b8cbef7e662a122412d7ac5f5bea715403c
549549
Flipper-DoubleConversion: 57ffbe81ef95306cc9e69c4aa3aeeeeb58a6a28c
@@ -558,34 +558,34 @@ SPEC CHECKSUMS:
558558
libevent: 4049cae6c81cdb3654a443be001fb9bdceff7913
559559
OpenSSL-Universal: 1aa4f6a6ee7256b83db99ec1ccdaa80d10f9af9b
560560
RCT-Folly: 43adc9ce880eb76792f88c011773cb5c664c1419
561-
RCTRequired: 633fe8690af80ea0d6d1743ea0fbeee6a8de0978
562-
RCTTypeSafety: 2a1aa8c0ffa214900ea5e96dd1ce844be196decc
563-
React: 4f7007b4f9f59b3d935cfc415e0b3e3dd03d2021
564-
React-callinvoker: 775c5ec2ad1d1b7f0f4a8458397bfd68aced33a7
565-
React-Core: b1cdd30e896e76499480e4603f5cad119d238885
566-
React-CoreModules: c6609f09932ba5fc8dae3c20f8ba294653159370
567-
React-cxxreact: 3d44d388b2feccc0d6b2f0735cf4ac78f71c26be
568-
React-jsi: 743b50fb3db21ad787c384fd6601c7e3e6784dec
569-
React-jsiexecutor: cc19fe20e9f6c261c8f1eed5727f2b724f945494
570-
React-jsinspector: 90fbbc33233c45021327ddd921f5b91622c77190
571-
React-logger: 4f94752a4d8e071ac861865ea5f1d341650b6d70
572-
React-perflogger: 0eaad01e3aaefb12799c39333d0b584dd5b4dae8
573-
React-RCTActionSheet: e80fd63af2c04195f544a51f237f0bb8c999ba02
574-
React-RCTAnimation: 5827d917ff6c716a50b0008856ffb1772578c446
575-
React-RCTBlob: cd43b543b917d9b66eb303dc08c4058f7b3e52c4
576-
React-RCTImage: 9d0661b1b0de30e825cadd8b94fefb6b8485b370
577-
React-RCTLinking: 1e0f88ba8ecc3e36fe7f4ca89e3a7bb8ba9b033d
578-
React-RCTNetwork: c9ac771311a39f42c43ad5633f090e2d01d2710d
579-
React-RCTPushNotification: 9398208d33368b68b6afb3887c04e3f5ae1c7049
580-
React-RCTSettings: 99d2d69f4183c6e9ef89ba589a8dc77c6465a2c8
581-
React-RCTTest: a57ea516520309b75fc9c152847beedf26c7926e
582-
React-RCTText: 0732843b7d073ae2dd7687b95774a534c0fae0fb
583-
React-RCTVibration: 8a50e8ddd4402a7b123fcfe41efd1220d1b23798
584-
React-runtimeexecutor: 8993403523caba788cd6483b26a6e67384ec2224
561+
RCTRequired: ea4892e8dc691de4cf2129f4d29fe83cb491bdcc
562+
RCTTypeSafety: 6aee186c117ff01665977d2d70f0a300cdc9b4ad
563+
React: e7fc9cffd3c5988b438fa5aaba6141aad86971e6
564+
React-callinvoker: bea112449c41192b309cdb7c712e6ae9a8f4c070
565+
React-Core: 41d3242d227eb7a0481750798f48d52359054450
566+
React-CoreModules: 29ff97252b5a4ec16c5adbcab8d49a8d5e6ea3bf
567+
React-cxxreact: 9bd13f543f7c2f6fcd9d117a2a3f486e5c2530bb
568+
React-jsi: 05a3c6306ba9b754e879dfaf7110bf559f96cbda
569+
React-jsiexecutor: 199a16dbf1b183c7f3068b49f848013c1d0c8506
570+
React-jsinspector: 911c0c94d9f51d297827722451d5e457fab635da
571+
React-logger: c57708498fefd433ebfcbabd9a063ed174010d62
572+
React-perflogger: 8aac65f8d87f45d8a7c980e3d3d37b97a9ed650c
573+
React-RCTActionSheet: 3b36d5f3011473512b04a0f39b144505271ed3ef
574+
React-RCTAnimation: 33df7e35b98b9e83f1574e6b92c217ef54178867
575+
React-RCTBlob: 5ee404a8716f0055ff78999f5d12d060b03a352b
576+
React-RCTImage: 876e01ce57e5027eee514170b21e95aada21b203
577+
React-RCTLinking: 8002745c01b7723379a262dfe8575c81100b0d87
578+
React-RCTNetwork: fdf2f1e67be55ee3792366bc832461fc2044ab52
579+
React-RCTPushNotification: f7fbaf9b10ce0abd3a43ffa3204ea5bb7f9a110a
580+
React-RCTSettings: 49a609a6c7d4273a9f6fdf29c1f21d14e3f5c92d
581+
React-RCTTest: d35e7daa9fa7bb6e2febacb85eeee19527711706
582+
React-RCTText: 14747294de36617bdc7808529b3a223c10ea20ef
583+
React-RCTVibration: 5d1a1a5ae3714a3f1eadad43df60c9e6f9e04f85
584+
React-runtimeexecutor: 83250c622f59b5851d03dfe820936aff9f98368a
585585
React-TurboModuleCxx-RNW: f2e32cbfced49190a61d66c993a8975de79a158a
586-
React-TurboModuleCxx-WinRTPort: e7647958397b6cdafa0deb18f9db886d6acf6fcf
587-
ReactCommon: 90d5510f055f513dd4f1123ef1883062903b56b8
588-
Yoga: d7d6de52ed443bd01bfa17cb314b95e86876289b
586+
React-TurboModuleCxx-WinRTPort: 2fce7b4eb8e260b508acee6d26f4f0531709a74e
587+
ReactCommon: 2d0e5b1f1b90ffb71ab452cc904d7865ea5bf504
588+
Yoga: 6ca992f0bab255c81622a6e0ab8ad856d6203eba
589589
YogaKit: f782866e155069a2cca2517aafea43200b01fd5a
590590

591591
PODFILE CHECKSUM: c7a7110b242497f2bf323ba74caedb9ee61ee05e

‎packages/rn-tester/RNTesterPods.xcodeproj/project.pbxproj‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1869,7 +1869,7 @@
18691869
ENABLE_BITCODE = NO;
18701870
ENABLE_STRICT_OBJC_MSGSEND = YES;
18711871
ENABLE_TESTABILITY = YES;
1872-
"EXCLUDED_ARCHS[sdk=iphonesimulator*]" = "";
1872+
"EXCLUDED_ARCHS[sdk=iphonesimulator*]" = "arm64 ";
18731873
GCC_C_LANGUAGE_STANDARD = gnu11;
18741874
GCC_DYNAMIC_NO_PIC = NO;
18751875
GCC_NO_COMMON_BLOCKS = YES;
@@ -1953,7 +1953,7 @@
19531953
ENABLE_BITCODE = NO;
19541954
ENABLE_NS_ASSERTIONS = NO;
19551955
ENABLE_STRICT_OBJC_MSGSEND = YES;
1956-
"EXCLUDED_ARCHS[sdk=iphonesimulator*]" = "";
1956+
"EXCLUDED_ARCHS[sdk=iphonesimulator*]" = "arm64 ";
19571957
GCC_C_LANGUAGE_STANDARD = gnu11;
19581958
GCC_NO_COMMON_BLOCKS = YES;
19591959
GCC_TREAT_INCOMPATIBLE_POINTER_TYPE_WARNINGS_AS_ERRORS = YES;

0 commit comments

Comments
 (0)