单击按钮旋转图像

问题描述

因此，我尝试在单击按钮时旋转图像，为简单起见，我有上下两个按钮，我只是将一个按钮更改为20deg，下面的第二秒更改为0。

@observer
class App extends Component {
  rotate = observable({ angle: '10deg' })

  constructor(props) {
    super(props);
  }
  render() {
    return (
      <View>
        <imagebackground
          resizeMode="cover"
          source={require('@images/test_pointer.png')}
          style={{
            backgroundColor: 'black',justifyContent: 'center',alignItems: 'center',transform: [{ rotate: this.rotate.angle }]
          }} >
          <Image
            source={require('@images/test_on.png')}
            style={{ justifyContent: 'center' }} />
        </imagebackground>
        <TouchableOpacity onPress={() => {
          console.log("20deg?");
          this.rotate.angle = '20deg'
        }}>
          <Text>UP</Text>
        </TouchableOpacity>
        <TouchableOpacity onPress={() => {
          console.log("0deg?");
          this.rotate.angle = '0deg'
        }}>
          <Text>Down</Text>
        </TouchableOpacity>
      </View>
    )
  }
}

export default App;

我可以在日志中看到按钮正在执行并且它正在改变角度，但是图像没有旋转，这是我做错了吗？

如果我将图像背景标签更改为图像并删除内部图像标签，则旋转将按预期进行，但我希望图像背景旋转。 预先感谢。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）