如何自定义react-native-snap-slider的样式

Question

我正在使用react-native-snap-slider，现在我想根据我的设计自定义此滑块。

我希望滑块像这样

这是我的输出

我希望滑块颜色为灰色，但默认情况下为绿色。 我尝试更改颜色，但没有更改

这是我的代码

import React, { Component } from 'react';
import SnapSlider from 'react-native-snap-slider';

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

export default class App extends Component {
  sliderOptions = [
      { value: 0, label: '10mi.' },
      { value: 1, label: '25mi.' },
      { value: 2, label: '50mi.' },
      { value: 3, label: '75mi.' },
      { value: 4, label: '150mi.' }
  ];

  constructor(props) {
    super(props);
    this.state = this.getInitialState();
    this.slidingComplete = this.slidingComplete.bind(this);
  }

  getInitialState() {
      return {
          defaultItem: 2
      };
  }

  slidingComplete(itemSelected) {
      console.log("slidingComplete");
      console.log("item selected " + this.refs.slider.state.item);
      console.log("item selected(from callback)" + itemSelected);
      console.log("value " + this.sliderOptions[this.refs.slider.state.item].value);
  }

  render() {
    return (
        <View style={styles.container}>
            <Text style={styles.welcome}>
                SnapSlider Example!
            </Text>
            <SnapSlider ref="slider" containerStyle={styles.snapsliderContainer} style={styles.snapslider}
                itemWrapperStyle={styles.snapsliderItemWrapper}
                thumbTintColor='red'
                itemStyle={styles.snapsliderItem}
                selectedStyle={styles.selectedStyle}
                items={this.sliderOptions}
                labelPosition="top"
                defaultItem={this.state.defaultItem}
                onSlidingComplete={this.slidingComplete} />
        </View>
    );
  }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#F5FCFF'
    },
    welcome: {
        fontSize: 20,
        textAlign: 'center',
        margin: 10
    },

    snapsliderContainer: {
        borderWidth: 0,
        backgroundColor: 'transparent',
    },
    snapslider: {
        borderWidth: 10,
      borderColor: 'red',


    },
    snapsliderItemWrapper: {
        borderWidth: 0,
       margin: 10
    },
    snapsliderItem: {
        borderWidth: 0,

    },

});

任何人都可以告诉我如何实现这一目标