Skip to content

Commit e4e5049

Browse files
authored
documentation added (#8297)
1 parent e761eb7 commit e4e5049

3 files changed

Lines changed: 81 additions & 1 deletion

File tree

website/docs/api/options-root.mdx

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,8 @@ const options = {
1414
overlay,
1515
modal,
1616
preview,
17-
navigationBar
17+
navigationBar,
18+
scrollEdgeEffect,
1819
};
1920
```
2021

@@ -173,6 +174,14 @@ Enable or disable automaticall blur of the focused input, dismissing keyboard on
173174
| ------- | -------- | -------- | ------- |
174175
| boolean | No | Android | false |
175176

177+
## `scrollEdgeEffect`
178+
179+
Show / hide or change the style of the iOS 26 scroll edge effect on every `UIScrollView` contained in the screen.
180+
181+
| Type | Required | Platform |
182+
| -------------------------------------------------------- | -------- | -------- |
183+
| [ScrollEdgeEffectOptions](options-scrollEdgeEffect.mdx) | No | iOS 26+ |
184+
176185
## `navigationBar`
177186
Enable or disable automaticall blur of the focused input, dismissing keyboard on unmount.
178187

Lines changed: 70 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,70 @@
1+
---
2+
id: options-scrollEdgeEffect
3+
title: Scroll Edge Effect Options
4+
sidebar_label: Scroll Edge Effect
5+
---
6+
7+
Controls the iOS 26+ `UIScrollEdgeEffect` (Liquid Glass fade) shown at the edges of scroll views when content scrolls under bars.
8+
9+
**Credits**: Contributed by [@manuhook](https://github.com/manuhook) ([PR #8281](https://github.com/wix/react-native-navigation/pull/8281)).
10+
11+
```js
12+
const options = {
13+
scrollEdgeEffect: {
14+
hidden: true,
15+
},
16+
};
17+
```
18+
19+
### `hidden`
20+
21+
Hide the scroll edge effect.
22+
23+
| Type | Required | Platform |
24+
| ------- | -------- | -------- |
25+
| boolean | No | iOS 26+ |
26+
27+
### `style`
28+
29+
Set the scroll edge effect style.
30+
31+
| Type | Required | Platform | Default |
32+
| ----------------------------------- | -------- | -------- | ----------- |
33+
| enum('automatic', 'soft', 'hard') | No | iOS 26+ | 'automatic' |
34+
35+
### `top` / `bottom` / `left` / `right`
36+
37+
Per-edge override. Values fall back to the global `hidden` / `style`. Per-edge values take precedence.
38+
39+
| Type | Required | Platform |
40+
| --------------------------------------------------------------------------------- | -------- | -------- |
41+
| `{ hidden?: boolean; style?: 'automatic' \| 'soft' \| 'hard' }` | No | iOS 26+ |
42+
43+
## Examples
44+
45+
Hide all edges:
46+
47+
```js
48+
MyScreen.options = {
49+
scrollEdgeEffect: { hidden: true },
50+
};
51+
```
52+
53+
Top visible, bottom hidden:
54+
55+
```js
56+
MyScreen.options = {
57+
scrollEdgeEffect: {
58+
top: { hidden: false },
59+
bottom: { hidden: true },
60+
},
61+
};
62+
```
63+
64+
Dynamic update:
65+
66+
```js
67+
Navigation.mergeOptions(componentId, {
68+
scrollEdgeEffect: { bottom: { hidden: true } },
69+
});
70+
```

website/sidebars.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -67,6 +67,7 @@ module.exports = {
6767
},
6868
'api/options-statusBar',
6969
'api/options-layout',
70+
'api/options-scrollEdgeEffect',
7071
'api/options-modal',
7172
'api/options-navigationBar',
7273
'api/options-overlay',

0 commit comments

Comments
 (0)