sussol / react-native-generic-table-page

A customisable page with table of data, search bar, an optional extras
12 stars 9 forks source link

Avoid text wrapping in cells #12

Open SaurabhBrst opened 6 years ago

SaurabhBrst commented 6 years ago

How can i avoid the text wrapping in cells as it shows very less data. I wan't to show my text in multiple lines. Text is multiline in headers of tables but not in data cells. screen shot 2018-01-20 at 4 25 33 pm

Chris-Petty commented 6 years ago

Hmm, I had to double check, I don't think when manually truncate any strings (we had a utility for doing that in some other projects). I've just had a look at the lastest docs and noticed a new prop for Text RN components, ellipsizemode. That is probably what is causing the truncation if you are running a more recent version of RN.

The easiest way around this would be writing custom cells to use the new api - it'll be a while before we get to updating for it.

Judging by your picture you are trying to make a pretty wide table for a low res mobile device? Especially because we don't support horizontal scroll, it can be hard to make tables play nice with many columns.

Chris-Petty commented 6 years ago

Here number of lines is default prop of value 1: https://github.com/sussol/react-native-data-table/blob/master/src/Cell.js

That'll cause ellipsizemode to take affect, as described in the most recent RN docs.

You could try setting it to 0 with a custom cell, but you may run into layout issues on the table.