I’m trying to build the following design in react-native using Flexbox:

Post image

The idea is that 1) The full table content is centralized, and 2) the quantities text is right-aligned and the ingredient names are-left aligned.

I’m running into a problem when the ingredient name is long and wraps up into multiple lines. I’d like the quantity text in the same row to also span the same number of lines (like in row one above), but I just don’t know how to do that.

I’ve tried using react-native-measure-text and react-native-table-component but couldn’t make them work for me.

Thanks.



Source link

Write A Comment