Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Android]horizontal-stack animation with new architecture Enabled cause "Loss of precision during arithmetic conversion: (long) XX.X #754

Open
nazacity opened this issue Jan 3, 2025 · 4 comments
Assignees
Labels
bug Something isn't working

Comments

@nazacity
Copy link

nazacity commented Jan 3, 2025

After upgrading to 0.76.5 enabled new arch
I also got Loss of precision during arithmetic conversio error too

               <Carousel
                    loop={false}
                    width={SIZES.screenWidth}
                    height={150}
                    autoPlay={false}
                    data={userCard}
                    mode="horizontal-stack"
                    modeConfig={
                        {
                            moveSize: SIZES.screenWidth - 40,
                            showLength: 3,
                            rotateZDeg: 0
                        } as ILayoutConfig
                    }
                    // panGestureHandlerProps={{
                    //     activeOffsetX: [-10, 10]
                    // }}
                    renderItem={_renderCarousel}
                />
 - react: v18.3.1  
 - react-native: v0.76.5  
 - react-native-reanimated: v3.17.0-rc.1
 - react-native-reanimated-carousel: v44.0.0-canary.17
 - react-native-gesture-handler: v2.21.2

I found out that zIndex function here cause the problem.

Screenshot 2568-01-02 at 21 24 38

I replaced it with constants number it works fine I mean it can be slided.

@nazacity nazacity added the bug Something isn't working label Jan 3, 2025
Copy link

dosubot bot commented Jan 3, 2025

Hey @nazacity, I'm here to assist you with any bugs, questions, or becoming a contributor. Let's squash those bugs together! 🤖

I found a similar issue that was resolved. The "Loss of precision during arithmetic conversion" error in a horizontal-stack animation with the new architecture enabled in React Native version 0.76.5 can be fixed by modifying the zIndex calculation in node_modules/react-native-reanimated-carousel/src/layouts/parallax.ts. You should replace the existing zIndex calculation with:

const zIndex = Math.round(interpolate(value, [-1, 0, 1], [0, size, 0]));

This fix addresses the issue across iOS, Android, and Expo platforms with the specified versions [1].

To continue talking to Dosu, mention @dosu.


Help Dosu learn! Give it feedback: Great Response | Irrelevant Answer | Incorrect Sources | Too Verbose | Hallucination | Other

@joaobsantos
Copy link

Can you pls patch this with the soluction that dosubot gave, it works. But when building for store we cant do this.

Thx for your work

@ibrust
Copy link

ibrust commented Jan 10, 2025

same thing is happening with parallax, and the fix is the same.
Please take a look
Thx

@erenkulaksiz
Copy link

Hello, i am also encountering this issue. Can we get a fix about this? thanks

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

5 participants