React-Native: Picker data in right alignment

Question

I am new React-Native, I use Native-base library in my application. I try to text-align right to my picker data but I don't get success.

picker.js

                            <Item picker>
                                <Label>Data</Label>
                                <Picker
                                    mode="dropdown"
                                    iosIcon={<Icon name="arrow-down" />}
                                    style={{ textAlign: 'right' }}
                                    placeholder="Select your SIM"
                                    placeholderStyle={{ color: '#bfc6ea' }}
                                    placeholderIconColor="#007aff"
                                    itemStyle={{
                                        backgroundColor: "#d3d3d3",
                                        marginRight: 0,
                                        paddingRight: 10,
                                        textAlign: 'right'
                                    }}
                                    selectedValue={pickerData}
                                    onValueChange={e => onValueChange(e)}
                                >
                                    <Picker.Item label="Wallet" value="Wallet" />
                                    <Picker.Item label="ATM Card" value="ATM Card" />
                                    <Picker.Item label="Debit Card" value="Debit Card" />
                                    <Picker.Item label="Credit Card" value="Credit Card" />
                                    <Picker.Item label="Net Banking" value="Net Banking" />
                                </Picker>
                            </Item>

Please help me to find out my mistake. Thanks:)

Answer 1

try to using Flex properties

like

display:flex
justifyContent: 'flex-start' || 'center' || 'flex-end' || 'baseline',
                 Left           center        Right        Bottom
alignItems:  'flex-start' || 'center' || 'flex-end' || 'baseline',
                 Left           center        Right        Bottom

hope it will help you thanks :-)