Change ComparisonSlider.js to get update as lib/ComparisonSlider

react-native-comparison-slider-example/ComparisonSlider.js

@@ -22,13 +22,13 @@ const CroppedImage = function(props) {
 		}, props.style]}>
 
 			<Image 
-				style={[{
+				style={{
 					position: "absolute",
 					top: props.cropTop * -1,
 					left: props.cropLeft * -1,
 					width: props.width,
 					height: props.height
-				}, props.imageStyle]}
+				}}
 				source={props.source}
 				resizeMode={props.resizeMode}>
 					{props.children}
@@ -167,14 +167,14 @@ export default class ComparisonSlider extends Component {
 
 		return (
 			<View>
-				<Image
+				<ImageBackground
 					source={ this.state.rightImage ? this.state.rightImage : { uri: this.state.rightImageURI } }
 					style={[ {
 						width: this.state.imgWidth,
 						height: this.state.imgHeight,
 						backgroundColor: "transparent",
 						justifyContent: "center",
-					}, this.props.imageStyle, this.props.resizeMode && { resizeMode: this.props.resizeMode }]}>
+					}, this.props.imageStyle]}>
 
 					<CroppedImage
 						source={ this.state.leftImage ? this.state.leftImage : { uri: this.state.leftImageURI } }
@@ -184,8 +184,7 @@ export default class ComparisonSlider extends Component {
 						cropWidth={this.state.cropWidth}
 						cropHeight={this.state.imgHeight}
 						width={this.state.imgWidth}
-						height={this.state.imgHeight}
-						imageStyle={!this.props.resizeMode ? undefined : { resizeMode: this.props.resizeMode }} />
+						height={this.state.imgHeight} />
 
 
 						{ this.props.thumnailRender && this.props.thumbnailWidth ? 
@@ -199,6 +198,8 @@ export default class ComparisonSlider extends Component {
 						<Slider
 							value={this.state.value}
 							onValueChange={(value) => this.onChange(value) }
+							onSlidingStart={() => this.props.onSlidingStart && this.props.onSlidingStart()}
+							onSlidingComplete={() => this.props.onSlidingComplete && this.props.onSlidingComplete()}
 							minimumTrackTintColor={this.state.sliderTrackColor}
 							maximumTrackTintColor={this.state.sliderTrackColor}
 							// thumbImage={require("./img/left.jpeg")}
@@ -218,7 +219,7 @@ export default class ComparisonSlider extends Component {
 								width: this.state.imgWidth,
 							}} 
 						/>
-				</Image>
+				</ImageBackground>
 			</View>
 		);
 	}