Throw flow error when trying to access a style that is not defined on a stylesheet

Summary:
I thought it would be useful to help clear out references to no longer used styles and also catch typos on style names to have flow error when we try to access a style that isn't defined.

Example:

```javascript
export default class AuthenticationScreen extends React.Component {
  render() {
    // This throws an error because `continer` is misspelled
    return (
      <View style={styles.continer} />
    )
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
}
```

```javascript
export default class AuthenticationScreen extends React.Component {
  render() {
    // This throws an error because no fancyContainer style is defined
    return (
      <View style={[styles.container, styles.fancyContainer]} />
    )
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
}
```

All credit goes to jeffmo in this tweet: https://twitter.com/lbljeffmo/status/755179096271888385

Also included in the PR is some cleanup on styles that
Closes https://github.com/facebook/react-native/pull/8876

Differential Revision: D3584983

Pulled By: yungsters

fbshipit-source-id: 0ee0e12ff3d976c137d932688e323c26690e0a52

Examples/UIExplorer/js/CameraRollView.js

@@ -198,7 +198,7 @@ var CameraRollView = React.createClass({
 
   _renderFooterSpinner: function() {
     if (!this.state.noMore) {
-      return <ActivityIndicator style={styles.spinner} />;
+      return <ActivityIndicator />;
     }
     return null;
   },

Examples/UIExplorer/js/ImageExample.js

@@ -165,7 +165,7 @@ var MultipleSourcesExample = React.createClass({
   },
   render: function() {
     return (
-      <View style={styles.container}>
+      <View>
         <View style={{flexDirection: 'row', justifyContent: 'space-between'}}>
           <Text
             style={styles.touchableText}
@@ -180,7 +180,7 @@ var MultipleSourcesExample = React.createClass({
         </View>
         <Text>Container image size: {this.state.width}x{this.state.height} </Text>
         <View
-          style={[styles.imageContainer, {height: this.state.height, width: this.state.width}]} >
+          style={{height: this.state.height, width: this.state.width}} >
           <Image
             style={{flex: 1}}
             source={[

Examples/UIExplorer/js/NavigatorIOSExample.js

@@ -217,7 +217,6 @@ const NavigatorIOSExample = React.createClass({
           component: NavigatorIOSExamplePage,
           passProps: {onExampleExit},
         }}
-        itemWrapperStyle={styles.itemWrapper}
         tintColor="#008888"
       />
     );

Examples/UIExplorer/js/WebViewExample.js

@@ -178,8 +178,8 @@ var Button = React.createClass({
   render: function() {
     return (
       <TouchableWithoutFeedback onPress={this._handlePress}>
-        <View style={[styles.button, this.props.enabled ? {} : styles.buttonDisabled]}>
-          <Text style={styles.buttonText}>{this.props.text}</Text>
+        <View style={styles.button}>
+          <Text>{this.props.text}</Text>
         </View>
       </TouchableWithoutFeedback>
     );

Examples/UIExplorer/js/XHRExample.ios.js

@@ -379,7 +379,7 @@ class FormUploader extends React.Component {
     }
     return (
       <View>
-        <View style={[styles.paramRow, styles.photoRow]}>
+        <View style={styles.paramRow}>
           <Text style={styles.photoLabel}>
             Random photo from your library
             (<Text style={styles.textButton} onPress={this._fetchRandomPhoto}>

Libraries/StyleSheet/StyleSheet.js

@@ -160,8 +160,8 @@ module.exports = {
   /**
    * Creates a StyleSheet style reference from the given object.
    */
-  create(obj: {[key: string]: any}): {[key: string]: number} {
-    var result = {};
+  create<T: Object, U>(obj: T): {[key:$Keys<T>]: number} {
+    var result: T = (({}: any): T);
     for (var key in obj) {
       StyleSheetValidation.validateStyle(key, obj);
       result[key] = ReactNativePropRegistry.register(obj[key]);