Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

railFillBackgroundColor is dissapeared #95

Open
tytn9197 opened this issue Jul 21, 2022 · 2 comments
Open

railFillBackgroundColor is dissapeared #95

tytn9197 opened this issue Jul 21, 2022 · 2 comments
Labels
bug Something isn't working

Comments

@tytn9197
Copy link

tytn9197 commented Jul 21, 2022

VERSION
node: v8.13.0
"react": "16.8.6",
"react-native": "0.60.4",
"rn-swipe-button": "^1.3.6",

Describe the bug
After swiping for a few times, the railFillBackgroundColor is disappeared. (On both iOS and Android)

Screen Shot 2022-07-21 at 15 28 55

Video
https://user-images.githubusercontent.com/53001193/180167681-bc77b630-6a24-4230-8eeb-a7128f3b2203.mov

Expected behavior
Always show the railFillBackgroundColor

CODE

const handleSwipeSuccess = () => {
setIsStarted((prev) => !prev);
};

renderThumbComponent function will return:

//  
// <View style={s.thumbComponent}>
//    <Image
//      style={s.thumbComponentIcon}
//      source={IMAGE.ICON_RIGHT_ARROW_X2}
//    />
//  </View>

<SwipeButton
height={verticalScale(60)}
width={"90%"}
title={isStarted ? "End" : "Start"}
titleStyles={styles.sliderTitle}
railBackgroundColor={themes.SWIPE_BACKGROUND_COLOR}
railBorderColor={themes.VIOLET_COLOR}
railFillBorderColor={themes.VIOLET_COLOR}
railFillBackgroundColor={themes.VIOLET_COLOR}
thumbIconComponent={renderThumbComponent}
thumbIconBorderColor={themes.VIOLET_COLOR}
thumbIconBackgroundColor={themes.VIOLET_COLOR}
onSwipeSuccess={handleSwipeSuccess}
screenReaderEnabled={true}
shouldResetAfterSuccess={true}
resetAfterSuccessAnimDelay={50} //50ms
resetAfterSuccessAnimDuration={50} //50ms
swipeSuccessThreshold={80} //Swiping 80% will be considered as successful swipe
/>

STYLES:
sliderTitle: {
fontFamily: themeConstants.FontFamily.montserrat,
fontWeight: themeConstants.FontWeight.w600,
lineHeight: fontSizeScale(32),
fontSize: fontSizeScale(24),
color: themes.VIOLET_COLOR,
}

thumbComponent: {
backgroundColor: themes.VIOLET_COLOR,
borderRadius:
Math.round(Dimensions.get("window").width + Dimensions.get("window").height) / 2, //create a circle
margin: verticalScale(10),
}

thumbComponentIcon: {
width: verticalScale(29),
height: verticalScale(29),
}

@tytn9197
Copy link
Author

tytn9197 commented Aug 1, 2022

I fixed it.

Comment some code in the ./src/components/SwipeThumb/index.js
Screen Shot 2022-08-01 at 10 33 07

@UdaySravanK UdaySravanK added the bug Something isn't working label May 13, 2023
@ElpayetSupervan
Copy link
Contributor

Thanks @tytn9197

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

3 participants