react-native-color-picker icon indicating copy to clipboard operation
react-native-color-picker copied to clipboard

How to label the sliders

Open Jake-Mulhern opened this issue 3 years ago • 1 comments

I would like to label each of the sliders so that users can tell what each one controls.

How would I do this so that I can change the text that appears above each individual slider? Here is my code so far.

<ColorPicker
      sliderComponent={renderSliderComponent}
      onColorSelected={color => alert(`Color selected: ${color}`)}
      onColorChange={color => setNewPaletteColor(fromHsv(color))}
      style={{ flex: 1, height: 400, width: 300 }}
      defaultColor={selectedColor}
/>
const renderSliderComponent = () => {
    return (
      <View>
        <Text>Testing</Text>
        <Slider 
          minimumTrackTintColor={theme.colors.medium}
        />
      </View>
    )
  }

Jake-Mulhern avatar Oct 13 '22 19:10 Jake-Mulhern

I guess there is no straight-forward solution. But you can still use hideSliders=true and render the sliders yourself and use controlled version of the component.

sodik82 avatar Oct 13 '22 19:10 sodik82