React Native如何同时旋转和平移

import React, { Component } from 'react';
import { View, Animated, PanResponder } from 'react-native';

constructor(props) {
  super(props);
  this.state = {
    pan: new Animated.ValueXY(),
    rotate: new Animated.Value(0),
  };

  this.panResponder = PanResponder.create({
    onStartShouldSetPanResponder: () => true,
    onPanResponderMove: Animated.event([
      null,
      { dx: this.state.pan.x, dy: this.state.pan.y },
    ]),
    onPanResponderRelease: () => {
      Animated.spring(this.state.pan, { toValue: { x: 0, y: 0 } }).start();
    },
  });
}

render() {
  const { pan, rotate } = this.state;
  const rotateStyle = {
    transform: [{ rotate: rotate.interpolate({ inputRange: [0, 1], outputRange: ['0deg', '360deg'] }) }],
  };

  return (
    <View style={{ flex: 1 }}>
      <Animated.View
        style={[pan.getLayout(), rotateStyle]}
        {...this.panResponder.panHandlers}
      >
        {/* 在这里放置需要进行旋转和平移的组件 */}
      </Animated.View>
    </View>
  );
}