avishain / react-native-range-slider-expo

Customizable range slider for react native apps
MIT License
29 stars 12 forks source link

Styling labels #6

Closed melissafzhang closed 4 years ago

melissafzhang commented 4 years ago

Hi,

Is there a way to style the labels? I want the labels to just sit on top of the knobs without the balloons.

I'm also having an issue where the labels are not centered over the knobs.

Screen Shot 2020-09-24 at 10 53 34 AM

Thanks!

avishain commented 4 years ago

Hi,

Thank you for raising this bug (of the labelnot centered over the knob). Was fixed in latest version (released couple of minutes ago).

About the labels styling - you can do => "valueLabelsBackgroundColor: 'transparent'" and then you'll get the labels without the balloon. If you meant something else please add a small sketch.

melissafzhang commented 4 years ago

Thanks! Looking for something like this

Screen Shot 2020-09-24 at 1 08 58 PM
avishain commented 4 years ago

I see. Set the label background color to 'transparent' and the text color to this purple and then to lower the labels you can easily create it by adjusting the code of the componen - look for the 'TextInput' components (rows no. around 240) and change the 'bottom' property of the style. Change it from 25 to 8 (or some other number. see the effect and change accordingly).

jarink commented 2 years ago

@avishain can we make any props for changing bottom and font size for the balloon, or pass any props for styles changes?