AdelRedaa97 / react-native-select-dropdown

react-native-select-dropdown is a highly customized dropdown | select | picker | menu for react native that works for andriod and iOS platforms.
MIT License
320 stars 137 forks source link

How to wrap text within a row? #55

Closed alephpt closed 5 months ago

alephpt commented 2 years ago

I'm having issues finding a way to get text to wrap for a row, when using a long string as input. Is there away to set dynamic row height based on a given input in a set?

I have tried adjusting height, width, flex, flexWrap, etc... any advice would be appreciated?

AdelRedaa97 commented 2 years ago

For the basic dropdown, each item in the dropdown list has a text with only 1 line, you can customize the dropdown item by using renderCustomizedRowChild to set a custom design for each row in the dropdown

robertoyoc commented 2 years ago

I tried using height: "auto" for dropdownRowStyle but it crashes 😞

AdelRedaa97 commented 2 years ago

Height accepts numbers and percentage values

robertoyoc commented 2 years ago

I think the use case here is each row having different height. Right now all of them have the same fixed height. Rows do not automatically grow if the text is bigger.

ASBirinci commented 1 year ago

Remove the height propert of
styles.js /dropdownRow dropdownRow: { flex: 1, //height: 50, flexDirection: 'row', justifyContent: 'center', alignItems: 'center', borderBottomColor: '#C5C5C5', borderBottomWidth: 1, }, and adjusts the size of rows according to their content. if you want to use the height you can also give it to the using component

styker-github commented 1 year ago

Hi. Set {height: null} in rowStyle to unset the default height and set minHeight so that the wrap text within a row works

Danish-Ahmad-Khan commented 1 year ago

Hi. Set {height: null} in rowStyle to unset the default height and set minHeight so that the wrap text within a row works

Thanx man, it worked.

AdelRedaa97 commented 5 months ago

Fixed in v4.0 take a look at the changes made in v4.0 https://github.com/AdelRedaa97/react-native-select-dropdown?tab=readme-ov-file#-major-changes

Feel free to open the issue again if it still exists