bug: Cant change tint of a image in dynamic

MS0015 commented 3 weeks ago

What's happening?

When I change the tint color for the active tab, it remains the same as the initial color that was set.

Reproduceable Code

<TurboImage
              source={{ uri: 'https://i.ibb.co/qsghqnX/addPost.png' }}
              style={{ width: size, height: size }}
              tint={focused ? COLOR.PRIMARY : COLOR.BLACK}
              resizeMode="contain"
            />

Relevant log output

nothing

Device

iPhone xs

TurboImage Version

1.17.1

Can you reproduce this issue in the TurboImage Example app?

No, I cannot reproduce the issue in the Example app

duguyihou commented 3 weeks ago

Thanks for raising this issue. I did a test, seems it only happens on iOS. I will create a new version with the fix.

https://github.com/user-attachments/assets/2db3db44-28c6-46e4-b6a0-88fa87c83b93

    <View style={styles.container}>
      <Card
        source={{
          uri: 'https://placedog.net/300/300?id=121',
        }}
        style={styles.image}
        cachePolicy="dataCache"
        onStart={handleStart}
        onSuccess={handleSuccess}
        onCompletion={handleCompletion}
        tint={tint ? 'red' : 'black'}
        placeholder={{
          blurhash: 'UBIr4u9}00Rj?yEzxu%LIQ%1%6xt-ks,tAIU',
        }}
      />

      {start && <Text>Start at {Date()}</Text>}
      {information?.width && <Text>width: {information?.width}</Text>}
      {information?.height && <Text>height: {information?.height}</Text>}
      {information?.source && <Text>source: {information?.source}</Text>}
      {completion && <Text>Complete at {Date()}</Text>}
      <TouchableOpacity onPress={() => setTint(!tint)}>
        <Text style={{ fontSize: 32 }}>Change Tint Color</Text>
      </TouchableOpacity>
    </View>

duguyihou commented 3 weeks ago

dynamic tint color in iOS

https://github.com/user-attachments/assets/10155751-a957-4ee6-b909-fbdcfd06c781

duguyihou commented 3 weeks ago

Let me know if you still have this issue with v1.17.2 😃

duguyihou / react-native-turbo-image