diff --git a/Example/AnimatedSegmentControl/App.js b/Example/AnimatedSegmentControl/App.js index f96cffc..b903f60 100644 --- a/Example/AnimatedSegmentControl/App.js +++ b/Example/AnimatedSegmentControl/App.js @@ -11,8 +11,8 @@ class App extends Component { return ( diff --git a/Example/AnimatedSegmentControl/package.json b/Example/AnimatedSegmentControl/package.json index 5970462..f9b32c5 100644 --- a/Example/AnimatedSegmentControl/package.json +++ b/Example/AnimatedSegmentControl/package.json @@ -9,7 +9,7 @@ "dependencies": { "react": "16.8.3", "react-native": "0.59.10", - "react-native-animated-segment-control": "^1.0.7" + "react-native-animated-segment-control": "^1.0.8" }, "devDependencies": { "@babel/core": "^7.5.4", diff --git a/package.json b/package.json index e4c9dec..2d92fce 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-native-animated-segment-control", - "version": "1.0.7", + "version": "1.0.8", "description": "A custom `SegmentControl` component, pretty much similar to native's SegmentControl but with animation", "main": "index.js", "scripts": { diff --git a/src/SegmentControl/index.android.js b/src/SegmentControl/index.android.js index 1e98851..f01b3bb 100644 --- a/src/SegmentControl/index.android.js +++ b/src/SegmentControl/index.android.js @@ -39,7 +39,7 @@ class SegmentControl extends React.Component { this.setState( prevState => ({ selectedIndex: index, - activeSegmentPosition: { x: prevState.segmentDimension.width * (index - 1), y: 0 } + activeSegmentPosition: { x: -(this.state.segmentDimension.width * (this.props.values.length / 2 - 0.5)) + this.state.segmentDimension.width * index, y: prevState.activeSegmentPosition.y } }), animate ) @@ -56,7 +56,7 @@ class SegmentControl extends React.Component { const animate = () => { Animated.timing(this.state.positionAnimationValue, { - toValue: segmentWidth * (this.state.selectedIndex - 1), + toValue: -(segmentWidth * (this.props.values.length / 2 - 0.5)) + segmentWidth * this.state.selectedIndex, duration: 100 }).start() }