react-native-material-dropdown icon indicating copy to clipboard operation
react-native-material-dropdown copied to clipboard

Label Alignment

Open Ahmed-Imam opened this issue 6 years ago • 7 comments

how to align the label to the right and change the fontFamily ?

Ahmed-Imam avatar Jan 20 '19 02:01 Ahmed-Imam

any luck??

ArsalanReal avatar Mar 04 '19 14:03 ArsalanReal

Also looking to set label styles.

adamt19 avatar Mar 17 '19 22:03 adamt19

I'd like to change the font color & size of the label vs floating label color once a selection is picked.

ProfessionalAmateur avatar Apr 12 '19 19:04 ProfessionalAmateur

Same here, would like to change the fontFamily.

ryanjorgensen avatar Aug 01 '19 12:08 ryanjorgensen

i want to RTL how to do this?

iamir4g avatar Aug 26 '19 13:08 iamir4g

Just pass your styles to inputContainerStyle={{your styles}}

farooqmajeed avatar Feb 05 '20 08:02 farooqmajeed

You can control RTL or LTR using renderBase prop. Say you have a Row component that handles the direction

const styles = StyleSheet.create({
  default: {
    display: 'flex',
    flexDirection: 'row', // Here you can control the direction 
  },
});

function Row(props) {
  const style = Array.isArray(props.style) ? props.style : [props.style];

  return (
    <View {...props} style={[styles.default, ...style]}>
      {props.children}
    </View>
  );
}

Then you can just use it as follows.

<Dropdown
...dropdownProps
renderBase={props => {
            return (
              <Row>
                <Text>
                  {props.title}
                </Text>
                {props.renderAccessory() /* This part is the arrow */}
              </Row>
            );
          }}
>

zmtmaster avatar May 25 '20 07:05 zmtmaster