githuboftigran / rn-range-slider

A native slider with range
MIT License
242 stars 135 forks source link

How to know which thumb is high and which is low #128

Closed jamieGardyn closed 2 years ago

jamieGardyn commented 2 years ago

I need to have a different style for the low and high thumb. How can this be detected in the component?

jamieGardyn commented 2 years ago

To handle this scenario I added renderThumbHigh and updated the code accordingly, but had to remove it as a package to be sure it is not overwritten.

<RangeSlider
      style={styles.slider}
      selectionColor="#fff"
      min={min}
      max={max}
      minRange={15}
      step={1}
      floatingLabel
      renderThumb={renderThumb}
      renderThumbHigh={renderThumbHigh}
      renderRail={renderRail}
      renderRailSelected={renderRailSelected}
      renderLabel={renderLabel}
      renderNotch={renderNotch}
      onValueChanged={handleValueChange}
    />

then I added renderThumHigh in the index.js of rn-range-slider const highThumb = renderThumbHigh();

githuboftigran commented 2 years ago

@jamieGardyn , just published 2.2.2 version. Added parameter name to renderThumb.