Pull in changes for 0.3.0

android/app/build.gradle

@@ -75,4 +75,6 @@ dependencies {
     compile fileTree(dir: "libs", include: ["*.jar"])
     compile "com.android.support:appcompat-v7:23.0.1"
     compile "com.facebook.react:react-native:0.17.+"
+    compile project(':react-native-android-statusbar')
+    compile project(':react-native-splashscreen')
 }

android/app/src/main/java/com/demoapp/MainActivity.java

@@ -11,6 +11,9 @@
 import com.facebook.react.shell.MainReactPackage;
 import com.facebook.soloader.SoLoader;
 
+import me.neo.react.StatusBarPackage;
+import com.remobile.splashscreen.*;
+
 public class MainActivity extends Activity implements DefaultHardwareBackBtnHandler {
 
     private ReactInstanceManager mReactInstanceManager;
@@ -26,6 +29,8 @@ protected void onCreate(Bundle savedInstanceState) {
                 .setBundleAssetName("index.android.bundle")
                 .setJSMainModuleName("index.android")
                 .addPackage(new MainReactPackage())
+                .addPackage(new StatusBarPackage(this))
+                .addPackage(new RCTSplashScreenPackage(this))
                 .setUseDeveloperSupport(BuildConfig.DEBUG)
                 .setInitialLifecycleState(LifecycleState.RESUMED)
                 .build();

android/settings.gradle

@@ -1,3 +1,8 @@
 rootProject.name = 'DemoApp'
 
 include ':app'
+include ':react-native-android-statusbar'
+include ':react-native-splashscreen'
+
+project(':react-native-android-statusbar').projectDir = new File(settingsDir, '../node_modules/react-native-android-statusbar')
+project(':react-native-splashscreen').projectDir = new File(rootProject.projectDir, '../node_modules/@remobile/react-native-splashscreen/android')

index.android.js

@@ -1,5 +1,4 @@
 import React, { AppRegistry, Component, Navigator, DrawerLayoutAndroid, ScrollView, View, Text } from 'react-native';
-
 import { Toolbar } from './src/components';
 
 import Navigation from './src/scenes/Navigation';

package.json

@@ -6,8 +6,10 @@
     "start": "react-native start"
   },
   "dependencies": {
+    "@remobile/react-native-splashscreen": "^1.0.3",
     "alt": "^0.18.1",
     "react-native": "^0.17.0",
-    "react-native-material-design": "^0.2.1"
+    "react-native-android-statusbar": "^0.1.2",
+    "react-native-material-design": "^0.3.0"
   }
 }

src/actions/AppActions.js

@@ -1,4 +1,6 @@
 import alt from '../alt';
