diff --git a/docs/components/ActivityIndicator.md b/docs/components/ActivityIndicator.md
index 575a46c8..f8f88272 100644
--- a/docs/components/ActivityIndicator.md
+++ b/docs/components/ActivityIndicator.md
@@ -6,17 +6,17 @@
**animating**: bool = true
-Whether to show the indicator (true, the default) or hide it (false).
+Whether to show the indicator or hide it.
-**color**: string = #999999
+**color**: string = '#1976D2'
-The foreground color of the spinner (default is gray).
+The foreground color of the spinner.
**hidesWhenStopped**: bool = true
-Whether the indicator should hide when not animating (true by default).
+Whether the indicator should hide when not animating.
-**size**: oneOf('small, 'large')
+**size**: oneOf('small, 'large') | number = 'small'
Size of the indicator. Small has a height of `20`, large has a height of `36`.
diff --git a/examples/components/ActivityIndicator/ActivityIndicatorExample.js b/examples/components/ActivityIndicator/ActivityIndicatorExample.js
index d7b3ae0a..66595b56 100644
--- a/examples/components/ActivityIndicator/ActivityIndicatorExample.js
+++ b/examples/components/ActivityIndicator/ActivityIndicatorExample.js
@@ -68,21 +68,6 @@ const examples = [
);
}
},
- {
- title: 'Gray',
- render() {
- return (
-
-
-
-
- );
- }
- },
{
title: 'Custom colors',
render() {
@@ -143,10 +128,13 @@ const examples = [
title: 'Custom size',
render() {
return (
-
+
+
+
+
);
}
},
diff --git a/src/components/ActivityIndicator/index.js b/src/components/ActivityIndicator/index.js
index 4aa52f93..b9453cf9 100644
--- a/src/components/ActivityIndicator/index.js
+++ b/src/components/ActivityIndicator/index.js
@@ -5,24 +5,22 @@ import StyleSheet from '../../apis/StyleSheet';
import View from '../View';
import React, { Component, PropTypes } from 'react';
-const DEFAULT_COLOR = '#1976D2';
const rotationInterpolation = { inputRange: [ 0, 1 ], outputRange: [ '0deg', '360deg' ] };
class ActivityIndicator extends Component {
static propTypes = {
+ ...View.propTypes,
animating: PropTypes.bool,
color: PropTypes.string,
hidesWhenStopped: PropTypes.bool,
- size: PropTypes.oneOf([ 'small', 'large' ]),
- style: View.propTypes.style
+ size: PropTypes.oneOfType([ PropTypes.oneOf([ 'small', 'large' ]), PropTypes.number ])
};
static defaultProps = {
animating: true,
- color: DEFAULT_COLOR,
+ color: '#1976D2',
hidesWhenStopped: true,
- size: 'small',
- style: {}
+ size: 'small'
};
constructor(props) {
@@ -81,7 +79,11 @@ class ActivityIndicator extends Component {
);
return (
-
+
{
animation.setValue(0);
- Animated.sequence([
- Animated.timing(animation, {
- duration: 750,
- easing: Easing.inOut(Easing.linear),
- toValue: 1
- })
- ]).start((event) => {
+ Animated.timing(animation, {
+ duration: 750,
+ easing: Easing.inOut(Easing.linear),
+ toValue: 1
+ }).start((event) => {
if (event.finished) {
cycleAnimation();
}