React Native rotateY会导致文本模糊

Question

我正在为React Native for iOS设备开发一个翻转卡组件，这就是我接触它的方式：

<Animated.View ref="container" style={{position:'relative',transform:[{rotateY:'0deg'}]}}>
    <View ref="frontFace"><Text>Front face</Text></View>
    <View ref="backFace" style={{transform:[{rotateY:'-180deg'}]}}><Text>Back face</Text></View>
</Animated.View>

1. 使用容器视图中的绝对位置重叠两个视图
2. 使用rotateY翻转背面：' - 180deg'
3. 点击翻页按钮时，使用动画组件翻转容器，方法是将容器的rotateY从“0deg”插入“180deg”

对于上面的过度简化代码感到抱歉 - 此代码也能正常运行。问题是模拟器中的背面模糊，设备上的像素很难看。

有没有办法解决这个问题？或者关于如何实现翻转卡组件的任何更好的建议？

谢谢!!!

Answer 1

替换 transform: [{ rotateY: '-180deg'}]  风格： transform : [{scaleX: -1}] 解决了它。

Answer 2

您可以使用

$pdo = new PDO('mysql:host='.DB_HOST.';dbname='.DB_DB, DB_USER, DB_PASS);

而不是

transform: [{
    skewY: '-180deg'
}],

在你的backFace View上。对我来说，这就像iOS和Android上的魅力一样。

Answer 3

在我的网页中，也有模糊的文字问题， transform: scaleX(-1); 解决问题。