ochanje210
/ RN-cube-rotateXZ-inResponderMove.js
Created
March 2, 2017 05:46
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| matrix = this.rotateXZ(dx, dy - 90); | |
| this.transformOrigin(matrix, origin); | |
| this.refViewTop.setNativeProps({style: {transform: [{perspective: 1000}, {matrix: matrix}]}}); | |
| matrix = this.rotateXZ(-dx, dy + 90); | |
| this.transformOrigin(matrix, origin); | |
| this.refViewBottom.setNativeProps({style: {transform: [{perspective: 1000}, {matrix: matrix}]}}); |
ochanje210
/ RN-cube-rotateXZ.js
Created
March 2, 2017 05:40
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| rotateXZ(dx, dy) { | |
| const radX = (Math.PI / 180) * dx; | |
| const cosX = Math.cos(radX); | |
| const sinX = Math.sin(radX); | |
| const radY = (Math.PI / 180) * dy; | |
| const cosY= Math.cos(radY); | |
| const sinY = Math.sin(radY); | |
| return [ |
ochanje210
/ cube-handlePanResponderMove.js
Last active
March 2, 2017 05:24
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| handlePanResponderMove (e, gestureState) { | |
| const {dx, dy} = gestureState; | |
| const origin = {x: 0, y: 0, z: -yourSquareSidelength / 2}; | |
| let matrix = this.rotateXY(dx, dy); | |
| transformOrigin(matrix, origin); | |
| this.refViewFront.setNativeProps({style: {transform: [{perspective: 1000}, {matrix: matrix}]}}); | |
| matrix = this.rotateXY(dx + 180, dy); | |
| transformOrigin(matrix, origin); | |
| this.refViewBack.setNativeProps({style: {transform: [{perspective: 1000}, {matrix: matrix}]}}); |
ochanje210
/ simple-handlePanResponderMove.js
Last active
March 2, 2017 05:05
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| handlePanResponderMove (e, gestureState) { | |
| const {dx, dy} = gestureState; | |
| const sideLength = 100; | |
| const origin = {x: 0, y: 0, z: -sideLength / 2}; | |
| let matrix = this.rotateX(dx, dy); | |
| // from https://gist.github.com/jmurzy/0d62c0b5ea88ca806c16b5e8a16deb6a#file-foldview-transformutil-transformorigin-js | |
| transformOrigin(matrix, origin); | |
| this.refView.setNativeProps({style: {transform: [{perspective: 1000}, {matrix: matrix}]}}); | |
| } |
ochanje210
/ RN-cube-rotateXY.js
Created
March 2, 2017 04:38
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| rotateXY(dx, dy) { | |
| const radX = (Math.PI / 180) * dy; | |
| const cosX = Math.cos(radX); | |
| const sinX = Math.sin(radX); | |
| const radY = (Math.PI / 180) * -dx; | |
| const cosY= Math.cos(radY); | |
| const sinY = Math.sin(radY); | |
| return [ |
ochanje210
/ RN_PanResponder_simple_example.js
Last active
March 1, 2017 16:37
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| const styles = { | |
| container: { | |
| flex: 1, | |
| justifyContent: 'center', | |
| alignItems: 'center' | |
| }, | |
| rotateView: { | |
| width: 100, | |
| height: 100, | |
| backgroundColor: 'white', |