question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Reanimated V2, interpolating colors

See original GitHub issue

I used this branch to interpolate colors for reanimted2,

But I get the error of ReferenceError: Property '_hsv2rgb doesn’t exist` .

Do you have any examples interpolating colors in v2? I mean like from #000222 to #ffffff

Issue Analytics

  • State:open
  • Created 3 years ago
  • Comments:8 (2 by maintainers)

github_iconTop GitHub Comments

3reactions
kyle-ssgcommented, Aug 4, 2020

I ended up using the interpolateColours that’s built into reanimated2 it seems to work well @sa8ab. I also had trouble with Redash’s

import Animated, { interpolateColors } from "react-native-reanimated";
...
const backgroundColor= interpolateColors(animatedValue,{
  inputRange:[0,1],
  outputColorRange:["red","blue"]
})
1reaction
wcandilloncommented, Dec 8, 2020

if you interpolate in rgb space you need to interpolate the red the green the blue separatly

On Tue 8 Dec 2020 at 08:15, Fernando Rojo notifications@github.com wrote:

Thanks for getting back to me!

you probably want to spring on each color component

Could you elaborate on what you mean by “each color component”? I’m hoping to spring a backgroundColor for one component.

— You are receiving this because you commented.

Reply to this email directly, view it on GitHub https://github.com/wcandillon/react-native-redash/issues/303#issuecomment-740431467, or unsubscribe https://github.com/notifications/unsubscribe-auth/AACKXVQCNOCL4RE5XFEUPXTSTXG7TANCNFSM4OYIJ7TQ .

Read more comments on GitHub >

github_iconTop Results From Across the Web

Interpolate Colors like a pro with React Native Reanimated 2
Today we are going to understand the concept behind the interpolateColor function from the react-native-reanimated (v2) package.
Read more >
v2 How does one use color interpolation and withTiming hook
Hi there, in order to pass some animated values to the styles, you need to use useAnimatedStyle hook. Passing values directly is no...
Read more >
interpolateColors | React Native Reanimated
Output colors range for the interpolation. ... Each color should be a string like "red" "#ff0" "#ff0000" "rgba(255, 0, 0, 1)"
Read more >
What is wrong with my React Native Reanimated colour ...
To achieve that, I'm using React Native Reanimated. ... use that progress to interpolate the colour from transparent to my other colour.
Read more >
Interpolate Colors like a pro with React Native ... - Morioh
View color interpolation 9:44 Circle backgroundColor interpolation 13:30 Text color interpolation. #react native #react native reanimated 2 ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found