24ark / react-native-step-indicator

A simple react-native implementation of step indicator widget compatible with the ViewPager and ListView.
Apache License 2.0
1.43k stars 312 forks source link

Move the label above stepIndicator instead of below #103

Open infothien opened 4 years ago

infothien commented 4 years ago

Hi there,

I would like to ask Is there anyway to move the label above stepIndicator instead of below it?

24ark commented 4 years ago

@infothien Currently this is not supported.

This should be an easy functionality to add. Based on a new prop we can call renderStepLabels before or after the renderStepIndicator call here: https://github.com/24ark/react-native-step-indicator/blob/1df202c5f819b58445c2b1b99a0e08dc8398f4e0/src/index.tsx#L433

infothien commented 4 years ago

that is true thank you for your feedback @24ark, by the way I could actually achieve it by using some css stuff though

24ark commented 4 years ago

that is true thank you for your feedback @24ark, by the way I could actually achieve it by using some css stuff though

Yes we can try column-reverse here: https://github.com/24ark/react-native-step-indicator/blob/1df202c5f819b58445c2b1b99a0e08dc8398f4e0/src/index.tsx#L424

infothien commented 4 years ago

that is nice and easier way to achieve it thank you I got pr here for it https://github.com/24ark/react-native-step-indicator/pull/104 based on your suggestion @24ark , I will let you know when it is ready

infothien commented 4 years ago

it is ready ! I also added the image to demonstrate the changes, would appreciate that you can give it a check too