Sharcoux / slider

React-Native and React-Native-Web compatible slider
ISC License
161 stars 31 forks source link

Custom track #93

Closed MattinNajafi closed 9 months ago

MattinNajafi commented 9 months ago

No bug but a question. Is there a way to add trackImage or add a gradient to the track?

I have a design that im trying to reproduce:

Skärmavbild 2024-02-08 kl  14 23 17
Sharcoux commented 9 months ago

Normally, you can try to use minTrackStyle and maxTrackStyle to do the gradient, but I didn't try.

You can use either a CustomThumb or thumbImage to do the thumb.

MattinNajafi commented 9 months ago

What do you mean by using minTrackStyle and maxTrackStyle?

As it is today i dont know a way to add gradient to a ViewProp.

Sharcoux commented 9 months ago

That might work for web, but as long as it is not natively supported by RN, you'll need to rely on react-native-linear-gradient. The issue is that this component doesn't use that component to represent the tracks. What you could try is to apply a gradient over the track with absolute positioning.

Sharcoux commented 9 months ago

You might also try to convince your designer that this gradient will increase the complexity of the project for not so much user benefits, and could be reconsidered.

MattinNajafi commented 9 months ago

True!! You can close this.