bviebahn/react-native-star-rating-widget

Sending 'onAnimatedValueUpdate' with no listeners registered error on Material Top Tabs Navigator

Closed this issue · 2 comments

Issue:
When using the Material Top Tabs Navigator from React Navigation, an error is encountered when trying to swipe on star icons. I still see the same error displaying even after adding enableSwiping={false} as a prop.

Note: I didn't encounter this issue on other screen types.

Example video:
https://github.com/bviebahn/react-native-star-rating-widget/assets/86489794/d117b209-18a5-4d15-bf38-ebb0175357a0

Example code:

import { createMaterialTopTabNavigator } from "@react-navigation/material-top-tabs";
import { createBottomTabNavigator } from "@react-navigation/bottom-tabs";

const TopTab = createMaterialTopTabNavigator();
const Tab = createBottomTabNavigator();

const TopTabScreen1 = () => {
  return (
    <View
      style={{
        flex: 1,
        justifyContent: "center",
        alignItems: "center",
      }}
    >
      <Example />
    </View>
  );
};
const Tab2Screen2 = () => {
  return (
    <View>
      <TextInput placeholder="Enter Text" />
    </View>
  );
};
const TabTop = () => {
  return (
    <TopTab.Navigator>
      <TopTab.Screen name="TopTab" component={TopTabScreen1} />
      <TopTab.Screen name="TopTab2" component={Tab2Screen2} />
    </TopTab.Navigator>
  );
};

const Example = () => {
  const [rating, setRating] = useState(0);
  return (
    <StarRating rating={rating} onChange={setRating}  />
  );
};

export default function App() {
  return (
    <NavigationContainer>
      <Tab.Navigator>
        <Tab.Screen
          name="Tab"
          component={TabTop}
          options={{
            headerShown: false,
          }}
        />
        <Tab.Screen
          name="Tab2"
          component={TabTop}
          options={{
            headerShown: false,
          }}
        />
      </Tab.Navigator>
    </NavigationContainer>
  );
}

Sorry for the late reply. I'm also seeing this warning when not rendering any StarRating, so this seems to be not related to this library. Here's an open issue on the react-navigation repo: react-navigation/react-navigation#11564

Thank you for your time and response.