search

GeekyAnts / vue-native-router

37 stars 24 forks source link

Unable to edit or modify appbar properties #40

Closed Flamz23 closed 3 years ago

Flamz23 commented 4 years ago

I've been trying to edit/modify the app bar properties (e.g change it's color, add text or icons) but it seems that it isn't possible anymore.

Part of the reason is that in the example app the doc provides (e.g KitchenSink), they seem to be using a different component naming scheme as shown here which is completely different from what's in the docs

How exactly is its default styling supposed to be changed.

While I have your attention could the docs also be updated to reflect what exactly Header1: { screen: Header1Screen }, means and its usage in app.vue in the kitchenSink app code

RishabhKarnad commented 3 years ago

The KitchenSink app uses NativeBase components, such as the Header component. The styling is done using NativeBase's API: https://docs.nativebase.io/docs/ThemeVariables.html

The Header1: { screen: Header1Screen } simply refers to a demo screen showcasing a custom header component.

To customise the header styling in vue-native-router, you can use the config supported by react-navigation 4: https://reactnavigation.org/docs/4.x/headers#sharing-common-navigationoptions-across-screens

Since static properties are not supported in vue SFC components, you will need to work with defaultNavigationOptions