From 2d226600024a25915f660e25d951fc2c996245a5 Mon Sep 17 00:00:00 2001 From: Maksymilian Galas Date: Tue, 10 Sep 2024 11:58:02 +0200 Subject: [PATCH 1/7] fix(iOS): extraLight blur not working --- apps/src/tests/Test2320.tsx | 56 +++++++++++++++++++++++++++++++ apps/src/tests/index.ts | 1 + ios/RNSScreenStackHeaderConfig.mm | 4 +-- 3 files changed, 58 insertions(+), 3 deletions(-) create mode 100644 apps/src/tests/Test2320.tsx diff --git a/apps/src/tests/Test2320.tsx b/apps/src/tests/Test2320.tsx new file mode 100644 index 0000000000..ebebf1607b --- /dev/null +++ b/apps/src/tests/Test2320.tsx @@ -0,0 +1,56 @@ +import * as React from "react"; +import { ScrollView, Text } from "react-native"; +import { createNativeStackNavigator } from "@react-navigation/native-stack"; +import { NavigationContainer, useTheme } from "@react-navigation/native"; +import { SafeAreaProvider } from "react-native-safe-area-context"; + +const ArticleScreen = () => { + return ( + + + Lorem Ipsum is simply dummy text of the printing and typesetting + industry. Lorem Ipsum has been the industry's standard dummy text + ever since the 1500s, when an unknown printer took a galley of type and + scrambled it to make a type specimen book. It has survived not only five + centuries, but also the leap into electronic typesetting, remaining + essentially unchanged. It was popularised in the 1960s with the release + of Letraset sheets containing Lorem Ipsum passages, and more recently + with desktop publishing software like Aldus PageMaker including versions + of Lorem Ipsum. + Contrary to popular belief, Lorem Ipsum is not simply random text. It + has roots in a piece of classical Latin literature from 45 BC, making it + over 2000 years old. Richard McClintock, a Latin professor at + Hampden-Sydney College in Virginia, looked up one of the more obscure + Latin words, consectetur, from a Lorem Ipsum passage, and going through + the cites of the word in classical literature, discovered the + undoubtable source. Lorem Ipsum comes from sections 1.10.32 and 1.10.33 + of "de Finibus Bonorum et Malorum" (The Extremes of Good and + Evil) by Cicero, written in 45 BC. This book is a treatise on the theory + of ethics, very popular during the Renaissance. The first line of Lorem + Ipsum, "Lorem ipsum dolor sit amet..", comes from a line in + section 1.10.32. + + + ); +} + +export default function App() { + const Stack = createNativeStackNavigator(); + return ( + + + + + + + + ) +} diff --git a/apps/src/tests/index.ts b/apps/src/tests/index.ts index 1b7139c0ca..19ba354757 100644 --- a/apps/src/tests/index.ts +++ b/apps/src/tests/index.ts @@ -111,6 +111,7 @@ export { default as Test2235 } from './Test2235'; export { default as Test2252 } from './Test2252'; export { default as Test2271 } from './Test2271'; export { default as Test2282 } from './Test2282'; +export { default as Test2320 } from './Test2320'; export { default as TestScreenAnimation } from './TestScreenAnimation'; export { default as TestHeader } from './TestHeader'; diff --git a/ios/RNSScreenStackHeaderConfig.mm b/ios/RNSScreenStackHeaderConfig.mm index 4750e9be0f..898aa4a983 100644 --- a/ios/RNSScreenStackHeaderConfig.mm +++ b/ios/RNSScreenStackHeaderConfig.mm @@ -390,9 +390,7 @@ + (UINavigationBarAppearance *)buildAppearance:(UIViewController *)vc appearance.backgroundColor = config.backgroundColor; } - if (config.blurEffect) { - appearance.backgroundEffect = [UIBlurEffect effectWithStyle:config.blurEffect]; - } + appearance.backgroundEffect = [UIBlurEffect effectWithStyle:config.blurEffect]; if (config.hideShadow) { appearance.shadowColor = nil; From 868048f55f551cb97f0e1f887e45a96d625ba3c0 Mon Sep 17 00:00:00 2001 From: Maksymilian Galas Date: Mon, 16 Sep 2024 22:20:32 +0100 Subject: [PATCH 2/7] fix(iOS): add UIBlurEffectStyleUndefined --- ios/RNSConvert.mm | 4 ++++ ios/RNSScreenStackHeaderConfig.mm | 12 ++++++++++-- src/fabric/ScreenStackHeaderConfigNativeComponent.ts | 3 ++- src/types.tsx | 1 + 4 files changed, 17 insertions(+), 3 deletions(-) diff --git a/ios/RNSConvert.mm b/ios/RNSConvert.mm index 011964ed52..c717d7b19c 100644 --- a/ios/RNSConvert.mm +++ b/ios/RNSConvert.mm @@ -177,6 +177,8 @@ + (UIBlurEffectStyle)UIBlurEffectStyleFromCppEquivalent:(react::RNSScreenStackHe __IPHONE_OS_VERSION_MAX_ALLOWED >= __IPHONE_13_0 if (@available(iOS 13.0, *)) { switch (blurEffect) { + case react::RNSScreenStackHeaderConfigBlurEffect::Undefined: + return (UIBlurEffectStyle)-1; case react::RNSScreenStackHeaderConfigBlurEffect::ExtraLight: return UIBlurEffectStyleExtraLight; case react::RNSScreenStackHeaderConfigBlurEffect::Light: @@ -222,6 +224,8 @@ + (UIBlurEffectStyle)UIBlurEffectStyleFromCppEquivalent:(react::RNSScreenStackHe #endif switch (blurEffect) { + case react::RNSScreenStackHeaderConfigBlurEffect::Undefined: + return (UIBlurEffectStyle)-1; case react::RNSScreenStackHeaderConfigBlurEffect::Light: return UIBlurEffectStyleLight; case react::RNSScreenStackHeaderConfigBlurEffect::Dark: diff --git a/ios/RNSScreenStackHeaderConfig.mm b/ios/RNSScreenStackHeaderConfig.mm index 898aa4a983..6d7a00de3b 100644 --- a/ios/RNSScreenStackHeaderConfig.mm +++ b/ios/RNSScreenStackHeaderConfig.mm @@ -53,6 +53,8 @@ + (BOOL)RNSisBlank:(NSString *)string @end +static UIBlurEffectStyle UIBlurEffectStyleUndefined = (UIBlurEffectStyle)-1; + @implementation RNSScreenStackHeaderConfig { NSMutableArray *_reactSubviews; #ifdef RCT_NEW_ARCH_ENABLED @@ -96,6 +98,7 @@ - (void)initProps self.hidden = YES; _reactSubviews = [NSMutableArray new]; _backTitleVisible = YES; + _blurEffect = UIBlurEffectStyleUndefined; } - (UIView *)reactSuperview @@ -390,7 +393,11 @@ + (UINavigationBarAppearance *)buildAppearance:(UIViewController *)vc appearance.backgroundColor = config.backgroundColor; } - appearance.backgroundEffect = [UIBlurEffect effectWithStyle:config.blurEffect]; + if (config.blurEffect != UIBlurEffectStyleUndefined) { + appearance.backgroundEffect = [UIBlurEffect effectWithStyle:config.blurEffect]; + } else { + appearance.backgroundEffect = nil; + } if (config.hideShadow) { appearance.shadowColor = nil; @@ -1000,6 +1007,7 @@ + (NSMutableDictionary *)blurEffectsForIOSVersion { NSMutableDictionary *blurEffects = [NSMutableDictionary new]; [blurEffects addEntriesFromDictionary:@{ + @"undefined" : @(UIBlurEffectStyleUndefined), @"extraLight" : @(UIBlurEffectStyleExtraLight), @"light" : @(UIBlurEffectStyleLight), @"dark" : @(UIBlurEffectStyleDark), @@ -1055,6 +1063,6 @@ + (NSMutableDictionary *)blurEffectsForIOSVersion UINavigationItemBackButtonDisplayModeDefault, integerValue) -RCT_ENUM_CONVERTER(UIBlurEffectStyle, ([self blurEffectsForIOSVersion]), UIBlurEffectStyleExtraLight, integerValue) +RCT_ENUM_CONVERTER(UIBlurEffectStyle, ([self blurEffectsForIOSVersion]), UIBlurEffectStyleUndefined, integerValue) @end diff --git a/src/fabric/ScreenStackHeaderConfigNativeComponent.ts b/src/fabric/ScreenStackHeaderConfigNativeComponent.ts index de0574aa1b..9260fe72d3 100644 --- a/src/fabric/ScreenStackHeaderConfigNativeComponent.ts +++ b/src/fabric/ScreenStackHeaderConfigNativeComponent.ts @@ -16,6 +16,7 @@ type OnDetachedEvent = Readonly<{}>; type BackButtonDisplayMode = 'minimal' | 'default' | 'generic'; type BlurEffect = + | 'undefined' | 'extraLight' | 'light' | 'dark' @@ -66,7 +67,7 @@ export interface NativeProps extends ViewProps { backButtonDisplayMode?: WithDefault; hideBackButton?: boolean; backButtonInCustomView?: boolean; - blurEffect?: WithDefault; + blurEffect?: WithDefault; // TODO: implement this props on iOS topInsetEnabled?: boolean; } diff --git a/src/types.tsx b/src/types.tsx index 6e8c8b343b..44cdb8a33f 100644 --- a/src/types.tsx +++ b/src/types.tsx @@ -41,6 +41,7 @@ export type StackAnimationTypes = | 'slide_from_left' | 'ios'; export type BlurEffectTypes = + | 'undefined' | 'extraLight' | 'light' | 'dark' From becc602efa7a8757e117ffa9e5d9e04eef0b0d83 Mon Sep 17 00:00:00 2001 From: Kacper Kafara Date: Thu, 17 Oct 2024 15:12:03 +0200 Subject: [PATCH 3/7] Restore react navigation --- react-navigation | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/react-navigation b/react-navigation index 248fcf7d32..4caf3cb849 160000 --- a/react-navigation +++ b/react-navigation @@ -1 +1 @@ -Subproject commit 248fcf7d328b7a813106f5306a78ffd7eef5bcb3 +Subproject commit 4caf3cb849a8708a36d0dbf22dac432d2ca780be From e29d2d6b9768aaa8e60d2a492da6106b3e2c8223 Mon Sep 17 00:00:00 2001 From: Kacper Kafara Date: Thu, 17 Oct 2024 16:15:57 +0200 Subject: [PATCH 4/7] Change `undefined` to `none` --- src/fabric/ScreenStackHeaderConfigNativeComponent.ts | 4 ++-- src/types.tsx | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/fabric/ScreenStackHeaderConfigNativeComponent.ts b/src/fabric/ScreenStackHeaderConfigNativeComponent.ts index dc96bd12df..f47d82ae0e 100644 --- a/src/fabric/ScreenStackHeaderConfigNativeComponent.ts +++ b/src/fabric/ScreenStackHeaderConfigNativeComponent.ts @@ -18,7 +18,7 @@ type OnDetachedEvent = Readonly<{}>; type BackButtonDisplayMode = 'minimal' | 'default' | 'generic'; type BlurEffect = - | 'undefined' + | 'none' | 'extraLight' | 'light' | 'dark' @@ -69,7 +69,7 @@ export interface NativeProps extends ViewProps { backButtonDisplayMode?: WithDefault; hideBackButton?: boolean; backButtonInCustomView?: boolean; - blurEffect?: WithDefault; + blurEffect?: WithDefault; // TODO: implement this props on iOS topInsetEnabled?: boolean; } diff --git a/src/types.tsx b/src/types.tsx index 599e9948b4..2af4400d75 100644 --- a/src/types.tsx +++ b/src/types.tsx @@ -42,7 +42,7 @@ export type StackAnimationTypes = | 'ios_from_right' | 'ios_from_left'; export type BlurEffectTypes = - | 'undefined' + | 'none' | 'extraLight' | 'light' | 'dark' From d22beddf9373b1f27129e126a1e0696b177ac6d2 Mon Sep 17 00:00:00 2001 From: Kacper Kafara Date: Thu, 17 Oct 2024 16:17:23 +0200 Subject: [PATCH 5/7] Solve this with adding proxy RNSBlurEffectStyle enum type --- ios/RNSConvert.h | 5 ++- ios/RNSConvert.mm | 68 +++++++++++++++++-------------- ios/RNSEnums.h | 30 ++++++++++++++ ios/RNSScreenStackHeaderConfig.h | 2 +- ios/RNSScreenStackHeaderConfig.mm | 56 ++++++++++++------------- 5 files changed, 100 insertions(+), 61 deletions(-) diff --git a/ios/RNSConvert.h b/ios/RNSConvert.h index fa3d02f4a9..5c1cb66b88 100644 --- a/ios/RNSConvert.h +++ b/ios/RNSConvert.h @@ -42,7 +42,10 @@ namespace react = facebook::react; + (NSMutableArray *)arrayFromVector:(const std::vector &)vector; -+ (UIBlurEffectStyle)UIBlurEffectStyleFromCppEquivalent:(react::RNSScreenStackHeaderConfigBlurEffect)blurEffect; ++ (RNSBlurEffectStyle)RNSBlurEffectStyleFromCppEquivalent:(react::RNSScreenStackHeaderConfigBlurEffect)blurEffect; + +/// This method fails (by assertion) when `blurEffect == RNSBlurEffectStyleNone` which has no counter part in the UIKit type. ++ (UIBlurEffectStyle)tryConvertRNSBlurEffectStyleToUIBlurEffectStyle:(RNSBlurEffectStyle)blurEffect; @end diff --git a/ios/RNSConvert.mm b/ios/RNSConvert.mm index 56af314598..f1dd53f691 100644 --- a/ios/RNSConvert.mm +++ b/ios/RNSConvert.mm @@ -173,75 +173,83 @@ + (RNSSearchBarPlacement)RNSScreenSearchBarPlacementFromCppEquivalent:(react::RN return array; } -+ (UIBlurEffectStyle)UIBlurEffectStyleFromCppEquivalent:(react::RNSScreenStackHeaderConfigBlurEffect)blurEffect ++ (RNSBlurEffectStyle)RNSBlurEffectStyleFromCppEquivalent:(react::RNSScreenStackHeaderConfigBlurEffect)blurEffect { #if !TARGET_OS_TV && defined(__IPHONE_OS_VERSION_MAX_ALLOWED) && defined(__IPHONE_13_0) && \ __IPHONE_OS_VERSION_MAX_ALLOWED >= __IPHONE_13_0 if (@available(iOS 13.0, *)) { switch (blurEffect) { - case react::RNSScreenStackHeaderConfigBlurEffect::Undefined: - return (UIBlurEffectStyle)-1; + case react::RNSScreenStackHeaderConfigBlurEffect::None: + return RNSBlurEffectStyleNone; case react::RNSScreenStackHeaderConfigBlurEffect::ExtraLight: - return UIBlurEffectStyleExtraLight; + return RNSBlurEffectStyleExtraLight; case react::RNSScreenStackHeaderConfigBlurEffect::Light: - return UIBlurEffectStyleLight; + return RNSBlurEffectStyleLight; case react::RNSScreenStackHeaderConfigBlurEffect::Dark: - return UIBlurEffectStyleDark; + return RNSBlurEffectStyleDark; case react::RNSScreenStackHeaderConfigBlurEffect::Regular: - return UIBlurEffectStyleRegular; + return RNSBlurEffectStyleRegular; case react::RNSScreenStackHeaderConfigBlurEffect::Prominent: - return UIBlurEffectStyleProminent; + return RNSBlurEffectStyleProminent; case react::RNSScreenStackHeaderConfigBlurEffect::SystemUltraThinMaterial: - return UIBlurEffectStyleSystemUltraThinMaterial; + return RNSBlurEffectStyleSystemUltraThinMaterial; case react::RNSScreenStackHeaderConfigBlurEffect::SystemThinMaterial: - return UIBlurEffectStyleSystemThinMaterial; + return RNSBlurEffectStyleSystemThinMaterial; case react::RNSScreenStackHeaderConfigBlurEffect::SystemMaterial: - return UIBlurEffectStyleSystemMaterial; + return RNSBlurEffectStyleSystemMaterial; case react::RNSScreenStackHeaderConfigBlurEffect::SystemThickMaterial: - return UIBlurEffectStyleSystemThickMaterial; + return RNSBlurEffectStyleSystemThickMaterial; case react::RNSScreenStackHeaderConfigBlurEffect::SystemChromeMaterial: - return UIBlurEffectStyleSystemChromeMaterial; + return RNSBlurEffectStyleSystemChromeMaterial; case react::RNSScreenStackHeaderConfigBlurEffect::SystemUltraThinMaterialLight: - return UIBlurEffectStyleSystemUltraThinMaterialLight; + return RNSBlurEffectStyleSystemUltraThinMaterialLight; case react::RNSScreenStackHeaderConfigBlurEffect::SystemThinMaterialLight: - return UIBlurEffectStyleSystemThinMaterialLight; + return RNSBlurEffectStyleSystemThinMaterialLight; case react::RNSScreenStackHeaderConfigBlurEffect::SystemMaterialLight: - return UIBlurEffectStyleSystemMaterialLight; + return RNSBlurEffectStyleSystemMaterialLight; case react::RNSScreenStackHeaderConfigBlurEffect::SystemThickMaterialLight: - return UIBlurEffectStyleSystemThickMaterialLight; + return RNSBlurEffectStyleSystemThickMaterialLight; case react::RNSScreenStackHeaderConfigBlurEffect::SystemChromeMaterialLight: - return UIBlurEffectStyleSystemChromeMaterialLight; + return RNSBlurEffectStyleSystemChromeMaterialLight; case react::RNSScreenStackHeaderConfigBlurEffect::SystemUltraThinMaterialDark: - return UIBlurEffectStyleSystemUltraThinMaterialDark; + return RNSBlurEffectStyleSystemUltraThinMaterialDark; case react::RNSScreenStackHeaderConfigBlurEffect::SystemThinMaterialDark: - return UIBlurEffectStyleSystemThinMaterialDark; + return RNSBlurEffectStyleSystemThinMaterialDark; case react::RNSScreenStackHeaderConfigBlurEffect::SystemMaterialDark: - return UIBlurEffectStyleSystemMaterialDark; + return RNSBlurEffectStyleSystemMaterialDark; case react::RNSScreenStackHeaderConfigBlurEffect::SystemThickMaterialDark: - return UIBlurEffectStyleSystemThickMaterialDark; + return RNSBlurEffectStyleSystemThickMaterialDark; case react::RNSScreenStackHeaderConfigBlurEffect::SystemChromeMaterialDark: - return UIBlurEffectStyleSystemChromeMaterialDark; + return RNSBlurEffectStyleSystemChromeMaterialDark; } } #endif switch (blurEffect) { - case react::RNSScreenStackHeaderConfigBlurEffect::Undefined: - return (UIBlurEffectStyle)-1; + case react::RNSScreenStackHeaderConfigBlurEffect::None: + return RNSBlurEffectStyleNone; case react::RNSScreenStackHeaderConfigBlurEffect::Light: - return UIBlurEffectStyleLight; + return RNSBlurEffectStyleLight; case react::RNSScreenStackHeaderConfigBlurEffect::Dark: - return UIBlurEffectStyleDark; + return RNSBlurEffectStyleDark; case react::RNSScreenStackHeaderConfigBlurEffect::Regular: - return UIBlurEffectStyleRegular; + return RNSBlurEffectStyleRegular; case react::RNSScreenStackHeaderConfigBlurEffect::Prominent: - return UIBlurEffectStyleProminent; + return RNSBlurEffectStyleProminent; case react::RNSScreenStackHeaderConfigBlurEffect::ExtraLight: default: - return UIBlurEffectStyleExtraLight; + return RNSBlurEffectStyleNone; } } ++ (UIBlurEffectStyle)tryConvertRNSBlurEffectStyleToUIBlurEffectStyle:(RNSBlurEffectStyle)blurEffect +{ + react_native_assert(blurEffect != RNSBlurEffectStyleNone); + // Cast safety: RNSBlurEffectStyle is defined in such way that its values map 1:1 with + // UIBlurEffectStyle, except RNSBlurEffectStyleNone which is excluded above. + return (UIBlurEffectStyle)blurEffect; +} + @end #endif // RCT_NEW_ARCH_ENABLED diff --git a/ios/RNSEnums.h b/ios/RNSEnums.h index 5a51bb264d..9bf95a4a20 100644 --- a/ios/RNSEnums.h +++ b/ios/RNSEnums.h @@ -71,3 +71,33 @@ typedef NS_ENUM(NSInteger, RNSSearchBarPlacement) { RNSSearchBarPlacementInline, RNSSearchBarPlacementStacked, }; + +// Redefinition of UIBlurEffectStyle. We need to represent additional case of `None`. +typedef NS_ENUM(NSInteger, RNSBlurEffectStyle) { + /// No blur effect should be visible + RNSBlurEffectStyleNone = -1, + RNSBlurEffectStyleExtraLight = UIBlurEffectStyleExtraLight, + RNSBlurEffectStyleLight = UIBlurEffectStyleLight, + RNSBlurEffectStyleDark = UIBlurEffectStyleDark, + // TODO: Add support for this variant on tvOS +// RNSBlurEffectStyleExtraDark = UIBlurEffectStyleExtraDark API_AVAILABLE(tvos(10.0)) API_UNAVAILABLE(ios) API_UNAVAILABLE(watchos), + RNSBlurEffectStyleRegular API_AVAILABLE(ios(10.0)) API_UNAVAILABLE(watchos) = UIBlurEffectStyleRegular, + RNSBlurEffectStyleProminent API_AVAILABLE(ios(10.0)) API_UNAVAILABLE(watchos) = UIBlurEffectStyleProminent, + RNSBlurEffectStyleSystemUltraThinMaterial API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemUltraThinMaterial, + RNSBlurEffectStyleSystemThinMaterial API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemThinMaterial, + RNSBlurEffectStyleSystemMaterial API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemMaterial, + RNSBlurEffectStyleSystemThickMaterial API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemThickMaterial, + RNSBlurEffectStyleSystemChromeMaterial API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemChromeMaterial, + RNSBlurEffectStyleSystemUltraThinMaterialLight API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemUltraThinMaterialLight, + RNSBlurEffectStyleSystemThinMaterialLight API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemThinMaterialLight, + RNSBlurEffectStyleSystemMaterialLight API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemMaterialLight, + RNSBlurEffectStyleSystemThickMaterialLight API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemThickMaterialLight, + RNSBlurEffectStyleSystemChromeMaterialLight API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemChromeMaterialLight, + + RNSBlurEffectStyleSystemUltraThinMaterialDark API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemUltraThinMaterialDark, + RNSBlurEffectStyleSystemThinMaterialDark API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemThinMaterialDark, + RNSBlurEffectStyleSystemMaterialDark API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemMaterialDark, + RNSBlurEffectStyleSystemThickMaterialDark API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemThickMaterialDark, + RNSBlurEffectStyleSystemChromeMaterialDark API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemChromeMaterialDark + +} API_AVAILABLE(ios(8.0)) API_UNAVAILABLE(watchos); diff --git a/ios/RNSScreenStackHeaderConfig.h b/ios/RNSScreenStackHeaderConfig.h index f0dad8d9ea..b9d33831d3 100644 --- a/ios/RNSScreenStackHeaderConfig.h +++ b/ios/RNSScreenStackHeaderConfig.h @@ -56,7 +56,7 @@ @property (nonatomic) BOOL backButtonInCustomView; @property (nonatomic) UISemanticContentAttribute direction; @property (nonatomic) UINavigationItemBackButtonDisplayMode backButtonDisplayMode; -@property (nonatomic) UIBlurEffectStyle blurEffect; +@property (nonatomic) RNSBlurEffectStyle blurEffect; + (void)willShowViewController:(UIViewController *)vc animated:(BOOL)animated diff --git a/ios/RNSScreenStackHeaderConfig.mm b/ios/RNSScreenStackHeaderConfig.mm index ea87e00a1d..9989eccac2 100644 --- a/ios/RNSScreenStackHeaderConfig.mm +++ b/ios/RNSScreenStackHeaderConfig.mm @@ -54,8 +54,6 @@ + (BOOL)RNSisBlank:(NSString *)string @end -static UIBlurEffectStyle UIBlurEffectStyleUndefined = (UIBlurEffectStyle)-1; - @implementation RNSScreenStackHeaderConfig { NSMutableArray *_reactSubviews; NSDirectionalEdgeInsets _lastHeaderInsets; @@ -112,7 +110,7 @@ - (void)initProps self.hidden = YES; _reactSubviews = [NSMutableArray new]; _backTitleVisible = YES; - _blurEffect = UIBlurEffectStyleUndefined; + _blurEffect = RNSBlurEffectStyleNone; } - (UIView *)reactSuperview @@ -452,8 +450,8 @@ + (UINavigationBarAppearance *)buildAppearance:(UIViewController *)vc appearance.backgroundColor = config.backgroundColor; } - if (config.blurEffect != UIBlurEffectStyleUndefined) { - appearance.backgroundEffect = [UIBlurEffect effectWithStyle:config.blurEffect]; + if (config.blurEffect != RNSBlurEffectStyleNone) { + appearance.backgroundEffect = [UIBlurEffect effectWithStyle:[RNSConvert tryConvertRNSBlurEffectStyleToUIBlurEffectStyle:config.blurEffect]]; } else { appearance.backgroundEffect = nil; } @@ -982,7 +980,7 @@ - (void)updateProps:(react::Props::Shared const &)props oldProps:(react::Props:: _backgroundColor = RCTUIColorFromSharedColor(newScreenProps.backgroundColor); if (newScreenProps.blurEffect != oldScreenProps.blurEffect) { - _blurEffect = [RNSConvert UIBlurEffectStyleFromCppEquivalent:newScreenProps.blurEffect]; + _blurEffect = [RNSConvert RNSBlurEffectStyleFromCppEquivalent:newScreenProps.blurEffect]; } [self updateViewControllerIfNeeded]; @@ -1066,7 +1064,7 @@ - (RCTShadowView *)shadowView RCT_EXPORT_VIEW_PROPERTY(backTitleFontSize, NSNumber) RCT_EXPORT_VIEW_PROPERTY(backgroundColor, UIColor) RCT_EXPORT_VIEW_PROPERTY(backTitleVisible, BOOL) -RCT_EXPORT_VIEW_PROPERTY(blurEffect, UIBlurEffectStyle) +RCT_EXPORT_VIEW_PROPERTY(blurEffect, RNSBlurEffectStyle) RCT_EXPORT_VIEW_PROPERTY(color, UIColor) RCT_EXPORT_VIEW_PROPERTY(direction, UISemanticContentAttribute) RCT_EXPORT_VIEW_PROPERTY(largeTitle, BOOL) @@ -1132,37 +1130,37 @@ + (NSMutableDictionary *)blurEffectsForIOSVersion { NSMutableDictionary *blurEffects = [NSMutableDictionary new]; [blurEffects addEntriesFromDictionary:@{ - @"undefined" : @(UIBlurEffectStyleUndefined), - @"extraLight" : @(UIBlurEffectStyleExtraLight), - @"light" : @(UIBlurEffectStyleLight), - @"dark" : @(UIBlurEffectStyleDark), + @"none" : @(RNSBlurEffectStyleNone), + @"extraLight" : @(RNSBlurEffectStyleExtraLight), + @"light" : @(RNSBlurEffectStyleLight), + @"dark" : @(RNSBlurEffectStyleDark), }]; if (@available(iOS 10.0, *)) { [blurEffects addEntriesFromDictionary:@{ - @"regular" : @(UIBlurEffectStyleRegular), - @"prominent" : @(UIBlurEffectStyleProminent), + @"regular" : @(RNSBlurEffectStyleRegular), + @"prominent" : @(RNSBlurEffectStyleProminent), }]; } #if !TARGET_OS_TV && defined(__IPHONE_OS_VERSION_MAX_ALLOWED) && defined(__IPHONE_13_0) && \ __IPHONE_OS_VERSION_MAX_ALLOWED >= __IPHONE_13_0 if (@available(iOS 13.0, *)) { [blurEffects addEntriesFromDictionary:@{ - @"systemUltraThinMaterial" : @(UIBlurEffectStyleSystemUltraThinMaterial), - @"systemThinMaterial" : @(UIBlurEffectStyleSystemThinMaterial), - @"systemMaterial" : @(UIBlurEffectStyleSystemMaterial), - @"systemThickMaterial" : @(UIBlurEffectStyleSystemThickMaterial), - @"systemChromeMaterial" : @(UIBlurEffectStyleSystemChromeMaterial), - @"systemUltraThinMaterialLight" : @(UIBlurEffectStyleSystemUltraThinMaterialLight), - @"systemThinMaterialLight" : @(UIBlurEffectStyleSystemThinMaterialLight), - @"systemMaterialLight" : @(UIBlurEffectStyleSystemMaterialLight), - @"systemThickMaterialLight" : @(UIBlurEffectStyleSystemThickMaterialLight), - @"systemChromeMaterialLight" : @(UIBlurEffectStyleSystemChromeMaterialLight), - @"systemUltraThinMaterialDark" : @(UIBlurEffectStyleSystemUltraThinMaterialDark), - @"systemThinMaterialDark" : @(UIBlurEffectStyleSystemThinMaterialDark), - @"systemMaterialDark" : @(UIBlurEffectStyleSystemMaterialDark), - @"systemThickMaterialDark" : @(UIBlurEffectStyleSystemThickMaterialDark), - @"systemChromeMaterialDark" : @(UIBlurEffectStyleSystemChromeMaterialDark), + @"systemUltraThinMaterial" : @(RNSBlurEffectStyleSystemUltraThinMaterial), + @"systemThinMaterial" : @(RNSBlurEffectStyleSystemThinMaterial), + @"systemMaterial" : @(RNSBlurEffectStyleSystemMaterial), + @"systemThickMaterial" : @(RNSBlurEffectStyleSystemThickMaterial), + @"systemChromeMaterial" : @(RNSBlurEffectStyleSystemChromeMaterial), + @"systemUltraThinMaterialLight" : @(RNSBlurEffectStyleSystemUltraThinMaterialLight), + @"systemThinMaterialLight" : @(RNSBlurEffectStyleSystemThinMaterialLight), + @"systemMaterialLight" : @(RNSBlurEffectStyleSystemMaterialLight), + @"systemThickMaterialLight" : @(RNSBlurEffectStyleSystemThickMaterialLight), + @"systemChromeMaterialLight" : @(RNSBlurEffectStyleSystemChromeMaterialLight), + @"systemUltraThinMaterialDark" : @(RNSBlurEffectStyleSystemUltraThinMaterialDark), + @"systemThinMaterialDark" : @(RNSBlurEffectStyleSystemThinMaterialDark), + @"systemMaterialDark" : @(RNSBlurEffectStyleSystemMaterialDark), + @"systemThickMaterialDark" : @(RNSBlurEffectStyleSystemThickMaterialDark), + @"systemChromeMaterialDark" : @(RNSBlurEffectStyleSystemChromeMaterialDark), }]; } #endif @@ -1188,6 +1186,6 @@ + (NSMutableDictionary *)blurEffectsForIOSVersion UINavigationItemBackButtonDisplayModeDefault, integerValue) -RCT_ENUM_CONVERTER(UIBlurEffectStyle, ([self blurEffectsForIOSVersion]), UIBlurEffectStyleUndefined, integerValue) +RCT_ENUM_CONVERTER(RNSBlurEffectStyle, ([self blurEffectsForIOSVersion]), RNSBlurEffectStyleNone, integerValue) @end From 8b544cb3ac5e2f75cc08bdd959fc2a22f1a9ac7a Mon Sep 17 00:00:00 2001 From: Kacper Kafara Date: Thu, 17 Oct 2024 16:17:46 +0200 Subject: [PATCH 6/7] iOS prettier --- ios/RNSConvert.h | 3 +- ios/RNSEnums.h | 52 ++++++++++++++++++++----------- ios/RNSScreenStackHeaderConfig.mm | 3 +- 3 files changed, 38 insertions(+), 20 deletions(-) diff --git a/ios/RNSConvert.h b/ios/RNSConvert.h index 5c1cb66b88..768e088197 100644 --- a/ios/RNSConvert.h +++ b/ios/RNSConvert.h @@ -44,7 +44,8 @@ namespace react = facebook::react; + (RNSBlurEffectStyle)RNSBlurEffectStyleFromCppEquivalent:(react::RNSScreenStackHeaderConfigBlurEffect)blurEffect; -/// This method fails (by assertion) when `blurEffect == RNSBlurEffectStyleNone` which has no counter part in the UIKit type. +/// This method fails (by assertion) when `blurEffect == RNSBlurEffectStyleNone` which has no counter part in the UIKit +/// type. + (UIBlurEffectStyle)tryConvertRNSBlurEffectStyleToUIBlurEffectStyle:(RNSBlurEffectStyle)blurEffect; @end diff --git a/ios/RNSEnums.h b/ios/RNSEnums.h index 9bf95a4a20..2d05610b48 100644 --- a/ios/RNSEnums.h +++ b/ios/RNSEnums.h @@ -80,24 +80,40 @@ typedef NS_ENUM(NSInteger, RNSBlurEffectStyle) { RNSBlurEffectStyleLight = UIBlurEffectStyleLight, RNSBlurEffectStyleDark = UIBlurEffectStyleDark, // TODO: Add support for this variant on tvOS -// RNSBlurEffectStyleExtraDark = UIBlurEffectStyleExtraDark API_AVAILABLE(tvos(10.0)) API_UNAVAILABLE(ios) API_UNAVAILABLE(watchos), + // RNSBlurEffectStyleExtraDark = UIBlurEffectStyleExtraDark API_AVAILABLE(tvos(10.0)) API_UNAVAILABLE(ios) + // API_UNAVAILABLE(watchos), RNSBlurEffectStyleRegular API_AVAILABLE(ios(10.0)) API_UNAVAILABLE(watchos) = UIBlurEffectStyleRegular, RNSBlurEffectStyleProminent API_AVAILABLE(ios(10.0)) API_UNAVAILABLE(watchos) = UIBlurEffectStyleProminent, - RNSBlurEffectStyleSystemUltraThinMaterial API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemUltraThinMaterial, - RNSBlurEffectStyleSystemThinMaterial API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemThinMaterial, - RNSBlurEffectStyleSystemMaterial API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemMaterial, - RNSBlurEffectStyleSystemThickMaterial API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemThickMaterial, - RNSBlurEffectStyleSystemChromeMaterial API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemChromeMaterial, - RNSBlurEffectStyleSystemUltraThinMaterialLight API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemUltraThinMaterialLight, - RNSBlurEffectStyleSystemThinMaterialLight API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemThinMaterialLight, - RNSBlurEffectStyleSystemMaterialLight API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemMaterialLight, - RNSBlurEffectStyleSystemThickMaterialLight API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemThickMaterialLight, - RNSBlurEffectStyleSystemChromeMaterialLight API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemChromeMaterialLight, - - RNSBlurEffectStyleSystemUltraThinMaterialDark API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemUltraThinMaterialDark, - RNSBlurEffectStyleSystemThinMaterialDark API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemThinMaterialDark, - RNSBlurEffectStyleSystemMaterialDark API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemMaterialDark, - RNSBlurEffectStyleSystemThickMaterialDark API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemThickMaterialDark, - RNSBlurEffectStyleSystemChromeMaterialDark API_AVAILABLE(ios(13.0)) API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemChromeMaterialDark - + RNSBlurEffectStyleSystemUltraThinMaterial API_AVAILABLE(ios(13.0)) + API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemUltraThinMaterial, + RNSBlurEffectStyleSystemThinMaterial API_AVAILABLE(ios(13.0)) + API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemThinMaterial, + RNSBlurEffectStyleSystemMaterial API_AVAILABLE(ios(13.0)) + API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemMaterial, + RNSBlurEffectStyleSystemThickMaterial API_AVAILABLE(ios(13.0)) + API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemThickMaterial, + RNSBlurEffectStyleSystemChromeMaterial API_AVAILABLE(ios(13.0)) + API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemChromeMaterial, + RNSBlurEffectStyleSystemUltraThinMaterialLight API_AVAILABLE(ios(13.0)) + API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemUltraThinMaterialLight, + RNSBlurEffectStyleSystemThinMaterialLight API_AVAILABLE(ios(13.0)) + API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemThinMaterialLight, + RNSBlurEffectStyleSystemMaterialLight API_AVAILABLE(ios(13.0)) + API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemMaterialLight, + RNSBlurEffectStyleSystemThickMaterialLight API_AVAILABLE(ios(13.0)) + API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemThickMaterialLight, + RNSBlurEffectStyleSystemChromeMaterialLight API_AVAILABLE(ios(13.0)) + API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemChromeMaterialLight, + + RNSBlurEffectStyleSystemUltraThinMaterialDark API_AVAILABLE(ios(13.0)) + API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemUltraThinMaterialDark, + RNSBlurEffectStyleSystemThinMaterialDark API_AVAILABLE(ios(13.0)) + API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemThinMaterialDark, + RNSBlurEffectStyleSystemMaterialDark API_AVAILABLE(ios(13.0)) + API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemMaterialDark, + RNSBlurEffectStyleSystemThickMaterialDark API_AVAILABLE(ios(13.0)) + API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemThickMaterialDark, + RNSBlurEffectStyleSystemChromeMaterialDark API_AVAILABLE(ios(13.0)) + API_UNAVAILABLE(watchos, tvos) = UIBlurEffectStyleSystemChromeMaterialDark + } API_AVAILABLE(ios(8.0)) API_UNAVAILABLE(watchos); diff --git a/ios/RNSScreenStackHeaderConfig.mm b/ios/RNSScreenStackHeaderConfig.mm index 9989eccac2..d9ad274ae9 100644 --- a/ios/RNSScreenStackHeaderConfig.mm +++ b/ios/RNSScreenStackHeaderConfig.mm @@ -451,7 +451,8 @@ + (UINavigationBarAppearance *)buildAppearance:(UIViewController *)vc } if (config.blurEffect != RNSBlurEffectStyleNone) { - appearance.backgroundEffect = [UIBlurEffect effectWithStyle:[RNSConvert tryConvertRNSBlurEffectStyleToUIBlurEffectStyle:config.blurEffect]]; + appearance.backgroundEffect = + [UIBlurEffect effectWithStyle:[RNSConvert tryConvertRNSBlurEffectStyleToUIBlurEffectStyle:config.blurEffect]]; } else { appearance.backgroundEffect = nil; } From 6f023192e84704120ca525e80eec0dc9ca7b4cd3 Mon Sep 17 00:00:00 2001 From: Kacper Kafara Date: Fri, 18 Oct 2024 10:29:28 +0200 Subject: [PATCH 7/7] Patch iOS & Paper --- ios/RNSConvert.h | 11 ++++++++--- ios/RNSConvert.mm | 16 +++++++++++++--- 2 files changed, 21 insertions(+), 6 deletions(-) diff --git a/ios/RNSConvert.h b/ios/RNSConvert.h index 768e088197..6ebd7bd9ae 100644 --- a/ios/RNSConvert.h +++ b/ios/RNSConvert.h @@ -1,12 +1,17 @@ -#ifdef RCT_NEW_ARCH_ENABLED #import +#ifdef RCT_NEW_ARCH_ENABLED #import +#endif // RCT_NEW_ARCH_ENABLED #import "RNSEnums.h" +#ifdef RCT_NEW_ARCH_ENABLED namespace react = facebook::react; +#endif // RCT_NEW_ARCH_ENABLED @interface RNSConvert : NSObject +#ifdef RCT_NEW_ARCH_ENABLED + + (UISemanticContentAttribute)UISemanticContentAttributeFromCppEquivalent: (react::RNSScreenStackHeaderConfigDirection)direction; @@ -44,10 +49,10 @@ namespace react = facebook::react; + (RNSBlurEffectStyle)RNSBlurEffectStyleFromCppEquivalent:(react::RNSScreenStackHeaderConfigBlurEffect)blurEffect; +#endif // RCT_NEW_ARCH_ENABLED + /// This method fails (by assertion) when `blurEffect == RNSBlurEffectStyleNone` which has no counter part in the UIKit /// type. + (UIBlurEffectStyle)tryConvertRNSBlurEffectStyleToUIBlurEffectStyle:(RNSBlurEffectStyle)blurEffect; @end - -#endif // RCT_NEW_ARCH_ENABLED diff --git a/ios/RNSConvert.mm b/ios/RNSConvert.mm index f1dd53f691..90aac23be6 100644 --- a/ios/RNSConvert.mm +++ b/ios/RNSConvert.mm @@ -1,8 +1,12 @@ #import "RNSConvert.h" -#ifdef RCT_NEW_ARCH_ENABLED +#ifndef RCT_NEW_ARCH_ENABLED +#import +#endif // !RCT_NEW_ARCH_ENABLED + @implementation RNSConvert +#ifdef RCT_NEW_ARCH_ENABLED + (UISemanticContentAttribute)UISemanticContentAttributeFromCppEquivalent: (react::RNSScreenStackHeaderConfigDirection)direction { @@ -242,14 +246,20 @@ + (RNSBlurEffectStyle)RNSBlurEffectStyleFromCppEquivalent:(react::RNSScreenStack } } +#endif // RCT_NEW_ARCH_ENABLED + + (UIBlurEffectStyle)tryConvertRNSBlurEffectStyleToUIBlurEffectStyle:(RNSBlurEffectStyle)blurEffect { +#ifdef RCT_NEW_ARCH_ENABLED react_native_assert(blurEffect != RNSBlurEffectStyleNone); +#else + RCTAssert( + blurEffect != RNSBlurEffectStyleNone, @"RNSBlurEffectStyleNone variant is not convertible to UIBlurEffectStyle"); +#endif // RCT_NEW_ARCH_ENABLED + // Cast safety: RNSBlurEffectStyle is defined in such way that its values map 1:1 with // UIBlurEffectStyle, except RNSBlurEffectStyleNone which is excluded above. return (UIBlurEffectStyle)blurEffect; } @end - -#endif // RCT_NEW_ARCH_ENABLED