diff --git a/Examples/UIExplorer/ProgressBarAndroidExample.android.js b/Examples/UIExplorer/ProgressBarAndroidExample.android.js
index 2c172198d..b58cd73ca 100644
--- a/Examples/UIExplorer/ProgressBarAndroidExample.android.js
+++ b/Examples/UIExplorer/ProgressBarAndroidExample.android.js
@@ -20,6 +20,31 @@ var React = require('React');
var UIExplorerBlock = require('UIExplorerBlock');
var UIExplorerPage = require('UIExplorerPage');
+var TimerMixin = require('react-timer-mixin');
+
+var MovingBar = React.createClass({
+ mixins: [TimerMixin],
+
+ getInitialState: function() {
+ return {
+ progress: 0
+ };
+ },
+
+ componentDidMount: function() {
+ this.setInterval(
+ () => {
+ var progress = (this.state.progress + 0.02) % 1;
+ this.setState({progress: progress});
+ }, 50
+ );
+ },
+
+ render: function() {
+ return ;
+ },
+});
+
var ProgressBarAndroidExample = React.createClass({
statics: {
@@ -55,9 +80,25 @@ var ProgressBarAndroidExample = React.createClass({
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
);
},
diff --git a/Libraries/Components/ProgressBarAndroid/ProgressBarAndroid.android.js b/Libraries/Components/ProgressBarAndroid/ProgressBarAndroid.android.js
index 9a07db002..1588d21eb 100644
--- a/Libraries/Components/ProgressBarAndroid/ProgressBarAndroid.android.js
+++ b/Libraries/Components/ProgressBarAndroid/ProgressBarAndroid.android.js
@@ -26,6 +26,18 @@ var STYLE_ATTRIBUTES = [
'LargeInverse'
];
+var indeterminateType = function(props, propName, componentName) {
+ var checker = function() {
+ var indeterminate = props[propName];
+ var styleAttr = props.styleAttr;
+ if (!indeterminate && styleAttr !== 'Horizontal') {
+ return new Error('indeterminate=false is only valid for styleAttr=Horizontal');
+ }
+ };
+
+ return ReactPropTypes.bool(props, propName, componentName) || checker();
+};
+
/**
* React component that wraps the Android-only `ProgressBar`. This component is used to indicate
* that the app is loading or there is some activity in the app.
@@ -62,6 +74,15 @@ var ProgressBarAndroid = React.createClass({
* - LargeInverse
*/
styleAttr: ReactPropTypes.oneOf(STYLE_ATTRIBUTES),
+ /**
+ * If the progress bar will show indeterminate progress. Note that this
+ * can only be false if styleAttr is Horizontal.
+ */
+ indeterminate: indeterminateType,
+ /**
+ * The progress value (between 0 and 1).
+ */
+ progress: ReactPropTypes.number,
/**
* Color of the progress bar.
*/
@@ -75,6 +96,7 @@ var ProgressBarAndroid = React.createClass({
getDefaultProps: function() {
return {
styleAttr: 'Large',
+ indeterminate: true
};
},
diff --git a/ReactAndroid/src/main/java/com/facebook/react/views/progressbar/ProgressBarContainerView.java b/ReactAndroid/src/main/java/com/facebook/react/views/progressbar/ProgressBarContainerView.java
index 08c11902f..233981506 100644
--- a/ReactAndroid/src/main/java/com/facebook/react/views/progressbar/ProgressBarContainerView.java
+++ b/ReactAndroid/src/main/java/com/facebook/react/views/progressbar/ProgressBarContainerView.java
@@ -17,8 +17,12 @@ import com.facebook.react.bridge.JSApplicationIllegalArgumentException;
* Controls an enclosing ProgressBar. Exists so that the ProgressBar can be recreated if
* the style would change.
*/
-class ProgressBarContainerView extends FrameLayout {
+/* package */ class ProgressBarContainerView extends FrameLayout {
+ private static final int MAX_PROGRESS = 1000;
+
private @Nullable Integer mColor;
+ private boolean mIndeterminate = true;
+ private double mProgress;
private @Nullable ProgressBar mProgressBar;
public ProgressBarContainerView(Context context) {
@@ -28,23 +32,35 @@ class ProgressBarContainerView extends FrameLayout {
public void setStyle(@Nullable String styleName) {
int style = ReactProgressBarViewManager.getStyleFromString(styleName);
mProgressBar = new ProgressBar(getContext(), null, style);
+ mProgressBar.setMax(MAX_PROGRESS);
removeAllViews();
addView(
mProgressBar,
new ViewGroup.LayoutParams(
- ViewGroup.LayoutParams.WRAP_CONTENT,
- ViewGroup.LayoutParams.WRAP_CONTENT));
+ ViewGroup.LayoutParams.MATCH_PARENT,
+ ViewGroup.LayoutParams.MATCH_PARENT));
}
public void setColor(@Nullable Integer color) {
this.mColor = color;
}
+ public void setIndeterminate(boolean indeterminate) {
+ mIndeterminate = indeterminate;
+ }
+
+ public void setProgress(double progress) {
+ mProgress = progress;
+ }
+
public void apply() {
if (mProgressBar == null) {
throw new JSApplicationIllegalArgumentException("setStyle() not called");
}
+
+ mProgressBar.setIndeterminate(mIndeterminate);
setColor(mProgressBar);
+ mProgressBar.setProgress((int) (mProgress * MAX_PROGRESS));
}
private void setColor(ProgressBar progressBar) {
diff --git a/ReactAndroid/src/main/java/com/facebook/react/views/progressbar/ReactProgressBarViewManager.java b/ReactAndroid/src/main/java/com/facebook/react/views/progressbar/ReactProgressBarViewManager.java
index 0a26fa49c..01aa4a0b8 100644
--- a/ReactAndroid/src/main/java/com/facebook/react/views/progressbar/ReactProgressBarViewManager.java
+++ b/ReactAndroid/src/main/java/com/facebook/react/views/progressbar/ReactProgressBarViewManager.java
@@ -27,6 +27,8 @@ public class ReactProgressBarViewManager extends
BaseViewManager {
/* package */ static final String PROP_STYLE = "styleAttr";
+ /* package */ static final String PROP_INDETERMINATE = "indeterminate";
+ /* package */ static final String PROP_PROGRESS = "progress";
/* package */ static final String REACT_CLASS = "AndroidProgressBar";
/* package */ static final String DEFAULT_STYLE = "Large";
@@ -51,6 +53,16 @@ public class ReactProgressBarViewManager extends
view.setColor(color);
}
+ @ReactProp(name = PROP_INDETERMINATE)
+ public void setIndeterminate(ProgressBarContainerView view, boolean indeterminate) {
+ view.setIndeterminate(indeterminate);
+ }
+
+ @ReactProp(name = PROP_PROGRESS)
+ public void setProgress(ProgressBarContainerView view, double progress) {
+ view.setProgress(progress);
+ }
+
@Override
public ProgressBarShadowNode createShadowNodeInstance() {
return new ProgressBarShadowNode();