+import StatusBarAndroid from 'react-native-android-statusbar';
+import { COLOR } from 'react-native-material-design';
 
 class AppActions {
 
@@ -7,6 +9,7 @@ class AppActions {
     }
 
     updateTheme(name) {
+        StatusBarAndroid.setHexColor(COLOR[`${name}700`].color);
         return name;
     }
 

src/components/Toolbar.js

@@ -50,7 +50,7 @@ export default class Toolbar extends Component {
                 onIconPress={onIconPress}
                 actions={[{
                     icon: 'warning',
-                    counter: counter,
+                    badge: { value: counter },
                     onPress: this.increment
                 }]}
                 style={{

src/scenes/Avatars.js

@@ -1,4 +1,4 @@
-import React, { Component, View } from 'react-native';
+import React, { Component, View, Image } from 'react-native';
 import { Avatar, Subheader, COLOR } from 'react-native-material-design';
 
 export default class Avatars extends Component {
@@ -8,10 +8,10 @@ export default class Avatars extends Component {
             <View>
                 <Subheader text="Avatar with external image"/>
                 <View style={styles.avatarContainer}>
-                    <Avatar src="https://s3.amazonaws.com/uifaces/faces/twitter/ok/128.jpg"/>
-                    <Avatar src="https://s3.amazonaws.com/uifaces/faces/twitter/pixeliris/128.jpg"/>
-                    <Avatar src="https://s3.amazonaws.com/uifaces/faces/twitter/sillyleo/128.jpg"/>
-                    <Avatar src="https://s3.amazonaws.com/uifaces/faces/twitter/iannnnn/128.jpg"/>
+                    <Avatar image={<Image source={{ uri: 'https://s3.amazonaws.com/uifaces/faces/twitter/ok/128.jpg' }} />} />
+                    <Avatar image={<Image source={{ uri: 'https://s3.amazonaws.com/uifaces/faces/twitter/pixeliris/128.jpg' }} />} />
+                    <Avatar image={<Image source={{ uri: 'https://s3.amazonaws.com/uifaces/faces/twitter/sillyleo/128.jpg' }} />} />
+                    <Avatar image={<Image source={{ uri: 'https://s3.amazonaws.com/uifaces/faces/twitter/iannnnn/128.jpg' }} />} />
                 </View>
 
                 <Subheader text="Avatar with MaterialIcon"/>
@@ -23,10 +23,10 @@ export default class Avatars extends Component {
                 </View>
                 <Subheader text="Avatar with different sizes"/>
                 <View style={styles.avatarContainer}>
-                    <Avatar src="http://facebook.github.io/react-native/img/opengraph.png?2"/>
-                    <Avatar size={60} src="http://facebook.github.io/react-native/img/opengraph.png?2"/>
-                    <Avatar size={80} src="http://facebook.github.io/react-native/img/opengraph.png?2"/>
-                    <Avatar size={120} src="http://facebook.github.io/react-native/img/opengraph.png?2"/>
+                    <Avatar image={<Image source={{ uri: 'http://facebook.github.io/react-native/img/opengraph.png?2' }} />} />
+                    <Avatar size={60} image={<Image source={{ uri: 'http://facebook.github.io/react-native/img/opengraph.png?2' }} />} />
+                    <Avatar size={80} image={<Image source={{ uri: 'http://facebook.github.io/react-native/img/opengraph.png?2' }} />} />
+                    <Avatar size={120} image={<Image source={{ uri: 'http://facebook.github.io/react-native/img/opengraph.png?2' }} />} />
                 </View>
             </View>
         );

src/scenes/Buttons.js

@@ -1,4 +1,4 @@
-import React, { Component, PropTypes, View, Text, IntentAndroid, InteractionManager } from 'react-native';
+import React, { Component, PropTypes, View, Text, IntentAndroid, InteractionManager, Alert, TouchableNativeFeedback } from 'react-native';
 import { Button, Subheader, COLOR } from 'react-native-material-design';
 
 import AppStore from '../stores/AppStore';
@@ -12,9 +12,9 @@ export default class Buttons extends Component {
             <View>
                 <Subheader text="Light Theme"/>
                 <View style={styles.content}>
-                    <Button value="NORMAL FLAT" primary={theme} onPress={()=> console.log(this.refs)}/>
-                    <Button value="DISABLED FLAT" primary={theme} disabled={true}/>
+                    <Button value="NORMAL" primary={theme} />
                     <Button value="NORMAL RAISED" primary={theme} raised={true}/>
+                    <Button value="DISABLED" primary={theme} disabled={true}/>
                     <Button value="DISABLED RAISED" primary={theme} disabled={true} raised={true}/>
                 </View>
                 <Subheader text="Dark Theme"/>

src/scenes/IconToggles.js

@@ -0,0 +1,135 @@
+import React, { Component, View, Image } from 'react-native';
+import { Avatar, Subheader, COLOR, IconToggle, Icon } from 'react-native-material-design';
+
+export default class IconToggles extends Component {
+
+    render() {
+        return (
+            <View>
+                <Subheader text="Icons"/>
+                <View style={styles.avatarContainer}>
+                    <IconToggle color="paperGrey900">
+                        <Icon
+                            name="business"
+                            color="paperGrey900"
+                            style={styles.icon}
+                        />
+                    </IconToggle>
+                    <IconToggle color="paperGrey900">
+                        <Icon
+                            name="call"
+                            color="paperGrey900"
+                            style={styles.icon}
+                        />
+                    </IconToggle>
+                    <IconToggle color="paperGrey900">
+                        <Icon
+                            name="call-made"
+                            color="paperGrey900"
+                            style={styles.icon}
+                        />
+                    </IconToggle>
+                </View>
+                <Subheader text="Icons with Color"/>
+                <View style={styles.avatarContainer}>
+                    <IconToggle color="paperRed">
+                        <Icon
+                            name="chat"
+                            color="paperRed"
+                            style={styles.icon}
+                        />
+                    </IconToggle>
+                    <IconToggle color="paperBrown">
+                        <Icon
+                            name="clear-all"
+                            color="paperBrown"
+                            style={styles.icon}
+                        />
+                    </IconToggle>
+                    <IconToggle color="paperOrange">
+                        <Icon
+                            name="location-on"
+                            color="paperOrange"
+                            style={styles.icon}
+                        />
+                    </IconToggle>
+                </View>
+                <Subheader text="Contrasting Icons"/>
+                <View style={styles.avatarContainer}>
+                    <IconToggle color="googleBlue">
+                        <Icon
+                            name="present-to-all"
+                            color="paperGrey"
+                            style={styles.icon}
+                        />
+                    </IconToggle>
+                    <IconToggle color="paperPink">
+                        <Icon
+                            name="speaker-phone"
+                            color="paperTeal"
+                            style={styles.icon}
+                        />
+                    </IconToggle>
+                    <IconToggle color="paperAmber">
+                        <Icon
+                            name="swap-calls"
+                            color="paperRed"
+                            style={styles.icon}
+                        />
+                    </IconToggle>
+                </View>
+                <Subheader text="Icons with a badge"/>
+                <View style={styles.avatarContainer}>
+                    <IconToggle
+                        color="paperGrey900"
+                        badge={{ value: 8 }}
+                    >
+                        <Icon
+                            name="live-help"
+                            color="paperGrey900"
+                            style={styles.icon}
+                        />
+                    </IconToggle>
+                    <IconToggle
+                        color="paperGrey900"
+                        badge={{
+                            value: 10,
+                            backgroundColor: '#000000'
+                        }}>
+                        <Icon
+                            name="import-export"
+                            color="paperGrey900"
+                            style={styles.icon}
+                        />
+                    </IconToggle>
+                    <IconToggle
+                        color="paperGrey900"
+                        badge={{
+                            value: 10,
+                            backgroundColor: '#ffffff',
+                            textColor: '#000000'
+                        }}
+                    >
+                        <Icon
+                            name="forum"
+                            color="paperGrey900"
+                            style={styles.icon}
+                        />
+                    </IconToggle>
+                </View>
+            </View>
+        );
+    }
+}
+
+const styles = {
+    avatarContainer: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        justifyContent: 'space-between',
+        paddingHorizontal: 16
+    },
+    icon: {
+        margin: 16
+    }
+};