Skip to content

Provide more detailed documentation how Animated.Value.interpolation works with string values in outputRange #418

Open
@psnet

Description

@psnet

Introduction

Currently we have docs for Animated.Value.interpolation here method but it doesn't covers in more details how it works with string values for outputRange parameter. I mean more complicated rules than this simple example from docs:

value.interpolate({
  inputRange: [0, 360],
  outputRange: ['0deg', '360deg']
});

Details

Need to add to docs what it can do with strings and what cannot.

Discussion points

For example, why it doesn't works with such code and (maybe) how to do that (it replaces first number in string? all numbers in string? all numbers w/o any symbol after number?):

color: colorAnim.current.interpolate({
  inputRange: [0, 360],
  outputRange: ['hsl(0, 100%, 50%)', 'hsl(360, 100%, 50%)'],
})

And how to use parameters described in docs:

You can set the extrapolation by setting the extrapolate, extrapolateLeft, or extrapolateRight options

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions