gorhom / react-native-sticky-item

An interactive sticky item inspired by Facebook Stories.
MIT License
891 stars 48 forks source link

fix: sticky item width calculation #13

Closed gorhom closed 4 years ago

gorhom commented 4 years ago

closing #12

hirbod commented 4 years ago

Well this release broke the sticky item for me :/

hirbod commented 4 years ago

IMG_0349

hirbod commented 4 years ago

Even your default FacebookStickyStoryStyled is broken :/ @gorhom https://streamable.com/of3zvg

I can't really understand what happened, but the last updates went smooth but this one not

gorhom commented 4 years ago

hi @Hirbod , sorry to hear that, this actually meant to be a fix, but i think the calculation broke current implementation

i had to redo the Facebook Styled example Simulator Screen Shot - iPhone 11 - 2020-06-01 at 23 28 12

however, i'll try to revert this merge and release it as major

hirbod commented 4 years ago

Look like the issue happens because I've set my stickyItemWidth and height to 32. It works when I set it to 46x46 @gorhom

hirbod commented 4 years ago

Yes, setting to anything lower then 46x46 breaks it, but 46x46 works fine, but even than, I have 2px offset from left

gorhom commented 4 years ago

i have reverted this merge , i'll test it more with small number

gorhom commented 4 years ago

you should be able to get v1.3.1 without this pr

hirbod commented 4 years ago

This is how v.1.3.1 looks now

Here also a video https://streamable.com/ck5v46

hirbod commented 4 years ago

Ok I could fix this by changing

const animatedThumbnailTranslateX = interpolate(x, {
    inputRange: [separatorSize, threshold],
    outputRange: [0, isRTL ? separatorSize : -separatorSize],
    extrapolate: Extrapolate.CLAMP,
  });