labelAlign property not being applied

[gtiongco95]

Hi there,

I have tried using the property "labelAlign" with either values 'right' or 'left' to align the labels to the either side. However, the labels' alignment does not update and is still has the default 'center' alignment.

[rdgomt]

Same here

[amanjuneja3012]

same here

[24ark]

Can you try flex-start or flex-end and see if it works.

[ddsr17]

Still doesn't work

[gtiongco95]

The fix was in the line { alignItems: this.state.customStyles.labelAlign } where state was omitted. However, the values left and right only work for ios. If you want it to work with android as well you will need to use flex-start and flex-end.

[ddsr17]

@gtiongco95 Could you elaborate a bit, where exactly is this { alignItems: this.state.customStyles.labelAlign } to be placed?

[gtiongco95]

@ddsr17 it's located on line 287 of the StepIndicator.js file. It has been updated by the repo owner so it should just work now for you (:

[gtl-himanshu]

const customStyles = {
    labelAlign: 'flex-start', // <-- add this property to the custom styles object
};

other type {"center" | "flex-start" | "flex-end" | "stretch" | "baseline" | undefined}