react-native-navigation的迁移库

Navigation.ts 7.4KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215
  1. import isArray from 'lodash/isArray';
  2. import { NativeCommandsSender } from './adapters/NativeCommandsSender';
  3. import { NativeEventsReceiver } from './adapters/NativeEventsReceiver';
  4. import { UniqueIdProvider } from './adapters/UniqueIdProvider';
  5. import { Store } from './components/Store';
  6. import { ComponentRegistry } from './components/ComponentRegistry';
  7. import { Commands } from './commands/Commands';
  8. import { LayoutTreeParser } from './commands/LayoutTreeParser';
  9. import { LayoutTreeCrawler } from './commands/LayoutTreeCrawler';
  10. import { EventsRegistry } from './events/EventsRegistry';
  11. import { ComponentProvider } from 'react-native';
  12. import { SharedElement } from './adapters/SharedElement';
  13. import { CommandsObserver } from './events/CommandsObserver';
  14. import { Constants, NavigationConstants } from './adapters/Constants';
  15. import { ComponentEventsObserver } from './events/ComponentEventsObserver';
  16. import { TouchablePreview } from './adapters/TouchablePreview';
  17. import { LayoutRoot, Layout } from './interfaces/Layout';
  18. import { Options } from './interfaces/Options';
  19. import { ComponentWrapper } from './components/ComponentWrapper';
  20. import { OptionsProcessor } from './commands/OptionsProcessor';
  21. import { ColorService } from './adapters/ColorService';
  22. import { AssetService } from './adapters/AssetResolver';
  23. import { AppRegistryService } from './adapters/AppRegistryService';
  24. export class NavigationRoot {
  25. public readonly Element = SharedElement;
  26. public readonly TouchablePreview = TouchablePreview;
  27. private readonly store: Store;
  28. private readonly nativeEventsReceiver: NativeEventsReceiver;
  29. private readonly uniqueIdProvider: UniqueIdProvider;
  30. private readonly componentRegistry: ComponentRegistry;
  31. private readonly layoutTreeParser: LayoutTreeParser;
  32. private readonly layoutTreeCrawler: LayoutTreeCrawler;
  33. private readonly nativeCommandsSender: NativeCommandsSender;
  34. private readonly commands: Commands;
  35. private readonly eventsRegistry: EventsRegistry;
  36. private readonly commandsObserver: CommandsObserver;
  37. private readonly componentEventsObserver: ComponentEventsObserver;
  38. private readonly componentWrapper: ComponentWrapper;
  39. constructor() {
  40. this.componentWrapper = new ComponentWrapper();
  41. this.store = new Store();
  42. this.nativeEventsReceiver = new NativeEventsReceiver();
  43. this.uniqueIdProvider = new UniqueIdProvider();
  44. this.componentEventsObserver = new ComponentEventsObserver(this.nativeEventsReceiver, this.store);
  45. const appRegistryService = new AppRegistryService();
  46. this.componentRegistry = new ComponentRegistry(
  47. this.store,
  48. this.componentEventsObserver,
  49. this.componentWrapper,
  50. appRegistryService
  51. );
  52. this.layoutTreeParser = new LayoutTreeParser(this.uniqueIdProvider);
  53. const optionsProcessor = new OptionsProcessor(this.store, this.uniqueIdProvider, new ColorService(), new AssetService());
  54. this.layoutTreeCrawler = new LayoutTreeCrawler(this.store, optionsProcessor);
  55. this.nativeCommandsSender = new NativeCommandsSender();
  56. this.commandsObserver = new CommandsObserver(this.uniqueIdProvider);
  57. this.commands = new Commands(
  58. this.store,
  59. this.nativeCommandsSender,
  60. this.layoutTreeParser,
  61. this.layoutTreeCrawler,
  62. this.commandsObserver,
  63. this.uniqueIdProvider,
  64. optionsProcessor
  65. );
  66. this.eventsRegistry = new EventsRegistry(this.nativeEventsReceiver, this.commandsObserver, this.componentEventsObserver);
  67. this.componentEventsObserver.registerOnceForAllComponentEvents();
  68. }
  69. /**
  70. * Every navigation component in your app must be registered with a unique name.
  71. * The component itself is a traditional React component extending React.Component.
  72. */
  73. public registerComponent(componentName: string | number, componentProvider: ComponentProvider, concreteComponentProvider?: ComponentProvider): ComponentProvider {
  74. return this.componentRegistry.registerComponent(componentName, componentProvider, concreteComponentProvider);
  75. }
  76. /**
  77. * Utility helper function like registerComponent,
  78. * wraps the provided component with a react-redux Provider with the passed redux store
  79. */
  80. public registerComponentWithRedux(
  81. componentName: string | number,
  82. getComponentClassFunc: ComponentProvider,
  83. ReduxProvider: any,
  84. reduxStore: any
  85. ): ComponentProvider {
  86. return this.componentRegistry.registerComponent(componentName, getComponentClassFunc, undefined, ReduxProvider, reduxStore);
  87. }
  88. /**
  89. * Reset the app to a new layout
  90. */
  91. public setRoot(layout: LayoutRoot): Promise<any> {
  92. return this.commands.setRoot(layout);
  93. }
  94. /**
  95. * Set default options to all screens. Useful for declaring a consistent style across the app.
  96. */
  97. public setDefaultOptions(options: Options): void {
  98. this.commands.setDefaultOptions(options);
  99. }
  100. /**
  101. * Change a component's navigation options
  102. */
  103. public mergeOptions(componentId: string, options: Options): void {
  104. this.commands.mergeOptions(componentId, options);
  105. }
  106. /**
  107. * Update a mounted component's props
  108. */
  109. public updateProps(componentId: string, props: object) {
  110. this.commands.updateProps(componentId, props);
  111. }
  112. /**
  113. * Show a screen as a modal.
  114. */
  115. public showModal<P>(layout: Layout<P>): Promise<any> {
  116. return this.commands.showModal(layout);
  117. }
  118. /**
  119. * Dismiss a modal by componentId. The dismissed modal can be anywhere in the stack.
  120. */
  121. public dismissModal(componentId: string, mergeOptions?: Options): Promise<any> {
  122. return this.commands.dismissModal(componentId, mergeOptions);
  123. }
  124. /**
  125. * Dismiss all Modals
  126. */
  127. public dismissAllModals(mergeOptions?: Options): Promise<any> {
  128. return this.commands.dismissAllModals(mergeOptions);
  129. }
  130. /**
  131. * Push a new layout into this screen's navigation stack.
  132. */
  133. public push<P>(componentId: string, layout: Layout<P>): Promise<any> {
  134. return this.commands.push(componentId, layout);
  135. }
  136. /**
  137. * Pop a component from the stack, regardless of it's position.
  138. */
  139. public pop(componentId: string, mergeOptions?: Options): Promise<any> {
  140. return this.commands.pop(componentId, mergeOptions);
  141. }
  142. /**
  143. * Pop the stack to a given component
  144. */
  145. public popTo(componentId: string, mergeOptions?: Options): Promise<any> {
  146. return this.commands.popTo(componentId, mergeOptions);
  147. }
  148. /**
  149. * Pop the component's stack to root.
  150. */
  151. public popToRoot(componentId: string, mergeOptions?: Options): Promise<any> {
  152. return this.commands.popToRoot(componentId, mergeOptions);
  153. }
  154. /**
  155. * Sets new root component to stack.
  156. */
  157. public setStackRoot<P>(componentId: string, layout: Layout<P> | Array<Layout<P>>): Promise<any> {
  158. const children: Layout[] = isArray(layout) ? layout : [layout];
  159. return this.commands.setStackRoot(componentId, children);
  160. }
  161. /**
  162. * Show overlay on top of the entire app
  163. */
  164. public showOverlay<P>(layout: Layout<P>): Promise<any> {
  165. return this.commands.showOverlay(layout);
  166. }
  167. /**
  168. * dismiss overlay by componentId
  169. */
  170. public dismissOverlay(componentId: string): Promise<any> {
  171. return this.commands.dismissOverlay(componentId);
  172. }
  173. /**
  174. * Resolves arguments passed on launch
  175. */
  176. public getLaunchArgs(): Promise<any> {
  177. return this.commands.getLaunchArgs();
  178. }
  179. /**
  180. * Obtain the events registry instance
  181. */
  182. public events(): EventsRegistry {
  183. return this.eventsRegistry;
  184. }
  185. /**
  186. * Constants coming from native
  187. */
  188. public async constants(): Promise<NavigationConstants> {
  189. return await Constants.get();
  190. }
  191. }