From 86919ebc0d7d8807c4e8626259ce18e3f860ea0e Mon Sep 17 00:00:00 2001 From: Andrei Ciceu Date: Thu, 29 Jun 2017 16:40:39 +0300 Subject: [PATCH 1/6] Android 0.54.1 fix --- src/CircularProgress.js | 18 +++++------------- 1 file changed, 5 insertions(+), 13 deletions(-) diff --git a/src/CircularProgress.js b/src/CircularProgress.js index 61eb36f..f67bc87 100644 --- a/src/CircularProgress.js +++ b/src/CircularProgress.js @@ -8,16 +8,8 @@ export default class CircularProgress extends React.Component { circlePath(cx, cy, r, startDegree, endDegree) { let p = Path(); - if (Platform.OS === 'ios') { - p.path.push(0, cx + r, cy); - p.path.push(4, cx, cy, r, startDegree * Math.PI / 180, endDegree * Math.PI / 180, 1); - } else { - // For Android we have to resort to drawing low-level Path primitives, as ART does not support - // arbitrary circle segments. It also does not support strokeDash. - // Furthermore, the ART implementation seems to be buggy/different than the iOS one. - // MoveTo is not needed on Android - p.path.push(4, cx, cy, r, startDegree * Math.PI / 180, (startDegree - endDegree) * Math.PI / 180, 0); - } + p.path.push(0, cx + r, cy); + p.path.push(4, cx, cy, r, startDegree * Math.PI / 180, endDegree * Math.PI / 180, 1); return p; } @@ -33,10 +25,10 @@ export default class CircularProgress extends React.Component { render() { const { size, width, tintColor, backgroundColor, style, rotation, linecap, children } = this.props; - const backgroundPath = this.circlePath(size / 2, size / 2, size / 2 - width / 2, 0, 360); + const backgroundPath = this.circlePath(size / 2, size / 2, size / 2 - width / 2, 0, 360 * 99.9 / 100); - const fill = this.extractFill(this.props.fill); - const circlePath = this.circlePath(size / 2, size / 2, size / 2 - width / 2, 0, 360 * fill / 100); + const fill = this.extractFill(this.props.fill); + const circlePath = this.circlePath(size / 2, size / 2, size / 2 - width / 2, 0, (360 * .99) * fill / 100); return ( From dd9c1f8d6a654c5b910e9ec0107e45d9d3ba4fc1 Mon Sep 17 00:00:00 2001 From: Andrei Ciceu Date: Thu, 29 Jun 2017 17:02:58 +0300 Subject: [PATCH 2/6] Replace type props, for React 15.5+ --- src/AnimatedCircularProgress.js | 3 ++- src/CircularProgress.js | 3 ++- 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/src/AnimatedCircularProgress.js b/src/AnimatedCircularProgress.js index 6fcc193..754db01 100644 --- a/src/AnimatedCircularProgress.js +++ b/src/AnimatedCircularProgress.js @@ -1,4 +1,5 @@ -import React, { PropTypes } from 'react'; +import React from 'react'; +import PropTypes from 'prop-types'; import { View, Animated } from 'react-native'; import CircularProgress from './CircularProgress'; const AnimatedProgress = Animated.createAnimatedComponent(CircularProgress); diff --git a/src/CircularProgress.js b/src/CircularProgress.js index f67bc87..698dcf3 100644 --- a/src/CircularProgress.js +++ b/src/CircularProgress.js @@ -1,4 +1,5 @@ -import React, { PropTypes } from 'react'; +import React from 'react'; +import PropTypes from 'prop-types'; import { View, Platform } from 'react-native'; import { Surface, Shape, Path, Group } from '../../react-native/Libraries/ART/ReactNativeART'; import MetricsPath from 'art/metrics/path'; From 8080943e8b514eef999e8ba884cc45e0c62c193a Mon Sep 17 00:00:00 2001 From: Andrei Ciceu Date: Thu, 29 Jun 2017 17:13:46 +0300 Subject: [PATCH 3/6] Modified oneOf to oneOfType for new PropTypes --- src/AnimatedCircularProgress.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/AnimatedCircularProgress.js b/src/AnimatedCircularProgress.js index 754db01..50ed0e9 100644 --- a/src/AnimatedCircularProgress.js +++ b/src/AnimatedCircularProgress.js @@ -61,8 +61,8 @@ AnimatedCircularProgress.propTypes = { fill: PropTypes.number, prefill: PropTypes.number, width: PropTypes.number.isRequired, - tintColor: PropTypes.oneOf([PropTypes.string, PropTypes.object]), - backgroundColor: PropTypes.oneOf([PropTypes.string, PropTypes.object]), + tintColor: PropTypes.oneOfType([PropTypes.string, PropTypes.object]), + backgroundColor: PropTypes.oneOfType([PropTypes.string, PropTypes.object]), tension: PropTypes.number, friction: PropTypes.number } From 6eb1322c1d4a36cda8f78fb9871c3948152b8f0b Mon Sep 17 00:00:00 2001 From: Andrei Ciceu Date: Mon, 10 Jul 2017 12:36:32 +0300 Subject: [PATCH 4/6] Consistent .9999 multiplicaiton --- src/CircularProgress.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/CircularProgress.js b/src/CircularProgress.js index 698dcf3..f7b0eed 100644 --- a/src/CircularProgress.js +++ b/src/CircularProgress.js @@ -26,10 +26,10 @@ export default class CircularProgress extends React.Component { render() { const { size, width, tintColor, backgroundColor, style, rotation, linecap, children } = this.props; - const backgroundPath = this.circlePath(size / 2, size / 2, size / 2 - width / 2, 0, 360 * 99.9 / 100); + const backgroundPath = this.circlePath(size / 2, size / 2, size / 2 - width / 2, 0, 360 * .999); const fill = this.extractFill(this.props.fill); - const circlePath = this.circlePath(size / 2, size / 2, size / 2 - width / 2, 0, (360 * .99) * fill / 100); + const circlePath = this.circlePath(size / 2, size / 2, size / 2 - width / 2, 0, (360 * .999) * fill / 100); return ( From 0d78e71e32356024eca9726961110193706b284d Mon Sep 17 00:00:00 2001 From: Andrei Ciceu Date: Mon, 10 Jul 2017 12:38:57 +0300 Subject: [PATCH 5/6] .9999 --- src/CircularProgress.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/CircularProgress.js b/src/CircularProgress.js index f7b0eed..982365f 100644 --- a/src/CircularProgress.js +++ b/src/CircularProgress.js @@ -26,10 +26,10 @@ export default class CircularProgress extends React.Component { render() { const { size, width, tintColor, backgroundColor, style, rotation, linecap, children } = this.props; - const backgroundPath = this.circlePath(size / 2, size / 2, size / 2 - width / 2, 0, 360 * .999); + const backgroundPath = this.circlePath(size / 2, size / 2, size / 2 - width / 2, 0, 360 * .9999); const fill = this.extractFill(this.props.fill); - const circlePath = this.circlePath(size / 2, size / 2, size / 2 - width / 2, 0, (360 * .999) * fill / 100); + const circlePath = this.circlePath(size / 2, size / 2, size / 2 - width / 2, 0, (360 * .9999) * fill / 100); return ( From 85eb3c4d781cd70b281c0ff080cb7639f8a957f4 Mon Sep 17 00:00:00 2001 From: Jay Stramel Date: Mon, 23 Oct 2017 20:23:11 -0600 Subject: [PATCH 6/6] Using ViewPropTypes.style to fix a production crash issue. --- src/AnimatedCircularProgress.js | 4 ++-- src/CircularProgress.js | 6 +++--- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/src/AnimatedCircularProgress.js b/src/AnimatedCircularProgress.js index 50ed0e9..0707664 100644 --- a/src/AnimatedCircularProgress.js +++ b/src/AnimatedCircularProgress.js @@ -1,6 +1,6 @@ import React from 'react'; import PropTypes from 'prop-types'; -import { View, Animated } from 'react-native'; +import { View, ViewPropTypes, Animated } from 'react-native'; import CircularProgress from './CircularProgress'; const AnimatedProgress = Animated.createAnimatedComponent(CircularProgress); @@ -56,7 +56,7 @@ export default class AnimatedCircularProgress extends React.Component { } AnimatedCircularProgress.propTypes = { - style: View.propTypes.style, + style: ViewPropTypes.style, size: PropTypes.number.isRequired, fill: PropTypes.number, prefill: PropTypes.number, diff --git a/src/CircularProgress.js b/src/CircularProgress.js index 982365f..e76a878 100644 --- a/src/CircularProgress.js +++ b/src/CircularProgress.js @@ -1,6 +1,6 @@ import React from 'react'; import PropTypes from 'prop-types'; -import { View, Platform } from 'react-native'; +import { View, ViewPropTypes, Platform } from 'react-native'; import { Surface, Shape, Path, Group } from '../../react-native/Libraries/ART/ReactNativeART'; import MetricsPath from 'art/metrics/path'; @@ -28,7 +28,7 @@ export default class CircularProgress extends React.Component { const { size, width, tintColor, backgroundColor, style, rotation, linecap, children } = this.props; const backgroundPath = this.circlePath(size / 2, size / 2, size / 2 - width / 2, 0, 360 * .9999); - const fill = this.extractFill(this.props.fill); + const fill = this.extractFill(this.props.fill); const circlePath = this.circlePath(size / 2, size / 2, size / 2 - width / 2, 0, (360 * .9999) * fill / 100); return ( @@ -55,7 +55,7 @@ export default class CircularProgress extends React.Component { } CircularProgress.propTypes = { - style: View.propTypes.style, + style: ViewPropTypes.style, size: PropTypes.number.isRequired, fill: PropTypes.number.isRequired, width: PropTypes.number.isRequired,