反应原生转换源

Question

如何在react native中将transform-origin属性应用于样式？ 我已经尝试了几种方法，但是没有得到一个事件

我尝试过：

  

变换：[{旋转：（'90deg'）}，{原点：{x：'顶部'，y：'中心'}}}

Answer 1

我已经建立了实现transform-origin的库。 react-native-anchor-point

易于使用

import { withAnchorPoint } from 'react-native-anchor-point';

getTransform = () => {
    let transform = {
        transform: [{ perspective: 400 }, { rotateX: rotateValue }],
    };
    return withAnchorPoint(transform, { x: 0, y: 0.5 }, { width: CARD_WIDTH, height: CARD_HEIGHT });
};

<Animated.View style={[styles.blockBlue, this.getTransform()]} />

Answer 2

React native还没有任何转换原点属性。也许将来

所以要实现此????

您应该尝试使用translateX或translateY技巧 例如将形状从最左边旋转35度

transform: [

            {   
                translateX: -1 * (widthOfShape / 2)

            }
            },

            {
                rotate: '35deg'
            },
            {   
                translateX: (widthOfShape / 2)

            },
        ]

旋转完成后要小心，应将其平移回原始位置