search

fixt / react-native-page-swiper

91 stars 47 forks source link

How to change dot position, I want to put page dots at left-bottom not middle. #23

Open LeoTianJob opened 7 years ago

arviteri commented 7 years ago

In your project files, go to YourProject/node_modules/react-native-page-swiper/src/... Open the "Dots.js" file and scroll to the bottom. In styles, change "justifyContent: 'center'" to "justifyContent: 'flex-start'"

LeoTianJob commented 7 years ago

Thanks a lot, but with this method, the dots position also be changed in the other components that use this library. Am I right?

arviteri commented 7 years ago

Yeah anytime that you use Swiper the dots will be on the left. You could instead change justifyContent to "justifyContent: {this.props.DotLocation}" and then go into the Index.js file and where \<Dots... is, add DotLocation={this.props.DotLocation} and then whenever you create a new Swiper, you'll have to add the property "DotLocation" and use some justifyContent value. For example... \<Swiper DotLocation='flex-start'> or \<Swiper DotLocation="flex-end"> etc. Keep in mind that if you do decide to do that, you would need to add a constructor in the Dots.js file, with props in the parameter

LeoTianJob commented 7 years ago

This is quite helpful, thanks for answering.

arviteri commented 7 years ago

Yep!