Support for `animated` option

[samcodefish]

Why it is needed?

The stock React Native StatusBar component has the animated prop to configure whether a status bar style or visibility change should be animated or not.

Without this option this package's SystemBars component can't be a complete like-for-like replacement for StatusBar (or expo-status-bar).

Would it be difficult for this configuration to be added?

Thanks for this library and all your work.

Possible implementation

No response

Code sample

// Suggested type update:
type SystemBarsProps = {
  style?: Style | { statusBar?: Style; navigationBar?: Style; animated?: boolean };
  hidden?: boolean | { statusBar?: boolean; navigationBar?: boolean; animated?: boolean };
};

[zoontek]

Would it be difficult for this configuration to be added?

animated cannot work on Android for both style and hidden (as this library relies on immersive mode), so the interest is super limited / inexistant.

But I'm curious, I asked my community if someone was using this and it appears nobody is. What would be your use case?

EDIT: Note that it never worked on anything else than setColor on Android (cf source code - animated is not used for setHidden or setStyle)

[samcodefish]

Ah, ok – so animated is not applicable on Android. Well then essentially, it would be helpful to be able to disable the animated transition on iOS somehow.

Our use case: we're building an app with bottom tab navigation. The interface overall is "light mode" in style (so status bars are dark text), however one tab has a large dark hero area at the top of its content so requires a light text status bar to ensure contrast.

On iOS, the SystemBars component defaults to an animated transition of the status bar (which is generally a helpful default). However, in this instance above we would want the status bar transition to be instant as the transition of the bottom tab navigation is instant (...on Android the SystemBars component does an instant status bar transition as we desire).