|
@@ -2,24 +2,40 @@
|
2
|
2
|
|
3
|
3
|
## onAppLaunched
|
4
|
4
|
|
5
|
|
-This event is called once the app is launched. Initialise the app with the layout you want. This creates the native layout hierarchy, loads the react components into the component by name, after which the app is ready for user interaction.
|
|
5
|
+Called once the app is launched. This event is used to set the Application's initial layout - after which the app is ready for user interaction.
|
6
|
6
|
|
7
|
7
|
```js
|
8
|
|
-Navigation.events().onAppLaunched(() => {
|
|
8
|
+Navigation.events().registerAppLaunchedListener(() => {
|
9
|
9
|
|
10
|
10
|
});
|
11
|
11
|
```
|
12
|
12
|
|
13
|
13
|
## componentDidAppear
|
|
14
|
+Called each time this component appears on screen (attached to the view heirarchy)
|
14
|
15
|
|
15
|
|
-Listen globally to all components `componentDidAppear` events
|
16
|
16
|
```js
|
17
|
|
-Navigation.events().componentDidAppear((componentId, componentName) => {
|
|
17
|
+class MyComponent extends Component {
|
|
18
|
+ componentDidAppear() {
|
|
19
|
+
|
|
20
|
+ }
|
|
21
|
+}
|
|
22
|
+```
|
|
23
|
+
|
|
24
|
+This event can be observed globally as well:
|
|
25
|
+
|
|
26
|
+```js
|
|
27
|
+Navigation.events().registerComponentDidAppearListener((componentId, componentName) => {
|
18
|
28
|
|
19
|
29
|
});
|
20
|
30
|
```
|
|
31
|
+| Parameter | Description |
|
|
32
|
+|--------------------|:-----|
|
|
33
|
+**componentId**| Id of the appearing component
|
|
34
|
+**componentName**|Registered name used when registering the component with `Navigation.registerComponent()`
|
|
35
|
+
|
|
36
|
+## componentDidDisappear
|
|
37
|
+Called each time this component disappears from screen (detached from the view heirarchy)
|
21
|
38
|
|
22
|
|
-Listen for component
|
23
|
39
|
```js
|
24
|
40
|
class MyComponent extends Component {
|
25
|
41
|
componentDidAppear() {
|
|
@@ -28,34 +44,48 @@ class MyComponent extends Component {
|
28
|
44
|
}
|
29
|
45
|
```
|
30
|
46
|
|
31
|
|
-## componentDidDisappear
|
|
47
|
+This event can be observed globally as well:
|
32
|
48
|
|
33
|
|
-Listen globally to all components `componentDidDisappear` events
|
34
|
49
|
```js
|
35
|
|
-Navigation.events().componentDidDisappear((componentId, componentName) => {
|
|
50
|
+Navigation.events().registerComponentDidDisappearListener((componentId, componentName) => {
|
36
|
51
|
|
37
|
52
|
});
|
38
|
53
|
```
|
|
54
|
+| Parameter | Description |
|
|
55
|
+|--------------------|:-----|
|
|
56
|
+**componentId**| Id of the disappearing component
|
|
57
|
+**componentName**|Registered name used when registering the component with `Navigation.registerComponent()`
|
|
58
|
+
|
|
59
|
+## registerCommandListener
|
|
60
|
+The `commandListener` is called whenever a *Navigation command* (i.e push, pop, showModal etc) is invoked.
|
39
|
61
|
|
40
|
|
-Listen for component
|
41
|
62
|
```js
|
42
|
|
-class MyComponent extends Component {
|
43
|
|
- componentDidDisappear() {
|
44
|
|
-
|
45
|
|
- }
|
46
|
|
-}
|
|
63
|
+Navigation.events().registerCommandListener((name, params) => {
|
|
64
|
+
|
|
65
|
+});
|
47
|
66
|
```
|
|
67
|
+| Parameter | Description |
|
|
68
|
+|--------------------|:-----|
|
|
69
|
+|**name** | The name of the command that was invoked. For example `push`|
|
|
70
|
+|**params**|`commandId`: Each command is assigned a unique Id<br>`componentId`: Optional, the componentId passed to the command<br>`layout`: Optional, If the command invoked created a screen. Slim representation of the component and its options |
|
48
|
71
|
|
49
|
|
-## onNavigationButtonPressed
|
|
72
|
+## registerCommandCompletedListener
|
|
73
|
+Invoked when a command finishes executing in native. If the command contains animations, for example pushed screen animation,) the listener is invoked after the animation ends.
|
50
|
74
|
|
51
|
|
-Listen globally to all `onNavigationButtonPressed` events
|
52
|
75
|
```js
|
53
|
|
-Navigation.events().onNavigationButtonPressed((buttonId) => {
|
|
76
|
+Navigation.events().registerCommandCompletedListener((commandId, completionTime, params) => {
|
54
|
77
|
|
55
|
78
|
});
|
56
|
79
|
```
|
57
|
80
|
|
58
|
|
-Listen in component
|
|
81
|
+| Parameter | Description |
|
|
82
|
+|--------------------|:-----|
|
|
83
|
+|**commandId** | Id of the completed command|
|
|
84
|
+|**completionTime**|Timestamp when the comand, and consecutive animations, completed.|
|
|
85
|
+
|
|
86
|
+
|
|
87
|
+## onNavigationButtonPressed
|
|
88
|
+Called when a TopBar button is pressed.
|
59
|
89
|
```js
|
60
|
90
|
class MyComponent extends Component {
|
61
|
91
|
onNavigationButtonPressed(buttonId) {
|