Skip to content

Add scrollEdgeEffect option to control iOS 26 scroll edge effects#8281

Merged
markdevocht merged 2 commits into
wix:masterfrom
manuhook:master
May 7, 2026
Merged

Add scrollEdgeEffect option to control iOS 26 scroll edge effects#8281
markdevocht merged 2 commits into
wix:masterfrom
manuhook:master

Conversation

@manuhook
Copy link
Copy Markdown
Contributor

@manuhook manuhook commented Apr 28, 2026

Motivation
iOS 26 introduces a new Liquid Glass scroll edge effect on UIScrollView — a soft visual fade that appears at the edges of scroll views when content scrolls behind navigation bars or tab bars. While visually coherent in most contexts, some screens benefit from disabling or tuning this effect per-edge (e.g. a profile screen with a transparent nav bar where the top fade is unwanted, but the bottom one should stay).

React Native Navigation had no way to control this.

What this patch does
Adds a new top-level screen option scrollEdgeEffect (iOS 26+ only, no-op on older versions) that lets you show/hide and style the UIScrollEdgeEffect on every UIScrollView inside a screen, with either a global shorthand or per-edge overrides.

TypeScript API

export interface OptionsScrollEdge {
  hidden?: boolean;
  style?: 'automatic' | 'soft' | 'hard';
}

export interface OptionsScrollEdgeEffect {
  hidden?: boolean;                   // applies to all four edges
  style?: 'automatic' | 'soft' | 'hard';
  top?: OptionsScrollEdge;            // overrides the global value for top edge only
  bottom?: OptionsScrollEdge;
  left?: OptionsScrollEdge;
  right?: OptionsScrollEdge;
}

Usage

// Static declaration
MyScreen.options = {
  scrollEdgeEffect: { hidden: true },                         // hide all edges
};

// Fine-grained: top visible, bottom hidden
MyScreen.options = {
  scrollEdgeEffect: {
    top: { hidden: false },
    bottom: { hidden: true },
  },
};

// Dynamic via mergeOptions
Navigation.mergeOptions(componentId, {
  scrollEdgeEffect: { bottom: { hidden: true } },
});

For example with mergeOptions it allows to answer this problematic :

utvd3gi0zkpg1

@markdevocht markdevocht merged commit e761eb7 into wix:master May 7, 2026
3 checks passed
@markdevocht
Copy link
Copy Markdown
Contributor

@manuhook , Thank you for your contribution. This PR is now merged to the master branch and will be released in the next release.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants