rn-range-slider icon indicating copy to clipboard operation
rn-range-slider copied to clipboard

How to know which thumb is high and which is low

Open jamieGardyn opened this issue 2 years ago • 1 comments

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

jamieGardyn avatar Jul 25 '22 20:07 jamieGardyn

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();

jamieGardyn avatar Jul 25 '22 22:07 jamieGardyn

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

githuboftigran avatar Sep 16 '22 07:09 githuboftigran