How to measure header height?

I implement padding to KeyboardAvoidingView. In react-navigation I could get header height through useHeaderHeight hook.

import { useHeaderHeight } from '@react-navigation/stack';

// ...

const headerHeight = useHeaderHeight();

Could you mind share ideas to measure that header height?

[msvargas]

Hi, I use useSafeArea and add value for default platform:

import * as React from 'react';
import { KeyboardAvoidingView, KeyboardAvoidingViewProps } from 'react-native';
import { useSafeArea } from 'react-native-safe-area-view';

type Props = KeyboardAvoidingViewProps & {
  children: React.ReactNode;
  extraOffset?: number;
};
const isIOS = Platform.OS == 'ios'
const HEADER_HEIGHT = Platform.OS === 'ios' ? 44 : 56;

const KeyboardAvoiding: React.FC<Props> = React.memo(({ children, extraOffset, ...rest }: Props) => {
  const insets = useSafeArea();

  return (
    <KeyboardAvoidingView
      keyboardVerticalOffset={insets.top + HEADER_HEIGHT + (extraOffset as number)}
      behavior={isIOS ? 'padding' : undefined}
      enabled
      {...rest}
    >
      {children}
    </KeyboardAvoidingView>
  );
});

KeyboardAvoiding.displayName = 'KeyboardAvoiding';
KeyboardAvoiding.defaultProps = {
  extraOffset: 0,
};

export default KeyboardAvoiding;

This works with headerLargeTitle=true ??, and what extraOffset is I don’t understand that part , if you could help me please thanks!!!

Not working with headerLargeTitle, and extraOffset working with tabs or others components with you add

[WoLewicki]

I think the best way to do it is to use react-native-safe-area-context. On iOS, it should always be safeArea.top + 96 for large header and safeArea.top + 44 for small header. Does it solve your issue?