I want to make horizontal ScrollView with 6 TouchableOpacity element's; onPress they would change some redux state, and then, chenge they own style, how to force list KEEP position on rerender? Now if I press after some scrolling it goes back to the start

I want this look something like category choosing in Play Market, but without centering, it just need keeps the position

here how it looks

    <ScrollView 
style={{ height: 50, width: '100%' }} 
contentContainerStyle={{ alignItems: 'center' }} 
horizontal={true} 
showsHorizontalScrollIndicator={false}
>
  <TouchableOpacity
    style={categoryNumber === 0 ? styles.BtnActive : styles.Btn}
    onPress={() => dispatch(setCategoryNumber(0))}>
    <Text style={categoryNumber === 0 ? styles.BtnTextActive : styles.BtnText}>ITEM_NAME 1</Text>
  </TouchableOpacity>
  <TouchableOpacity
    style={categoryNumber === 1 ? styles.BtnActive : styles.Btn}
    onPress={() => dispatch(setCategoryNumber(1))}>
    <Text style={categoryNumber === 1 ? styles.BtnTextActive : styles.BtnText}>ITEM_NAME 2</Text>
  </TouchableOpacity>
  <TouchableOpacity
    style={categoryNumber === 2 ? styles.BtnActive : styles.Btn}
    onPress={() => dispatch(setCategoryNumber(2))}>
    <Text style={categoryNumber === 2 ? styles.BtnTextActive : styles.BtnText}>ITEM_NAME 3</Text>
  </TouchableOpacity>
  <TouchableOpacity
    style={categoryNumber === 3 ? styles.BtnActive : styles.Btn}
    onPress={() => dispatch(setCategoryNumber(3))}>
    <Text style={categoryNumber === 3 ? styles.BtnTextActive : styles.BtnText}>ITEM_NAME 4</Text>
  </TouchableOpacity>
    <TouchableOpacity
    style={categoryNumber === 4 ? styles.BtnActive : styles.Btn}
    onPress={() => {dispatch(setCategoryNumber(4))}}>
    <Text style={categoryNumber === 4 ? styles.BtnTextActive : styles.BtnText}>ITEM_NAME 5</Text>
  </TouchableOpacity>
    <TouchableOpacity
    style={categoryNumber === 5 ? styles.BtnActive : styles.Btn}
    onPress={() => {dispatch(setCategoryNumber(5))}}>
    <Text style={categoryNumber === 5 ? styles.BtnTextActive : styles.BtnText}>ITEM_NAME 6</Text>
  </TouchableOpacity>
</ScrollView>


const styles = StyleSheet.create({
  Btn: {
    height: 40,
    backgroundColor: '#F1F5FE',
    paddingHorizontal: 10,
    justifyContent: 'center',
    borderRadius: 12,
    marginHorizontal: 4
  },
  BtnText: {
    color: '#000'
  },
  BtnActive: {
    height: 40,
    backgroundColor: '#336FEE',
    paddingHorizontal: 10,
    justifyContent: 'center',
    borderRadius: 12,
    marginHorizontal: 4
  },
  BtnTextActive: {
    color: '#fff'
  }
})