From eead98b6a7010632c959459911473485b85dd086 Mon Sep 17 00:00:00 2001 From: Pontus Abrahamsson Date: Mon, 27 Jan 2020 20:07:21 +0100 Subject: [PATCH 1/3] Open modal from tab iOS --- lib/ios/RNNBottomTabOptions.h | 1 + lib/ios/RNNBottomTabOptions.m | 1 + lib/ios/RNNBottomTabsController.m | 12 ++ lib/ios/RNNButtonOptions.h | 1 + lib/ios/RNNButtonOptions.m | 3 +- lib/ios/RNNEventEmitter.h | 2 + lib/ios/RNNEventEmitter.m | 8 + lib/src/adapters/NativeEventsReceiver.ts | 76 +++++++--- lib/src/events/EventsRegistry.ts | 111 ++++++++++---- lib/src/interfaces/Events.ts | 4 + lib/src/interfaces/Options.ts | 72 ++++++--- playground/ios/Podfile.lock | 8 +- playground/src/app.js | 40 ++++- playground/src/screens/Screens.js | 41 +++--- playground/src/screens/index.js | 179 +++++++++++++++++------ 15 files changed, 429 insertions(+), 130 deletions(-) diff --git a/lib/ios/RNNBottomTabOptions.h b/lib/ios/RNNBottomTabOptions.h index 733aeb1f276..2277376ee1b 100644 --- a/lib/ios/RNNBottomTabOptions.h +++ b/lib/ios/RNNBottomTabOptions.h @@ -21,6 +21,7 @@ @property(nonatomic, strong) Color *textColor; @property(nonatomic, strong) Number *fontSize; @property(nonatomic, strong) Bool *visible; +@property(nonatomic, strong) Bool *selectTabOnPress; @end diff --git a/lib/ios/RNNBottomTabOptions.m b/lib/ios/RNNBottomTabOptions.m index bcdd4644d80..23ef6861440 100644 --- a/lib/ios/RNNBottomTabOptions.m +++ b/lib/ios/RNNBottomTabOptions.m @@ -27,6 +27,7 @@ - (instancetype)initWithDict:(NSDictionary *)dict { self.textColor = [ColorParser parse:dict key:@"textColor"]; self.fontSize = [NumberParser parse:dict key:@"fontSize"]; self.visible = [BoolParser parse:dict key:@"visible"]; + self.selectTabOnPress = [BoolParser parse:dict key:@"selectTabOnPress"]; return self; } diff --git a/lib/ios/RNNBottomTabsController.m b/lib/ios/RNNBottomTabsController.m index 38a3306fe95..5c3c46e26c4 100644 --- a/lib/ios/RNNBottomTabsController.m +++ b/lib/ios/RNNBottomTabsController.m @@ -79,4 +79,16 @@ - (void)handleLongPress:(UILongPressGestureRecognizer *) recognizer { } } +- (BOOL)tabBarController:(UITabBarController *)tabBarController shouldSelectViewController:(UIViewController *)viewController +{ + NSUInteger _index = [tabBarController.viewControllers indexOfObject:viewController]; + [self.eventEmitter sendBottomTabPressed:@(_index)]; + + if([[viewController resolveOptions].bottomTab.selectTabOnPress getWithDefaultValue:YES]){ + return YES; + } + + return NO; +} + @end diff --git a/lib/ios/RNNButtonOptions.h b/lib/ios/RNNButtonOptions.h index c07d04355ae..599cef9733a 100644 --- a/lib/ios/RNNButtonOptions.h +++ b/lib/ios/RNNButtonOptions.h @@ -11,5 +11,6 @@ @property (nonatomic, strong) Image* icon; @property (nonatomic, strong) Bool* enabled; @property (nonatomic, strong) RNNInsetsOptions* iconInsets; +@property(nonatomic, strong) Bool *selectTabOnPress; @end diff --git a/lib/ios/RNNButtonOptions.m b/lib/ios/RNNButtonOptions.m index c82989e91bc..2a1fafa038b 100644 --- a/lib/ios/RNNButtonOptions.m +++ b/lib/ios/RNNButtonOptions.m @@ -13,7 +13,8 @@ - (instancetype)initWithDict:(NSDictionary *)dict { self.icon = [ImageParser parse:dict key:@"icon"]; self.iconInsets = [[RNNInsetsOptions alloc] initWithDict:dict[@"iconInsets"]]; self.enabled = [BoolParser parse:dict key:@"enabled"]; - + self.selectTabOnPress = [BoolParser parse:dict key:@"selectTabOnPress"]; + return self; } diff --git a/lib/ios/RNNEventEmitter.h b/lib/ios/RNNEventEmitter.h index a05371670a6..56fcff82bfc 100644 --- a/lib/ios/RNNEventEmitter.h +++ b/lib/ios/RNNEventEmitter.h @@ -30,5 +30,7 @@ - (void)sendScreenPoppedEvent:(NSString *)componentId; +- (void)sendBottomTabPressed:(NSNumber *)tabIndex; + @end diff --git a/lib/ios/RNNEventEmitter.m b/lib/ios/RNNEventEmitter.m index 5ca911cdb0b..7fe797135f4 100644 --- a/lib/ios/RNNEventEmitter.m +++ b/lib/ios/RNNEventEmitter.m @@ -21,12 +21,14 @@ @implementation RNNEventEmitter { static NSString* const SearchBarCancelPressed = @"RNN.SearchBarCancelPressed"; static NSString* const PreviewCompleted = @"RNN.PreviewCompleted"; static NSString* const ScreenPopped = @"RNN.ScreenPopped"; +static NSString* const BottomTabPressed = @"RNN.BottomTabPressed"; -(NSArray *)supportedEvents { return @[AppLaunched, CommandCompleted, BottomTabSelected, BottomTabLongPressed, + BottomTabPressed, ComponentDidAppear, ComponentDidDisappear, NavigationButtonPressed, @@ -84,6 +86,12 @@ - (void)sendBottomTabLongPressed:(NSNumber *)selectedTabIndex { }]; } +-(void)sendBottomTabPressed:(NSNumber *)tabIndex { + [self send:BottomTabPressed body:@{ + @"tabIndex": tabIndex + }]; +} + -(void)sendOnNavigationCommandCompletion:(NSString *)commandName commandId:(NSString *)commandId params:(NSDictionary*)params { [self send:CommandCompleted body:@{ @"commandId":commandId, diff --git a/lib/src/adapters/NativeEventsReceiver.ts b/lib/src/adapters/NativeEventsReceiver.ts index 2e82d865749..f8b89f5273d 100644 --- a/lib/src/adapters/NativeEventsReceiver.ts +++ b/lib/src/adapters/NativeEventsReceiver.ts @@ -1,4 +1,9 @@ -import { NativeModules, NativeEventEmitter, EventEmitter, EmitterSubscription } from 'react-native'; +import { + NativeModules, + NativeEventEmitter, + EventEmitter, + EmitterSubscription +} from 'react-native'; import { ComponentDidAppearEvent, ComponentDidDisappearEvent, @@ -10,7 +15,12 @@ import { ScreenPoppedEvent, ModalAttemptedToDismissEvent } from '../interfaces/ComponentEvents'; -import { CommandCompletedEvent, BottomTabSelectedEvent, BottomTabLongPressedEvent } from '../interfaces/Events'; +import { + CommandCompletedEvent, + BottomTabSelectedEvent, + BottomTabLongPressedEvent, + BottomTabPressedEvent +} from '../interfaces/Events'; export class NativeEventsReceiver { private emitter: EventEmitter; @@ -20,65 +30,97 @@ export class NativeEventsReceiver { try { this.emitter = new NativeEventEmitter(NativeModules.RNNEventEmitter); } catch (e) { - this.emitter = { + this.emitter = ({ addListener: () => { return { remove: () => undefined }; } - } as any as EventEmitter; + } as any) as EventEmitter; } } - public registerAppLaunchedListener(callback: () => void): EmitterSubscription { + public registerAppLaunchedListener( + callback: () => void + ): EmitterSubscription { return this.emitter.addListener('RNN.AppLaunched', callback); } - public registerComponentDidAppearListener(callback: (event: ComponentDidAppearEvent) => void): EmitterSubscription { + public registerComponentDidAppearListener( + callback: (event: ComponentDidAppearEvent) => void + ): EmitterSubscription { return this.emitter.addListener('RNN.ComponentDidAppear', callback); } - public registerComponentDidDisappearListener(callback: (event: ComponentDidDisappearEvent) => void): EmitterSubscription { + public registerComponentDidDisappearListener( + callback: (event: ComponentDidDisappearEvent) => void + ): EmitterSubscription { return this.emitter.addListener('RNN.ComponentDidDisappear', callback); } - public registerNavigationButtonPressedListener(callback: (event: NavigationButtonPressedEvent) => void): EmitterSubscription { + public registerNavigationButtonPressedListener( + callback: (event: NavigationButtonPressedEvent) => void + ): EmitterSubscription { return this.emitter.addListener('RNN.NavigationButtonPressed', callback); } - public registerModalDismissedListener(callback: (event: ModalDismissedEvent) => void): EmitterSubscription { + public registerBottomTabPressedListener( + callback: (data: BottomTabPressedEvent) => void + ): EmitterSubscription { + return this.emitter.addListener('RNN.BottomTabPressed', callback); + } + + public registerModalDismissedListener( + callback: (event: ModalDismissedEvent) => void + ): EmitterSubscription { return this.emitter.addListener('RNN.ModalDismissed', callback); } - public registerModalAttemptedToDismissListener(callback: (event: ModalAttemptedToDismissEvent) => void): EmitterSubscription { + public registerModalAttemptedToDismissListener( + callback: (event: ModalAttemptedToDismissEvent) => void + ): EmitterSubscription { return this.emitter.addListener('RNN.ModalAttemptedToDismiss', callback); } - public registerSearchBarUpdatedListener(callback: (event: SearchBarUpdatedEvent) => void): EmitterSubscription { + public registerSearchBarUpdatedListener( + callback: (event: SearchBarUpdatedEvent) => void + ): EmitterSubscription { return this.emitter.addListener('RNN.SearchBarUpdated', callback); } - public registerSearchBarCancelPressedListener(callback: (event: SearchBarCancelPressedEvent) => void): EmitterSubscription { + public registerSearchBarCancelPressedListener( + callback: (event: SearchBarCancelPressedEvent) => void + ): EmitterSubscription { return this.emitter.addListener('RNN.SearchBarCancelPressed', callback); } - public registerPreviewCompletedListener(callback: (event: PreviewCompletedEvent) => void): EmitterSubscription { + public registerPreviewCompletedListener( + callback: (event: PreviewCompletedEvent) => void + ): EmitterSubscription { return this.emitter.addListener('RNN.PreviewCompleted', callback); } - public registerCommandCompletedListener(callback: (data: CommandCompletedEvent) => void): EmitterSubscription { + public registerCommandCompletedListener( + callback: (data: CommandCompletedEvent) => void + ): EmitterSubscription { return this.emitter.addListener('RNN.CommandCompleted', callback); } - public registerBottomTabSelectedListener(callback: (data: BottomTabSelectedEvent) => void): EmitterSubscription { + public registerBottomTabSelectedListener( + callback: (data: BottomTabSelectedEvent) => void + ): EmitterSubscription { return this.emitter.addListener('RNN.BottomTabSelected', callback); } - public registerBottomTabLongPressedListener(callback: (data: BottomTabLongPressedEvent) => void): EmitterSubscription { + public registerBottomTabLongPressedListener( + callback: (data: BottomTabLongPressedEvent) => void + ): EmitterSubscription { return this.emitter.addListener('RNN.BottomTabLongPressed', callback); } - public registerScreenPoppedListener(callback: (event: ScreenPoppedEvent) => void): EmitterSubscription { + public registerScreenPoppedListener( + callback: (event: ScreenPoppedEvent) => void + ): EmitterSubscription { return this.emitter.addListener('RNN.ScreenPopped', callback); } } diff --git a/lib/src/events/EventsRegistry.ts b/lib/src/events/EventsRegistry.ts index b5efe2ce16e..81bff723df7 100644 --- a/lib/src/events/EventsRegistry.ts +++ b/lib/src/events/EventsRegistry.ts @@ -15,69 +15,128 @@ import { ScreenPoppedEvent, ModalAttemptedToDismissEvent } from '../interfaces/ComponentEvents'; -import { CommandCompletedEvent, BottomTabSelectedEvent, BottomTabLongPressedEvent } from '../interfaces/Events'; +import { + CommandCompletedEvent, + BottomTabSelectedEvent, + BottomTabLongPressedEvent, + BottomTabPressedEvent +} from '../interfaces/Events'; export class EventsRegistry { - constructor(private nativeEventsReceiver: NativeEventsReceiver, private commandsObserver: CommandsObserver, private componentEventsObserver: ComponentEventsObserver) { } - - public registerAppLaunchedListener(callback: () => void): EmitterSubscription { + constructor( + private nativeEventsReceiver: NativeEventsReceiver, + private commandsObserver: CommandsObserver, + private componentEventsObserver: ComponentEventsObserver + ) {} + + public registerAppLaunchedListener( + callback: () => void + ): EmitterSubscription { return this.nativeEventsReceiver.registerAppLaunchedListener(callback); } - public registerComponentDidAppearListener(callback: (event: ComponentDidAppearEvent) => void): EmitterSubscription { - return this.nativeEventsReceiver.registerComponentDidAppearListener(callback); + public registerComponentDidAppearListener( + callback: (event: ComponentDidAppearEvent) => void + ): EmitterSubscription { + return this.nativeEventsReceiver.registerComponentDidAppearListener( + callback + ); } - public registerComponentDidDisappearListener(callback: (event: ComponentDidDisappearEvent) => void): EmitterSubscription { - return this.nativeEventsReceiver.registerComponentDidDisappearListener(callback); + public registerComponentDidDisappearListener( + callback: (event: ComponentDidDisappearEvent) => void + ): EmitterSubscription { + return this.nativeEventsReceiver.registerComponentDidDisappearListener( + callback + ); } - public registerCommandCompletedListener(callback: (event: CommandCompletedEvent) => void): EmitterSubscription { + public registerCommandCompletedListener( + callback: (event: CommandCompletedEvent) => void + ): EmitterSubscription { return this.nativeEventsReceiver.registerCommandCompletedListener(callback); } - public registerBottomTabSelectedListener(callback: (event: BottomTabSelectedEvent) => void): EmitterSubscription { - return this.nativeEventsReceiver.registerBottomTabSelectedListener(callback); + public registerBottomTabSelectedListener( + callback: (event: BottomTabSelectedEvent) => void + ): EmitterSubscription { + return this.nativeEventsReceiver.registerBottomTabSelectedListener( + callback + ); } - public registerBottomTabLongPressedListener(callback: (event: BottomTabLongPressedEvent) => void): EmitterSubscription { - return this.nativeEventsReceiver.registerBottomTabLongPressedListener(callback); + public registerBottomTabPressedListener( + callback: (event: BottomTabPressedEvent) => void + ): EmitterSubscription { + return this.nativeEventsReceiver.registerBottomTabPressedListener(callback); } - public registerNavigationButtonPressedListener(callback: (event: NavigationButtonPressedEvent) => void): EmitterSubscription { - return this.nativeEventsReceiver.registerNavigationButtonPressedListener(callback); + public registerBottomTabLongPressedListener( + callback: (event: BottomTabLongPressedEvent) => void + ): EmitterSubscription { + return this.nativeEventsReceiver.registerBottomTabLongPressedListener( + callback + ); } - public registerModalDismissedListener(callback: (event: ModalDismissedEvent) => void): EmitterSubscription { + public registerNavigationButtonPressedListener( + callback: (event: NavigationButtonPressedEvent) => void + ): EmitterSubscription { + return this.nativeEventsReceiver.registerNavigationButtonPressedListener( + callback + ); + } + + public registerModalDismissedListener( + callback: (event: ModalDismissedEvent) => void + ): EmitterSubscription { return this.nativeEventsReceiver.registerModalDismissedListener(callback); } - public registerModalAttemptedToDismissListener(callback: (event: ModalAttemptedToDismissEvent) => void): EmitterSubscription { - return this.nativeEventsReceiver.registerModalAttemptedToDismissListener(callback); + public registerModalAttemptedToDismissListener( + callback: (event: ModalAttemptedToDismissEvent) => void + ): EmitterSubscription { + return this.nativeEventsReceiver.registerModalAttemptedToDismissListener( + callback + ); } - public registerSearchBarUpdatedListener(callback: (event: SearchBarUpdatedEvent) => void): EmitterSubscription { + public registerSearchBarUpdatedListener( + callback: (event: SearchBarUpdatedEvent) => void + ): EmitterSubscription { return this.nativeEventsReceiver.registerSearchBarUpdatedListener(callback); } - public registerSearchBarCancelPressedListener(callback: (event: SearchBarCancelPressedEvent) => void): EmitterSubscription { - return this.nativeEventsReceiver.registerSearchBarCancelPressedListener(callback); + public registerSearchBarCancelPressedListener( + callback: (event: SearchBarCancelPressedEvent) => void + ): EmitterSubscription { + return this.nativeEventsReceiver.registerSearchBarCancelPressedListener( + callback + ); } - public registerPreviewCompletedListener(callback: (event: PreviewCompletedEvent) => void): EmitterSubscription { + public registerPreviewCompletedListener( + callback: (event: PreviewCompletedEvent) => void + ): EmitterSubscription { return this.nativeEventsReceiver.registerPreviewCompletedListener(callback); } - public registerCommandListener(callback: (name: string, params: any) => void): EventSubscription { + public registerCommandListener( + callback: (name: string, params: any) => void + ): EventSubscription { return this.commandsObserver.register(callback); } - public bindComponent(component: React.Component, componentId?: string): EventSubscription { + public bindComponent( + component: React.Component, + componentId?: string + ): EventSubscription { return this.componentEventsObserver.bindComponent(component, componentId); } - public registerScreenPoppedListener(callback: (event: ScreenPoppedEvent) => void): EmitterSubscription { + public registerScreenPoppedListener( + callback: (event: ScreenPoppedEvent) => void + ): EmitterSubscription { return this.nativeEventsReceiver.registerScreenPoppedListener(callback); } - } diff --git a/lib/src/interfaces/Events.ts b/lib/src/interfaces/Events.ts index 6da5adc0f90..26fe7feb358 100644 --- a/lib/src/interfaces/Events.ts +++ b/lib/src/interfaces/Events.ts @@ -13,3 +13,7 @@ export interface BottomTabSelectedEvent { export interface BottomTabLongPressedEvent { selectedTabIndex: number; } + +export interface BottomTabPressedEvent { + tabIndex: number; +} diff --git a/lib/src/interfaces/Options.ts b/lib/src/interfaces/Options.ts index 505e5c76f8e..d9d6b3b954b 100644 --- a/lib/src/interfaces/Options.ts +++ b/lib/src/interfaces/Options.ts @@ -3,15 +3,42 @@ import { ImageRequireSource, Insets } from 'react-native'; type Color = string; type FontFamily = string; -type FontWeight = 'regular' | 'bold' | 'thin' | 'ultraLight' | 'light' | 'medium' | 'semibold' | 'heavy' | 'black'; +type FontWeight = + | 'regular' + | 'bold' + | 'thin' + | 'ultraLight' + | 'light' + | 'medium' + | 'semibold' + | 'heavy' + | 'black'; type LayoutOrientation = 'portrait' | 'landscape'; type AndroidDensityNumber = number; -type SystemItemIcon = 'done' | 'cancel' | 'edit' - | 'save' | 'add' | 'flexibleSpace' | 'fixedSpace' - | 'compose' | 'reply' | 'action' | 'organize' - | 'bookmarks' | 'search' | 'refresh' | 'stop' - | 'camera' | 'trash' | 'play' | 'pause' - | 'rewind' | 'fastForward' | 'undo' | 'redo'; +type SystemItemIcon = + | 'done' + | 'cancel' + | 'edit' + | 'save' + | 'add' + | 'flexibleSpace' + | 'fixedSpace' + | 'compose' + | 'reply' + | 'action' + | 'organize' + | 'bookmarks' + | 'search' + | 'refresh' + | 'stop' + | 'camera' + | 'trash' + | 'play' + | 'pause' + | 'rewind' + | 'fastForward' + | 'undo' + | 'redo'; export interface OptionsSplitView { /** @@ -55,6 +82,11 @@ export interface OptionsStatusBar { * #### (Android specific) */ drawBehind?: boolean; + /** + * If it's set to false, pressing a tab won't select the tab + * instead it will emit a bottomTabPressedEvent + */ + selectTabOnPress?: boolean; } export interface OptionsLayout { @@ -280,8 +312,8 @@ export interface OptionsTopBarButton { */ icon?: ImageRequireSource; /** - * Set the button icon insets - */ + * Set the button icon insets + */ iconInsets?: IconInsets; /** * Set the button as a custom component @@ -536,7 +568,11 @@ export interface OptionsBottomTabs { * Control the text display mode below the tab icon * #### (Android specific) */ - titleDisplayMode?: 'alwaysShow' | 'showWhenActive' | 'alwaysHide' | 'showWhenActiveForce'; + titleDisplayMode?: + | 'alwaysShow' + | 'showWhenActive' + | 'alwaysHide' + | 'showWhenActiveForce'; /** * Set the elevation of the Bottom Tabs in dp * #### (Android specific) @@ -545,18 +581,18 @@ export interface OptionsBottomTabs { } export interface DotIndicatorOptions { - // default red - color?: Color; - // default 6 - size?: number; - // default false - visible?: boolean; + // default red + color?: Color; + // default 6 + size?: number; + // default false + visible?: boolean; } export type ImageResource = string; export interface OptionsBottomTab { - dotIndicator?: DotIndicatorOptions; + dotIndicator?: DotIndicatorOptions; /** * Set the text to display below the icon @@ -599,7 +635,7 @@ export interface OptionsBottomTab { * Set the text font family */ fontFamily?: FontFamily; - /** + /** * Set the font weight, ignore fontFamily and use the iOS system fonts instead * #### (iOS specific) */ diff --git a/playground/ios/Podfile.lock b/playground/ios/Podfile.lock index 0635fd80845..0c6de96fe03 100644 --- a/playground/ios/Podfile.lock +++ b/playground/ios/Podfile.lock @@ -220,7 +220,7 @@ PODS: - ReactCommon/jscallinvoker (= 0.61.4) - ReactNativeKeyboardTrackingView (5.6.1): - React - - ReactNativeNavigation (4.0.6): + - ReactNativeNavigation (4.6.0): - React - Yoga (1.14.0) @@ -258,7 +258,7 @@ DEPENDENCIES: - Yoga (from `../../node_modules/react-native/ReactCommon/yoga`) SPEC REPOS: - https://github.com/cocoapods/specs.git: + https://github.com/CocoaPods/Specs.git: - boost-for-react-native - OCMock @@ -346,9 +346,9 @@ SPEC CHECKSUMS: React-RCTVibration: 0f76400ee3cec6edb9c125da49fed279340d145a ReactCommon: a6a294e7028ed67b926d29551aa9394fd989c24c ReactNativeKeyboardTrackingView: a240a6a0dba852bb107109a7ec7e98b884055977 - ReactNativeNavigation: a04159cfe472aa4d9dd48d1185b4a2539b9dbbe2 + ReactNativeNavigation: fb74494c1b6f0abd36a17c7af40f804f77d3181f Yoga: ba3d99dbee6c15ea6bbe3783d1f0cb1ffb79af0f PODFILE CHECKSUM: 781f49751a12b13af3e83d5dfc4b122aa5770543 -COCOAPODS: 1.7.1 +COCOAPODS: 1.8.4 diff --git a/playground/src/app.js b/playground/src/app.js index 2df02f9db22..e6496b1fa8c 100644 --- a/playground/src/app.js +++ b/playground/src/app.js @@ -2,12 +2,12 @@ const { Navigation } = require('react-native-navigation'); const { registerScreens } = require('./screens'); const { Platform } = require('react-native'); -const { setDefaultOptions } = require('./commons/Options') +const { setDefaultOptions } = require('./commons/Options'); const testIDs = require('./testIDs'); const Screens = require('./screens/Screens'); if (Platform.OS === 'android') { - alert = (title) => { + alert = title => { Navigation.showOverlay({ component: { name: Screens.Alert, @@ -29,6 +29,24 @@ if (Platform.OS === 'android') { function start() { registerScreens(); + + Navigation.events().registerBottomTabPressedListener(({ tabIndex }) => { + if (tabIndex === 3) { + // Open modal + Navigation.showModal({ + stack: { + children: [ + { + component: { + name: 'TabModal' + } + } + ] + } + }); + } + }); + Navigation.events().registerAppLaunchedListener(async () => { setDefaultOptions(); @@ -89,6 +107,24 @@ function start() { } ] } + }, + { + stack: { + children: [ + { + component: { + name: 'TabModal', + options: { + bottomTab: { + icon: require('../img/navicon_add.png'), + text: 'Add', + selectTabOnPress: false + } + } + } + } + ] + } } ] } diff --git a/playground/src/screens/Screens.js b/playground/src/screens/Screens.js index c778b8be8b9..635ba8ebd7a 100644 --- a/playground/src/screens/Screens.js +++ b/playground/src/screens/Screens.js @@ -3,7 +3,7 @@ const SideMenuLeft = 'SideMenuLeft'; const SideMenuCenter = 'SideMenuCenter'; const SideMenuRight = 'SideMenuRight'; const StatusBarOptions = 'StatusBarOptions'; -const StatusBarFirstTab = 'StatusBarFirstTab' +const StatusBarFirstTab = 'StatusBarFirstTab'; module.exports = { Buttons: 'Buttons', @@ -44,14 +44,16 @@ module.exports = { }, StatusBar: { sideMenu: { - left: component(SideMenuLeft, + left: component( + SideMenuLeft, { statusBar: { drawBehind: true, translucent: true } }, - { marginTop: 20 }), + { marginTop: 20 } + ), center: stack(StatusBarOptions), right: component(SideMenuRight) } @@ -69,24 +71,26 @@ module.exports = { } }, left: component(SideMenuLeft), - center: stack(component(StatusBarFirstTab, { - statusBar: { - translucent: true, - drawBehind: true, - }, - topBar: { - drawBehind: true, - elevation: 0, - background: { - color: 'transparent' + center: stack( + component(StatusBarFirstTab, { + statusBar: { + translucent: true, + drawBehind: true + }, + topBar: { + drawBehind: true, + elevation: 0, + background: { + color: 'transparent' + } } - } - })) + }) + ) } }, { component: { - id: "Pushed.tab2", + id: 'Pushed.tab2', name: 'Pushed', options: { bottomTab: { @@ -106,5 +110,6 @@ module.exports = { Alert: 'Alert', Orientation: 'Orientation', OrientationDetect: 'OrientationDetect', - Search: 'Search' -} + Search: 'Search', + TabModal: 'TabModal' +}; diff --git a/playground/src/screens/index.js b/playground/src/screens/index.js index 51ff291c3e2..83de8a646d0 100644 --- a/playground/src/screens/index.js +++ b/playground/src/screens/index.js @@ -12,59 +12,150 @@ const Screens = require('./Screens'); function registerScreens() { Navigation.registerComponent(Screens.Alert, () => require('./Alert')); - Navigation.registerComponent(Screens.CocktailDetailsScreen, () => require('./sharedElementTransition/CocktailDetailsScreen')); - Navigation.registerComponent(Screens.CocktailsListScreen, () => require('./sharedElementTransition/CocktailsList')); - Navigation.registerComponent(Screens.EventsOverlay, () => require('./StaticLifecycleOverlay')); - Navigation.registerComponent(Screens.EventsScreen, () => require('./StaticEventsScreen')); - Navigation.registerComponent(Screens.ExternalComponent, () => require('./ExternalComponentScreen')); - Navigation.registerComponent(Screens.FirstBottomTabsScreen, () => require('./FirstBottomTabScreen')); - Navigation.registerComponent(Screens.FlatListScreen, () => require('./FlatListScreen')); - Navigation.registerComponent(Screens.Layouts, () => require('./LayoutsScreen')); - Navigation.registerComponent(Screens.Lifecycle, () => require('./LifecycleScreen')); - Navigation.registerComponent(Screens.Modal, () => require('./ModalScreen')) - Navigation.registerComponent(Screens.FullScreenModal, () => require('./FullScreenModalScreen')) - Navigation.registerComponent(Screens.Navigation, () => require('./NavigationScreen')); - Navigation.registerComponent(Screens.Options, () => require('./OptionsScreen')); - Navigation.registerComponent(Screens.Buttons, () => require('./ButtonsScreen')); - Navigation.registerComponent(Screens.Orientation, () => require('./OrientationScreen')); - Navigation.registerComponent(Screens.OrientationDetect, () => require('./OrientationDetectScreen')); - Navigation.registerComponent(Screens.Overlay, () => require('./OverlayScreen')); - Navigation.registerComponent(Screens.OverlayAlert, () => require('./OverlayAlert')); + Navigation.registerComponent(Screens.CocktailDetailsScreen, () => + require('./sharedElementTransition/CocktailDetailsScreen') + ); + Navigation.registerComponent(Screens.CocktailsListScreen, () => + require('./sharedElementTransition/CocktailsList') + ); + Navigation.registerComponent(Screens.EventsOverlay, () => + require('./StaticLifecycleOverlay') + ); + Navigation.registerComponent(Screens.EventsScreen, () => + require('./StaticEventsScreen') + ); + Navigation.registerComponent(Screens.ExternalComponent, () => + require('./ExternalComponentScreen') + ); + Navigation.registerComponent(Screens.FirstBottomTabsScreen, () => + require('./FirstBottomTabScreen') + ); + Navigation.registerComponent(Screens.FlatListScreen, () => + require('./FlatListScreen') + ); + Navigation.registerComponent(Screens.Layouts, () => + require('./LayoutsScreen') + ); + Navigation.registerComponent(Screens.Lifecycle, () => + require('./LifecycleScreen') + ); + Navigation.registerComponent(Screens.Modal, () => require('./ModalScreen')); + Navigation.registerComponent(Screens.TabModal, () => + require('./ModalScreen') + ); + Navigation.registerComponent(Screens.FullScreenModal, () => + require('./FullScreenModalScreen') + ); + Navigation.registerComponent(Screens.Navigation, () => + require('./NavigationScreen') + ); + Navigation.registerComponent(Screens.Options, () => + require('./OptionsScreen') + ); + Navigation.registerComponent(Screens.Buttons, () => + require('./ButtonsScreen') + ); + Navigation.registerComponent(Screens.Orientation, () => + require('./OrientationScreen') + ); + Navigation.registerComponent(Screens.OrientationDetect, () => + require('./OrientationDetectScreen') + ); + Navigation.registerComponent(Screens.Overlay, () => + require('./OverlayScreen') + ); + Navigation.registerComponent(Screens.OverlayAlert, () => + require('./OverlayAlert') + ); Navigation.registerComponent(Screens.Pushed, () => require('./PushedScreen')); - Navigation.registerComponent(Screens.ScrollViewOverlay, () => require('./ScrollViewOverlay')); - Navigation.registerComponent(Screens.LifecycleButton, () => require('./LifecycleButton')); - Navigation.registerComponent(Screens.ReactTitleView, () => require('./CustomTopBar')); - Navigation.registerComponent(Screens.RoundButton, () => require('./RoundedButton')); - Navigation.registerComponent(Screens.ScrollViewOverlay, () => require('./ScrollViewOverlay')); - Navigation.registerComponent(Screens.SecondBottomTabsScreen, () => require('./SecondBottomTabScreen')); + Navigation.registerComponent(Screens.ScrollViewOverlay, () => + require('./ScrollViewOverlay') + ); + Navigation.registerComponent(Screens.LifecycleButton, () => + require('./LifecycleButton') + ); + Navigation.registerComponent(Screens.ReactTitleView, () => + require('./CustomTopBar') + ); + Navigation.registerComponent(Screens.RoundButton, () => + require('./RoundedButton') + ); + Navigation.registerComponent(Screens.ScrollViewOverlay, () => + require('./ScrollViewOverlay') + ); + Navigation.registerComponent(Screens.SecondBottomTabsScreen, () => + require('./SecondBottomTabScreen') + ); Navigation.registerComponent(Screens.Search, () => require('./SearchScreen')); - Navigation.registerComponent(Screens.SetRoot, () => require('./SetRootScreen')) - Navigation.registerComponent(Screens.SideMenuCenter, () => require('./SideMenuCenterScreen')); - Navigation.registerComponent(Screens.SideMenuLeft, () => require('./SideMenuLeftScreen')); - Navigation.registerComponent(Screens.SideMenuRight, () => require('./SideMenuRightScreen')); + Navigation.registerComponent(Screens.SetRoot, () => + require('./SetRootScreen') + ); + Navigation.registerComponent(Screens.SideMenuCenter, () => + require('./SideMenuCenterScreen') + ); + Navigation.registerComponent(Screens.SideMenuLeft, () => + require('./SideMenuLeftScreen') + ); + Navigation.registerComponent(Screens.SideMenuRight, () => + require('./SideMenuRightScreen') + ); Navigation.registerComponent(Screens.Stack, () => require('./StackScreen')); - Navigation.registerComponent(Screens.StatusBarOptions, () => require('./StatusBarOptionsScreen')); - Navigation.registerComponent(Screens.StatusBarFirstTab, () => require('./StatusBarFirstTab')); - Navigation.registerComponent(Screens.TopBarBackground, () => require('../components/TopBarBackground')); + Navigation.registerComponent(Screens.StatusBarOptions, () => + require('./StatusBarOptionsScreen') + ); + Navigation.registerComponent(Screens.StatusBarFirstTab, () => + require('./StatusBarFirstTab') + ); + Navigation.registerComponent(Screens.TopBarBackground, () => + require('../components/TopBarBackground') + ); const { ContextProvider } = require('../context'); const ContextScreen = require('./ContextScreen'); - Navigation.registerComponent(Screens.ContextScreen, () => (props) => - - - , - () => ContextScreen); + Navigation.registerComponent( + Screens.ContextScreen, + () => props => ( + + + + ), + () => ContextScreen + ); - Navigation.registerComponent(`navigation.playground.CustomTransitionDestination`, () => CustomTransitionDestination); - Navigation.registerComponent(`navigation.playground.CustomTransitionOrigin`, () => CustomTransitionOrigin); - Navigation.registerComponent(`navigation.playground.ScrollViewScreen`, () => ScrollViewScreen); + Navigation.registerComponent( + `navigation.playground.CustomTransitionDestination`, + () => CustomTransitionDestination + ); + Navigation.registerComponent( + `navigation.playground.CustomTransitionOrigin`, + () => CustomTransitionOrigin + ); + Navigation.registerComponent( + `navigation.playground.ScrollViewScreen`, + () => ScrollViewScreen + ); - Navigation.registerComponent('navigation.playground.CustomDialog', () => CustomDialog); - Navigation.registerComponent('navigation.playground.CustomDialogWithScroll', () => CustomDialogWithScroll); - Navigation.registerComponent('navigation.playground.TopTabScreen', () => TopTabScreen); - Navigation.registerComponent('navigation.playground.TopTabOptionsScreen', () => TopTabOptionsScreen); + Navigation.registerComponent( + 'navigation.playground.CustomDialog', + () => CustomDialog + ); + Navigation.registerComponent( + 'navigation.playground.CustomDialogWithScroll', + () => CustomDialogWithScroll + ); + Navigation.registerComponent( + 'navigation.playground.TopTabScreen', + () => TopTabScreen + ); + Navigation.registerComponent( + 'navigation.playground.TopTabOptionsScreen', + () => TopTabOptionsScreen + ); Navigation.registerComponent('CustomTextButton', () => CustomTextButton); - Navigation.registerComponent('navigation.playground.KeyboardScreen', () => KeyboardScreen); + Navigation.registerComponent( + 'navigation.playground.KeyboardScreen', + () => KeyboardScreen + ); } module.exports = { From 588ff5e013ea0186dffa161ffe3dea1a5beb850f Mon Sep 17 00:00:00 2001 From: Pontus Abrahamsson Date: Mon, 27 Jan 2020 20:17:10 +0100 Subject: [PATCH 2/3] Open modal from tab Android --- .../parse/BottomTabOptions.java | 5 +++++ .../react/events/EventEmitter.java | 7 +++++++ .../bottomtabs/BottomTabsController.java | 16 ++++++++++++---- 3 files changed, 24 insertions(+), 4 deletions(-) diff --git a/lib/android/app/src/main/java/com/reactnativenavigation/parse/BottomTabOptions.java b/lib/android/app/src/main/java/com/reactnativenavigation/parse/BottomTabOptions.java index 1aa1fb01e9f..b52907f4db4 100644 --- a/lib/android/app/src/main/java/com/reactnativenavigation/parse/BottomTabOptions.java +++ b/lib/android/app/src/main/java/com/reactnativenavigation/parse/BottomTabOptions.java @@ -42,6 +42,8 @@ public static BottomTabOptions parse(TypefaceLoader typefaceManager, JSONObject options.fontSize = NumberParser.parse(json, "fontSize"); options.selectedFontSize = NumberParser.parse(json, "selectedFontSize"); options.dotIndicator = DotIndicatorOptions.parse(json.optJSONObject("dotIndicator")); + options.selectTabOnPress = BoolParser.parse(json, "selectTabOnPress"); + return options; } @@ -59,6 +61,7 @@ public static BottomTabOptions parse(TypefaceLoader typefaceManager, JSONObject public DotIndicatorOptions dotIndicator = new DotIndicatorOptions(); public Number fontSize = new NullNumber(); public Number selectedFontSize = new NullNumber(); + public Bool selectTabOnPress = new NullBool(); @Nullable public Typeface fontFamily; @@ -78,6 +81,7 @@ void mergeWith(final BottomTabOptions other) { if (other.selectedFontSize.hasValue()) selectedFontSize = other.selectedFontSize; if (other.fontFamily != null) fontFamily = other.fontFamily; if (other.dotIndicator.hasValue()) dotIndicator = other.dotIndicator; + if (other.selectTabOnPress.hasValue()) selectTabOnPress = other.selectTabOnPress; } void mergeWithDefault(final BottomTabOptions defaultOptions) { @@ -96,5 +100,6 @@ void mergeWithDefault(final BottomTabOptions defaultOptions) { if (fontFamily == null) fontFamily = defaultOptions.fontFamily; if (!testId.hasValue()) testId = defaultOptions.testId; if (!dotIndicator.hasValue()) dotIndicator = defaultOptions.dotIndicator; + if (!selectTabOnPress.hasValue()) selectTabOnPress = defaultOptions.selectTabOnPress; } } diff --git a/lib/android/app/src/main/java/com/reactnativenavigation/react/events/EventEmitter.java b/lib/android/app/src/main/java/com/reactnativenavigation/react/events/EventEmitter.java index f46b418784c..fafca6078f3 100644 --- a/lib/android/app/src/main/java/com/reactnativenavigation/react/events/EventEmitter.java +++ b/lib/android/app/src/main/java/com/reactnativenavigation/react/events/EventEmitter.java @@ -15,6 +15,7 @@ public class EventEmitter { private static final String AppLaunched = "RNN.AppLaunched"; private static final String CommandCompleted = "RNN.CommandCompleted"; private static final String BottomTabSelected = "RNN.BottomTabSelected"; + private static final String BottomTabPressed = "RNN.BottomTabPressed"; private static final String ComponentDidAppear = "RNN.ComponentDidAppear"; private static final String ComponentDidDisappear = "RNN.ComponentDidDisappear"; private static final String NavigationButtonPressed = "RNN.NavigationButtonPressed"; @@ -61,6 +62,12 @@ public void emitBottomTabSelected(int unselectedTabIndex, int selectedTabIndex) emit(BottomTabSelected, event); } + public void emitBottomTabPressed(int tabIndex) { + WritableMap event = Arguments.createMap(); + event.putInt("tabIndex", tabIndex); + emit(BottomTabPressed, event); + } + public void emitCommandCompleted(String commandName, String commandId, long completionTime) { WritableMap event = Arguments.createMap(); event.putString("commandName", commandName); diff --git a/lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/bottomtabs/BottomTabsController.java b/lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/bottomtabs/BottomTabsController.java index e0b1afd6e28..80e98d4be04 100644 --- a/lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/bottomtabs/BottomTabsController.java +++ b/lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/bottomtabs/BottomTabsController.java @@ -144,10 +144,18 @@ protected ViewController getCurrentChild() { @Override public boolean onTabSelected(int index, boolean wasSelected) { - eventEmitter.emitBottomTabSelected(bottomTabs.getCurrentItem(), index); - if (wasSelected) return false; - selectTab(index); - return false; + BottomTabOptions options = tabs.get(index).resolveCurrentOptions().bottomTabOptions; + + eventEmitter.emitBottomTabPressed(index); + + if (options.selectTabOnPress.get(true)){ + eventEmitter.emitBottomTabSelected(bottomTabs.getCurrentItem(), index); + if (wasSelected) return false; + selectTab(index); + return false; + } else { + return false; + } } private List createTabs() { From 92cc982b82fd6af02ff4828fb494ce457cb8d213 Mon Sep 17 00:00:00 2001 From: yogevbd Date: Tue, 28 Jan 2020 10:54:51 +0200 Subject: [PATCH 3/3] Remove playground changes --- playground/src/app.js | 40 +------ playground/src/screens/Screens.js | 41 +++---- playground/src/screens/index.js | 179 ++++++++---------------------- 3 files changed, 64 insertions(+), 196 deletions(-) diff --git a/playground/src/app.js b/playground/src/app.js index e6496b1fa8c..2df02f9db22 100644 --- a/playground/src/app.js +++ b/playground/src/app.js @@ -2,12 +2,12 @@ const { Navigation } = require('react-native-navigation'); const { registerScreens } = require('./screens'); const { Platform } = require('react-native'); -const { setDefaultOptions } = require('./commons/Options'); +const { setDefaultOptions } = require('./commons/Options') const testIDs = require('./testIDs'); const Screens = require('./screens/Screens'); if (Platform.OS === 'android') { - alert = title => { + alert = (title) => { Navigation.showOverlay({ component: { name: Screens.Alert, @@ -29,24 +29,6 @@ if (Platform.OS === 'android') { function start() { registerScreens(); - - Navigation.events().registerBottomTabPressedListener(({ tabIndex }) => { - if (tabIndex === 3) { - // Open modal - Navigation.showModal({ - stack: { - children: [ - { - component: { - name: 'TabModal' - } - } - ] - } - }); - } - }); - Navigation.events().registerAppLaunchedListener(async () => { setDefaultOptions(); @@ -107,24 +89,6 @@ function start() { } ] } - }, - { - stack: { - children: [ - { - component: { - name: 'TabModal', - options: { - bottomTab: { - icon: require('../img/navicon_add.png'), - text: 'Add', - selectTabOnPress: false - } - } - } - } - ] - } } ] } diff --git a/playground/src/screens/Screens.js b/playground/src/screens/Screens.js index 635ba8ebd7a..c778b8be8b9 100644 --- a/playground/src/screens/Screens.js +++ b/playground/src/screens/Screens.js @@ -3,7 +3,7 @@ const SideMenuLeft = 'SideMenuLeft'; const SideMenuCenter = 'SideMenuCenter'; const SideMenuRight = 'SideMenuRight'; const StatusBarOptions = 'StatusBarOptions'; -const StatusBarFirstTab = 'StatusBarFirstTab'; +const StatusBarFirstTab = 'StatusBarFirstTab' module.exports = { Buttons: 'Buttons', @@ -44,16 +44,14 @@ module.exports = { }, StatusBar: { sideMenu: { - left: component( - SideMenuLeft, + left: component(SideMenuLeft, { statusBar: { drawBehind: true, translucent: true } }, - { marginTop: 20 } - ), + { marginTop: 20 }), center: stack(StatusBarOptions), right: component(SideMenuRight) } @@ -71,26 +69,24 @@ module.exports = { } }, left: component(SideMenuLeft), - center: stack( - component(StatusBarFirstTab, { - statusBar: { - translucent: true, - drawBehind: true - }, - topBar: { - drawBehind: true, - elevation: 0, - background: { - color: 'transparent' - } + center: stack(component(StatusBarFirstTab, { + statusBar: { + translucent: true, + drawBehind: true, + }, + topBar: { + drawBehind: true, + elevation: 0, + background: { + color: 'transparent' } - }) - ) + } + })) } }, { component: { - id: 'Pushed.tab2', + id: "Pushed.tab2", name: 'Pushed', options: { bottomTab: { @@ -110,6 +106,5 @@ module.exports = { Alert: 'Alert', Orientation: 'Orientation', OrientationDetect: 'OrientationDetect', - Search: 'Search', - TabModal: 'TabModal' -}; + Search: 'Search' +} diff --git a/playground/src/screens/index.js b/playground/src/screens/index.js index 83de8a646d0..51ff291c3e2 100644 --- a/playground/src/screens/index.js +++ b/playground/src/screens/index.js @@ -12,150 +12,59 @@ const Screens = require('./Screens'); function registerScreens() { Navigation.registerComponent(Screens.Alert, () => require('./Alert')); - Navigation.registerComponent(Screens.CocktailDetailsScreen, () => - require('./sharedElementTransition/CocktailDetailsScreen') - ); - Navigation.registerComponent(Screens.CocktailsListScreen, () => - require('./sharedElementTransition/CocktailsList') - ); - Navigation.registerComponent(Screens.EventsOverlay, () => - require('./StaticLifecycleOverlay') - ); - Navigation.registerComponent(Screens.EventsScreen, () => - require('./StaticEventsScreen') - ); - Navigation.registerComponent(Screens.ExternalComponent, () => - require('./ExternalComponentScreen') - ); - Navigation.registerComponent(Screens.FirstBottomTabsScreen, () => - require('./FirstBottomTabScreen') - ); - Navigation.registerComponent(Screens.FlatListScreen, () => - require('./FlatListScreen') - ); - Navigation.registerComponent(Screens.Layouts, () => - require('./LayoutsScreen') - ); - Navigation.registerComponent(Screens.Lifecycle, () => - require('./LifecycleScreen') - ); - Navigation.registerComponent(Screens.Modal, () => require('./ModalScreen')); - Navigation.registerComponent(Screens.TabModal, () => - require('./ModalScreen') - ); - Navigation.registerComponent(Screens.FullScreenModal, () => - require('./FullScreenModalScreen') - ); - Navigation.registerComponent(Screens.Navigation, () => - require('./NavigationScreen') - ); - Navigation.registerComponent(Screens.Options, () => - require('./OptionsScreen') - ); - Navigation.registerComponent(Screens.Buttons, () => - require('./ButtonsScreen') - ); - Navigation.registerComponent(Screens.Orientation, () => - require('./OrientationScreen') - ); - Navigation.registerComponent(Screens.OrientationDetect, () => - require('./OrientationDetectScreen') - ); - Navigation.registerComponent(Screens.Overlay, () => - require('./OverlayScreen') - ); - Navigation.registerComponent(Screens.OverlayAlert, () => - require('./OverlayAlert') - ); + Navigation.registerComponent(Screens.CocktailDetailsScreen, () => require('./sharedElementTransition/CocktailDetailsScreen')); + Navigation.registerComponent(Screens.CocktailsListScreen, () => require('./sharedElementTransition/CocktailsList')); + Navigation.registerComponent(Screens.EventsOverlay, () => require('./StaticLifecycleOverlay')); + Navigation.registerComponent(Screens.EventsScreen, () => require('./StaticEventsScreen')); + Navigation.registerComponent(Screens.ExternalComponent, () => require('./ExternalComponentScreen')); + Navigation.registerComponent(Screens.FirstBottomTabsScreen, () => require('./FirstBottomTabScreen')); + Navigation.registerComponent(Screens.FlatListScreen, () => require('./FlatListScreen')); + Navigation.registerComponent(Screens.Layouts, () => require('./LayoutsScreen')); + Navigation.registerComponent(Screens.Lifecycle, () => require('./LifecycleScreen')); + Navigation.registerComponent(Screens.Modal, () => require('./ModalScreen')) + Navigation.registerComponent(Screens.FullScreenModal, () => require('./FullScreenModalScreen')) + Navigation.registerComponent(Screens.Navigation, () => require('./NavigationScreen')); + Navigation.registerComponent(Screens.Options, () => require('./OptionsScreen')); + Navigation.registerComponent(Screens.Buttons, () => require('./ButtonsScreen')); + Navigation.registerComponent(Screens.Orientation, () => require('./OrientationScreen')); + Navigation.registerComponent(Screens.OrientationDetect, () => require('./OrientationDetectScreen')); + Navigation.registerComponent(Screens.Overlay, () => require('./OverlayScreen')); + Navigation.registerComponent(Screens.OverlayAlert, () => require('./OverlayAlert')); Navigation.registerComponent(Screens.Pushed, () => require('./PushedScreen')); - Navigation.registerComponent(Screens.ScrollViewOverlay, () => - require('./ScrollViewOverlay') - ); - Navigation.registerComponent(Screens.LifecycleButton, () => - require('./LifecycleButton') - ); - Navigation.registerComponent(Screens.ReactTitleView, () => - require('./CustomTopBar') - ); - Navigation.registerComponent(Screens.RoundButton, () => - require('./RoundedButton') - ); - Navigation.registerComponent(Screens.ScrollViewOverlay, () => - require('./ScrollViewOverlay') - ); - Navigation.registerComponent(Screens.SecondBottomTabsScreen, () => - require('./SecondBottomTabScreen') - ); + Navigation.registerComponent(Screens.ScrollViewOverlay, () => require('./ScrollViewOverlay')); + Navigation.registerComponent(Screens.LifecycleButton, () => require('./LifecycleButton')); + Navigation.registerComponent(Screens.ReactTitleView, () => require('./CustomTopBar')); + Navigation.registerComponent(Screens.RoundButton, () => require('./RoundedButton')); + Navigation.registerComponent(Screens.ScrollViewOverlay, () => require('./ScrollViewOverlay')); + Navigation.registerComponent(Screens.SecondBottomTabsScreen, () => require('./SecondBottomTabScreen')); Navigation.registerComponent(Screens.Search, () => require('./SearchScreen')); - Navigation.registerComponent(Screens.SetRoot, () => - require('./SetRootScreen') - ); - Navigation.registerComponent(Screens.SideMenuCenter, () => - require('./SideMenuCenterScreen') - ); - Navigation.registerComponent(Screens.SideMenuLeft, () => - require('./SideMenuLeftScreen') - ); - Navigation.registerComponent(Screens.SideMenuRight, () => - require('./SideMenuRightScreen') - ); + Navigation.registerComponent(Screens.SetRoot, () => require('./SetRootScreen')) + Navigation.registerComponent(Screens.SideMenuCenter, () => require('./SideMenuCenterScreen')); + Navigation.registerComponent(Screens.SideMenuLeft, () => require('./SideMenuLeftScreen')); + Navigation.registerComponent(Screens.SideMenuRight, () => require('./SideMenuRightScreen')); Navigation.registerComponent(Screens.Stack, () => require('./StackScreen')); - Navigation.registerComponent(Screens.StatusBarOptions, () => - require('./StatusBarOptionsScreen') - ); - Navigation.registerComponent(Screens.StatusBarFirstTab, () => - require('./StatusBarFirstTab') - ); - Navigation.registerComponent(Screens.TopBarBackground, () => - require('../components/TopBarBackground') - ); + Navigation.registerComponent(Screens.StatusBarOptions, () => require('./StatusBarOptionsScreen')); + Navigation.registerComponent(Screens.StatusBarFirstTab, () => require('./StatusBarFirstTab')); + Navigation.registerComponent(Screens.TopBarBackground, () => require('../components/TopBarBackground')); const { ContextProvider } = require('../context'); const ContextScreen = require('./ContextScreen'); - Navigation.registerComponent( - Screens.ContextScreen, - () => props => ( - - - - ), - () => ContextScreen - ); + Navigation.registerComponent(Screens.ContextScreen, () => (props) => + + + , + () => ContextScreen); - Navigation.registerComponent( - `navigation.playground.CustomTransitionDestination`, - () => CustomTransitionDestination - ); - Navigation.registerComponent( - `navigation.playground.CustomTransitionOrigin`, - () => CustomTransitionOrigin - ); - Navigation.registerComponent( - `navigation.playground.ScrollViewScreen`, - () => ScrollViewScreen - ); + Navigation.registerComponent(`navigation.playground.CustomTransitionDestination`, () => CustomTransitionDestination); + Navigation.registerComponent(`navigation.playground.CustomTransitionOrigin`, () => CustomTransitionOrigin); + Navigation.registerComponent(`navigation.playground.ScrollViewScreen`, () => ScrollViewScreen); - Navigation.registerComponent( - 'navigation.playground.CustomDialog', - () => CustomDialog - ); - Navigation.registerComponent( - 'navigation.playground.CustomDialogWithScroll', - () => CustomDialogWithScroll - ); - Navigation.registerComponent( - 'navigation.playground.TopTabScreen', - () => TopTabScreen - ); - Navigation.registerComponent( - 'navigation.playground.TopTabOptionsScreen', - () => TopTabOptionsScreen - ); + Navigation.registerComponent('navigation.playground.CustomDialog', () => CustomDialog); + Navigation.registerComponent('navigation.playground.CustomDialogWithScroll', () => CustomDialogWithScroll); + Navigation.registerComponent('navigation.playground.TopTabScreen', () => TopTabScreen); + Navigation.registerComponent('navigation.playground.TopTabOptionsScreen', () => TopTabOptionsScreen); Navigation.registerComponent('CustomTextButton', () => CustomTextButton); - Navigation.registerComponent( - 'navigation.playground.KeyboardScreen', - () => KeyboardScreen - ); + Navigation.registerComponent('navigation.playground.KeyboardScreen', () => KeyboardScreen); } module.exports = {