fix keyboard progress increment getting stuck at 6

[vafada]

Summary:

This fixes #155

see #155 (comment) for details of the issue

The gist of it, on initial load ReactSlider calls

setMax(128) due to DEFAULT_TOTAL_STEPS = 128

which calls the AbsSeekBar.java's setMax()

https://cs.android.com/android/platform/superproject/main/+/main:frameworks/base/core/java/android/widget/AbsSeekBar.java;l=586-595;drc=c8c729556d69aa27fff24e5412140563fc1527af

and internally updates mKeyProgressIncrement to 6

that causes keyboard input to jump 6 steps:

https://android.googlesource.com/platform/frameworks/base/+/711efaa0297f845c60a1de0acce680493f90bf02/core/java/android/widget/AbsSeekBar.java#1053

after setting ReactSlider.setMaxValue, if max is not high enough, the keyProgressIncrement will still get stuck at 6

due to this logic in AbsSeekBar:

https://android.googlesource.com/platform/frameworks/base/+/711efaa0297f845c60a1de0acce680493f90bf02/core/java/android/widget/AbsSeekBar.java#590

Test Plan:

Render a simple Slider

import React, {useState} from 'react';
import {
  SafeAreaView,
  StyleSheet,
  Text,
  View,
} from 'react-native';

import Slider from '@react-native-community/slider';

const App = () => {
  const [value, setValue] = useState(10);


  return (
    <SafeAreaView style={styles.homeScreenContainer}>
      <View>
        <Text testID="testTextId" style={styles.title}>
          Value: {value}
        </Text>
        <Slider
          step={1}
          maximumValue={30}
            minimumValue={0}
            style={styles.slider}
            value={value}
            thumbTintColor={pageViewPositionSlider.thumbColor}
            maximumTrackTintColor={pageViewPositionSlider.trackColor}
            minimumTrackTintColor={pageViewPositionSlider.trackColor}
          onValueChange={setValue}
        />
      </View>
    </SafeAreaView>
  );
};

export default App;

const pageViewPositionSlider = {
  trackColor: '#ABABAB',
  thumbColor: '#1411AB',
  style: {
    width: '100%',
  },
};

const styles = StyleSheet.create({
  slider: {
    width: '100%',
  },
  pagerViewContainer: {
    flex: 1,
  },
  homeScreenContainer: {
    flex: 1,
  },
  scrollView: {
    backgroundColor: '#F5FCFF',
  },
  container: {
    justifyContent: 'center',
    alignItems: 'center',
    paddingVertical: 20,
  },
  title: {
    fontSize: 30,
    color: pageViewPositionSlider.thumbColor,
    textAlign: 'center',
    width: '100%',
    marginVertical: 20,
  },
  instructions: {
    textAlign: 'center',
    color: '#333333',
    marginBottom: 5,
    fontSize: 20,
  },
  sliderWidget: {
    marginVertical: 30,
  },
});

use the keyboard to navigate to the slider (tabs on android or use a virtual keyboard)

Verify that LEFT and RIGHT arrow moves the thumb according to the step prop

[BartoszKlonowski]

This looks decent and works like a charm!
I would keep the explanation of the fix in the commit message or PR description (which is well written - thank you!) instead of putting it in the code, as after some time and multiple fixes it would get noisy with all the comments.