1.0.0 • Published 7 years ago
react-native-rtl-slider v1.0.0
react-native-rtl-slider
Getting started
$ npm install react-native-rtl-slider
OR
$ yarn add react-native-rtl-slider
Usage
import RtlSlider from "react-native-rtl-slider";
export default class App extends Component {
render() {
return (
<View style={styles.container}>
<View
style={{
height: 100,
width: 100,
justifyContent: "center",
alignItems: "center"
}}
>
<Slider
AIVisibleArea={16}
data={[1, 2, 3, 4, 5, 6]}
renderItem={() => (
<View
style={{ flex: 1, backgroundColor: "red", borderRadius: 10 }}
/>
)}
rtl
style={{ width: SCREEN.width, height: 100 }}
itemCount={2}
paginationCount={2}
separatorWidth={8}
/>
</View>
</View>
);
}
}props
| prop | desc | example | required |
|---|---|---|---|
| style | component general style | {height:200} | NO |
| data | array of slides data | {title:'myTitle'},{title:'yourTitle'} | YES |
| renderItem | sliderItem returner function | ()=> | YES |
| rtl | right to left identifier(Boolean) | true | NO |
| AIVisibleArea | adjust item visible area (number) | 16 | NO |
| itemCount | amount of views getting shown by each scroll | 2 | NO |
| paginationCount | amount of views getting passed by each scroll | 2 | NO |
| separatorWidth | space between items | 8 | NO |
| title | title text of slider | string | NO |
| textTitleStyle | style of title text of slider | {} | NO |
1.0.0
7 years ago