Fixes most of the playground examples

Author: arqex

playground/src/examples/CollapsingHeaderWithScroll.js

@@ -67,7 +67,7 @@ export default class CollapsingHeaderWithScroll extends Component {
     );
   }
   onSnap(event) {
-    const { id } = event.nativeEvent;
+    const { id } = event;
     if (id === 'bottom') {
       this.setState({ canScroll: true });
     }

playground/src/examples/SnapTo.js

@@ -27,10 +27,11 @@ export default class SnapTo extends Component {
             {x: 140, y: 250}
           ]}
           initialPosition={{x: 140, y: 250}}>
-          <View style={{width: 70, height: 70, backgroundColor: '#EE2C38', borderRadius: 35}} />
+          <View style={{width: 70, height: 70, backgroundColor: '#EE2C38', borderRadius: 35}}></View>
         </Interactable.View>
+
         <View style={styles.button}>
-          <Button title="Snap To Next" onPress={this.onButtonPress.bind(this)} color='white' />
+          <Button title="Snap To Next" onPress={this.onButtonPress.bind(this)} />
         </View>
       </View>
     );
@@ -51,8 +52,5 @@ const styles = StyleSheet.create({
     backgroundColor: 'white',
   },
   button: {
-    position: 'absolute',
-    left: 110,
-    backgroundColor: '#459FED'
   }
 });

playground/src/lib/InteractableView.js

@@ -344,7 +344,7 @@ export default function injectDependencies( Animated, PanResponder ){
 			this.endDrag();
 		}
 
-		snapTo( index ) {
+		snapTo( {index} ) {
 			let {snapPoints} = this.props;
 
 			if( !snapPoints || index === undefined || index >= snapPoints.length ) return;