Я использую компонент Native Base Segment
, но мне нужно добавить скользящую анимацию между сегментами.
Вот мой текущий код
<Segment style={{ backgroundColor: 'rgba(52, 52, 52, 0)' }}>
<Button
first
active={this.state.seg === 1 ? true : false}
onPress={() => this.setState({ seg: 1 })}
style={[styles.tabComponent, { backgroundColor: this.state.seg === 1 ? "#0022FF" : "rgba(52, 52, 52, 0)", }]}
>
<Text style={{ color: this.state.seg === 1 ? "#FFFFFF" : "#8F8F8F" }}>Puppies</Text>
</Button>
<Button
active={this.state.seg === 2 ? true : false}
onPress={() => this.setState({ seg: 2 })}
style={[styles.tabComponent, { backgroundColor: this.state.seg === 2 ? "#0022FF" : "rgba(52, 52, 52, 0)", }]}
>
<Text style={{ color: this.state.seg === 2 ? "#FFFFFF" : "#8F8F8F" }}>Kittens</Text>
</Button>
</Segment>
Я думал об удалении active color
кнопок и добавление Animated.View
, которое скользит в зависимости от активного сегмента.
Есть мысли?