What effect do I want to achieve?
The tab indicator is overlaid on the tab text, not at the bottom of the tab
What is the problem now?
The
TabBarIndicator
component is fixed at the bottom and is only 2 pixels high. The specific code is here: https://github.com/react-navigation/react-navigation/blob/bddcc44ab0e0ad5630f7ee0feb69496412a00217/packages/react-native-tab-view/src/TabBarIndicator.tsx#L182
What do I expect?
The size of
tabBarIndicator
should follow each
tabBarItem
. Maybe
borderBottom
can be used to achieve the current effect?
After switching to this method, I believe it will be easier to achieve the following effects: