Multiline text in tableview row in Titanium

1

votes

I'm working on a tableView based application in Titanium. I need to show long text contents in my table view rows.

When I do this, my row is looking like:

Multiline

This is the code I'm using to create my table view row.

var row = Ti.UI.createTableViewRow({
        backgroundColor : '#F0F0F0',
        color           : 'black',
        font            : { fontSize:10 ,fontWeight:'bold',fontFamily:'Arial'},
        height          :'80',
        title           : firstRowContent
     });

My issue is I need to wrap the text in my table view row and need to display it in multiline.

In iOS there is lineBreakMode and numberOfLines properties. And I can easily do it.

Is there any way to do it in titanium ? I searched a lot, but everyone says that put a '\n' in between the text or add multiple labels.

These are the links I referred:

iosuitableviewtitaniumtitanium-mobileappcelerator-mobile

4

votes

You need to put a label object in the row. The label can be created such that it will wrap the text.

When searching for answers, search for complex tableviewrow appcelerator

3

votes

The below wraps for me. Titanium's default label behavior is for it to wrap. A row view's "title" property is meant to be single lined.

var win = Ti.UI.createWindow({
    backgroundColor: '#fff'
});
var row = Ti.UI.createTableViewRow();
row.add(Ti.UI.createLabel({
    text: 'Gosh golly, this is a label. Cool, huh?',
    color: '#000', font: { fontSize: 32 }
}));
win.add(Ti.UI.createTableView({
    data: [ row ]
}));
win.open();

If you were to set a height on the row such that a wrapped line wouldn't fit, then it will ellipsize for you.

row.add(Ti.UI.createLabel({
    text: 'Gosh golly, this is a label. Cool, huh?',
    color: '#000', font: { fontSize: 32 },
    height: 40
}));

But it'll by default size to the content you've provided.

2

votes

I fixed this issue by adding a label as subview of tableview's row.

 var firstRow = Ti.UI.createTableViewRow({
        backgroundColor : '#F0F0F0',
        color           : '#555555',
        font            : { fontSize:10 ,fontFamily:'Arial'},
        height          :'auto',
       // title         : firstRowContent,
        horizontalWrap  : 'true',
        selectionStyle  : Ti.UI.iPhone.TableViewCellSelectionStyle.NONE
     });
      var firstLabel = Ti.UI.createLabel({
        text            : 'Midhun Says: Hi, How are you ? We are currently waiting for you ...',
        height          : 'auto',
        right           : '10',
        top             : '7',
        left            : '10',
        color           : '#555555',
        font            : { fontSize:15 ,fontFamily:'Arial'},
     });

firstRow.add(firstLabel);

Anyway thanks guys for your help...

Multiline text in tableview row in Titanium

3 Answers