How do I turn off the transition animation effect of the TabBarItem component on text?

[rockey2020]

Current behavior

` import React from 'react'; import {StyleSheet, Text} from 'react-native'; import ScreenSize from '../../../../utils/screenSize'; import {TabBar, TabBarItem} from 'react-native-tab-view';

const MyTabBarItemLabel = props => { const {focused, route} = props; return ( <Text style={{ ...MyTabBarItemLabelStyle.labelStyle, ...(focused ? MyTabBarItemLabelStyle.active : MyTabBarItemLabelStyle.inactive), }}> {route.title} ); };

const MyTabBarItemLabelStyle = ScreenSize.forStyle( StyleSheet.create({ labelStyle: { fontSize: 28, width: 160, height: 60, lineHeight: 60, textAlign: 'center', }, inactive: { // color: '#8c8c8c', color: '#000000', }, active: { color: '#000000', fontSize: 34, }, }), );

const MyTabBarItem = props => { return ( <TabBarItem {...props} style={MyTabBarItemStyle.wrapBox} renderLabel={MyTabBarItemLabel} /> ); };

const MyTabBarItemStyle = ScreenSize.forStyle( StyleSheet.create({ wrapBox: { alignItems: 'center', alignContent: 'center', padding: 0, margin: 0, minWidth: 0, minHeight: 0, }, }), );

const HomeTopTabBar = props => { return ( <TabBar style={HomeTopTabBarStyle.tabBar} {...props} indicatorStyle={HomeTopTabBarStyle.indicatorStyle} renderTabBarItem={MyTabBarItem} /> ); };

const HomeTopTabBarStyle = ScreenSize.forStyle( StyleSheet.create({ tabBar: { backgroundColor: 'rgba(255,255,255,0)', width: 400, }, indicatorStyle: { backgroundColor: '#8da36d', width: 50, position: 'absolute', left: '18.5%', height: 4, borderRadius: 10, }, }), );

export default HomeTopTabBar; `

Expected behavior

No transition effect for text switching

Reproduction

https://s21.aconvert.com/convert/p3r68-cdx67/xfoz6-yqdeh.gif

Platform

• [X] Android
• [X] iOS
• [ ] Web
• [ ] Windows
• [ ] MacOS

Environment

"react-native-tab-view": "^3.1.1", "react-native": "0.67.3",

[github-actions[bot]]

Hey! Thanks for opening the issue. The issue doesn't seem to contain a link to a repro (a snack.expo.dev link or link to a GitHub repo under your username).

Can you provide a minimal repro which demonstrates the issue? A repro will help us debug the issue faster. Please try to keep the repro as small as possible and make sure that we can run it without additional setup.

[github-actions[bot]]

Couldn't find version numbers for the following packages in the issue:

• react-native-pager-view

Can you update the issue to include version numbers for those packages? The version numbers must match the format 1.2.3.

[rockey2020]

[github-actions[bot]]

Hello 👋, this issue has been open for more than a month without a repro or any activity. If the issue is still present in the latest version, please provide a repro or leave a comment within 7 days to keep it open, otherwise it will be closed automatically. If you found a solution or workaround for the issue, please comment here for others to find. If this issue is critical for you, please consider sending a pull request to fix it.