React Native transform in styled-components

Question

Am I able to use transform in styled-components in React Native?

I define the styled component like this:

const StyledAnimatedView = Animated.createAnimatedComponent(styled.View<
    ViewProps
  >`
    transform: translateY(-100);
`);

but it throws me an error when component mounts:

Error: Failed to parse declaration "transform: translateY(-100)"

I know it is possible in web but maybe not in React Native?

Desertion

Answer 1

transform: translateY(-100px);

Underpinning

Answer 2

I found that "px" is necessary in most cases when you are using react native. btw, you can use props.

styled.View<ViewProps>`
    transform: translateY(${props => props.translateY});
`);


<StyledAnimatedView translateY={'-100px'}/>

Fides