Large Header Title misaligned when using react-navigation/drawer

[Relax594]

Description

When using react-navigation/drawer to navigate to a screen that has headerLargeTitleEnabled: true, the large title is misaligned with the left header button. When navigating without a drawer, it works fine.

This also seems to only affect iOS 26.x as it works fine with iOS 18.
Tested on real device as well as simulator.

import 'react-native-gesture-handler';
import React from 'react';
import { View, Text, Button, ScrollView } from 'react-native';
import { NavigationContainer } from '@react-navigation/native';
import { createDrawerNavigator } from '@react-navigation/drawer';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
import { GestureHandlerRootView } from 'react-native-gesture-handler';
import { SafeAreaProvider } from 'react-native-safe-area-context';

const Drawer = createDrawerNavigator();

const HomeStack = createNativeStackNavigator();
const LargeStack = createNativeStackNavigator();

function ButtonScreen({ navigation }) {
    return (
        <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
            <Text>Open the drawer to navigate to large title screen</Text>
        </View>
    );
}

function ScrollScreen() {
    return (
        <ScrollView contentContainerStyle={{ padding: 16 }} contentInsetAdjustmentBehavior='automatic'>
            <Text style={{ fontSize: 22, marginBottom: 12 }}>Large Title (ScrollView)</Text>
            {Array.from({ length: 30 }).map((_, i) => (
                <Text key={i} style={{ marginBottom: 8 }}>
                    {`Entry ${i + 1} — Example content for scrolling.`}
                </Text>
            ))}
        </ScrollView>
    );
}

function HomeStackScreen() {
    return (
        <HomeStack.Navigator>
            <HomeStack.Screen
                name="Button"
                component={ButtonScreen}
                options={({ navigation }) => ({
                    title: 'Button',
                    headerLeft: () => (
                        <Button title="Menu" onPress={() => navigation.getParent()?.openDrawer()} />
                    ),
                })}
            />
        </HomeStack.Navigator>
    );
}

function LargeStackScreen() {
    return (
        <LargeStack.Navigator>
            <LargeStack.Screen
                name="Scroll"
                component={ScrollScreen}
                options={({ navigation }) => ({
                    title: 'Scroll',
                    headerLargeTitle: true,
                    headerLeft: () => (
                        <Button title="Menu" onPress={() => navigation.getParent()?.openDrawer()} />
                    ),
                })}
            />
        </LargeStack.Navigator>
    );
}

export default function App() {
    return (
        <GestureHandlerRootView style={{ flex: 1 }}>
            <SafeAreaProvider>
                <NavigationContainer>
                    <Drawer.Navigator initialRouteName="Home" screenOptions={{ headerShown: false }}>
                        <Drawer.Screen name="Home" component={HomeStackScreen} />
                        <Drawer.Screen name="LargeTitle" component={LargeStackScreen} options={{ title: 'Large Title' }} />
                    </Drawer.Navigator>
                </NavigationContainer>
            </SafeAreaProvider>
        </GestureHandlerRootView>
    );
}

iOS 18:

iOS 26:

Steps to reproduce

1. open drawer menu
2. navigate to "Large Title"

Snack or a link to a repository

https://gist.github.com/Relax594/b57d4e19ba4007288b8f3ba64a0bccb5

Screens version

4.22.0

React Native version

0.81.6

Platforms

iOS

JavaScript runtime

None

Workflow

None

Architecture

Paper (Old Architecture)

Build type

None

Device

None

Device model

No response

Acknowledgements

Yes

[Relax594]

@kkafar sorry to disturb you but is there any chance this can be looked into?
it is easy to replicate as it happens 100% of the time.

I've opened a ticket at react-navigation but they told me that it is out of their control as it's with your library due to native-stack.