feat: introduce expo config plugin

[okwasniewski]

This PR should close:

• Expo config plugin  #48
• Tab bar looks strange on Android (dark mode?) #40

Api of the config plugin:

"plugins": [
      "react-native-bottom-tabs"
     // or 
     ["react-native-bottom-tabs", { theme: "material2" }]
 ],

[fredrikburmester]

["react-native-bottom-tabs", { theme: "material2" }]

What themes are there to pick from?

[fredrikburmester]

Ah i found this: https://okwasniewski.github.io/react-native-bottom-tabs/docs/guides/android-native-styling.html

[fredrikburmester]

Another question, this does not seem to enable the native "pill" look on android. Is that not supported currently in the expo config? Thanks.

[okwasniewski]

Another question, this does not seem to enable the native "pill" look on android. Is that not supported currently in the expo config? Thanks.

The pill is material3 theme which is the default. Just use ["react-native-bottom-tabs"] in the app.json file

[fredrikburmester]

I did, but i can't see the pill design.

[fredrikburmester]

https://github.com/fredrikburmester/streamyfin/blob/65a6ab99721594f0e9ec4a39070ddebd34057e19/app.json#L104

[okwasniewski]

Ah you also added edge-to-edge!

This library is missing material3 style, here is a feature request tracking it: zoontek/react-native-edge-to-edge#38

When it lands you should be able to remove bottom tabs config plugin as only one of them is needed to set the styling

[fredrikburmester]

Oh I did not know those were related, sorry. I'm confused as to why the edge-to-edge library needs the styles for the bottom-tabs to look like material3?

[okwasniewski]

Oh I did not know those were related, sorry. I'm confused as to why the edge-to-edge library needs the styles for the bottom-tabs to look like material3?

Because edge to edge also changes the Android style in styles.xml

Now they change it to AppCompat but we need an option to change it to Material3. Android styles.xml is a bit wired but they base it on inheritance

[edmiquilena]

First of all, thanks for the lib!

I'm having the same problem with the "pill" not showing,
The style is shown as material 2


"@bottom-tabs/react-navigation": "^0.7.1" with expo SDK 52

Edit: Seems to be okay on prod builds, but on development build has no pill on selection