Я хочу использовать Slider на Android, используя React Native.
Пользовательские изображения для отслеживания и большие пальцы - это только свойства iOS, поэтому каковы доступные опции на Android для стилей дорожки и большого пальца?
В частности, я ищу способ изменить цвет большого пальца, цвет минимальной/максимальной дорожки и их толщину...
Может быть слишком поздно, но будет полезно
Мой CustomSlider.js
import React, { Component } from 'react';
import {
View,
TouchableWithoutFeedback,
TouchableOpacity,
Dimensions,
Text,
Slider
} from 'react-native';
import { connect} from 'react-redux';
import rnfs from 'react-native-fs';
class CustomSlider extends Component {
state={
slideValue: 0,
}
render() {
const width = Dimensions.get('window').width;
const sliderStyle = {
sliderDummy: {
backgroundColor: '#d3d3d3',
width: 300,
height:30,
borderRadius: 50,
position: 'absolute',
},
sliderReal: {
backgroundColor: '#119EC2',
width: (this.state.slideValue/50) * 300,
height:30,
}
}
return(
<View style={{borderRadius: 50, overflow: 'hidden'}}>
<View style={{flexDirection: 'row', position: 'absolute'}}>
<View style={sliderStyle.sliderDummy}></View>
<View style={sliderStyle.sliderReal}></View>
</View>
<Slider
style={{width: 300, height: 30, borderRadius: 50}}
minimumValue={0}
maximumValue={50}
value={this.state.slideValue}
onValueChange={(value)=> this.setState({ slideValue: value}) }
maximumTrackTintColor='transparent'
minimumTrackTintColor='transparent'
/>
</View>
);
}
};
const mapDispatchToProps = {
};
const mapStateToProps = (state) => {
return{
}
};
export default connect(mapStateToProps, mapDispatchToProps)(CustomSlider);
Вы достигнете толщины и пользовательского слайдера, как показано ниже.
Начиная с версии 0.42.0, теперь есть некоторая поддержка для стилизации слайдеров Android с помощью компонента RN Slider.
См. Запрос на извлечение для получения дополнительной информации или документацию для получения дополнительной информации.
Реквизиты, которые должны быть использованы для Android:
Это не первый случай, когда React Native имеет компонент, настраиваемый только на одной платформе. Пока React Native не добавит поддержки для стилизации компонента Slider, я предлагаю внедрить его как собственный компонент пользовательского интерфейса на Android: https://facebook.github.io/react-native/docs/native-components-android.html
Я знаю, что у меня нет простого решения, но поскольку поддержка Android для React Native была добавлена через iOS, я думаю, что все еще может быть какое-то время, пока она не настигнет.