how can i flip image in react-native?

Question

i'm trying to flip image. i tried to rotate method but it doesn't work

this is my image

i want to flip this image like this

->>

this is my code.

    const Container = styled.View`
      flex-direction: row;
      background-color: #FFF;
      border-radius: 8px;
      margin:4px 16px;
      padding: 8px 16px;
      align-items: center;
      border:1px solid white;
      border-bottom-color: #DCDCDC;
    `;

    const DeleteButton = styled.TouchableOpacity`
    `;

    const Icon = styled.Image`
      width: 24px;
      height: 24px;
    `;

    const TodoItem = () => {
      return (
        <Container>
        <DeleteButton onPress={() => setModalVisible(true)}>
            <Icon source={require('../../../../Assets/Images/ic_dot_menu.png')} />
          </DeleteButton>
        </Container>
      );
    };
    export default TodoItem;

what code should i fix?

Answer 1

try this:

<Icon style={{transform: [{rotateY: '90deg'}]}} source={require('../../../../Assets/Images/ic_dot_menu.png')} />