Should UITableCell instance method rightAligned() right align subtitles as well?

Should UITableCell instance method rightAligned() right align subtitles as well?

Currently the title is right aligned in a column, but the subtitle is left aligned with the title, which is not what I expected…

So now it’s:

    XXXXXXXXX
    YY

          XXX
          Y

where I expected:

    XXXXXXXXX
           YY

          XXX
            Y

@simonbs Is my expectation wrong?

A few days ago I had to center align the content of a cell in one of my own scripts. I had both a title and a subtitle and got confused to why the subtitle didn’t get center aligned. So I tend to agree.

I’m debating if I should change the behavior, since I believe the current behavior is either a bug or the wrong decision or if I should deprecate the current API and instead introduce new APIs, e.g. rightAlignTitle() and rightAlignSubtitle(). Currently I’m leaning towards keeping the existing API and update the behavior.

In my humble opinion you should do it this way, as it looks like a bug to me. I expected it also to be center/right aligned and not start at the x coordinate of the title like

because it gets really awkward for long subtitles. It seems more or less that there is already a mechanism that would position the subtitle correct, but there is also an offset that it starts where the title starts:

let h = 60;
let ui = new UITable();
ui.showSeparators = true;
let row = new UITableRow();
row.height = h;
ui.addRow(row);
row.addText("foo", "some long text to force a line break, but I think it needs to be a little longer").leftAligned();

row = new UITableRow();
row.height = h;
ui.addRow(row);
row.addText("foo", "some long text to force a line break, but I think it needs to be a little longer").centerAligned();

row = new UITableRow();
row.height = h;
ui.addRow(row);
row.addText("foo", "some long text to force a line break, but I think it needs to be a little longer").rightAligned();

row = new UITableRow();
row.height = h;
ui.addRow(row);
row.addText("some long text to force a line break, but I think it needs to be a little longer", "some long text to force a line break, but I think it needs to be a little longer");

row = new UITableRow();
row.height = h;
ui.addRow(row);
row.addText("some long text to force a line break, but I think it needs to be a little longer", "some long text to force a line break, but I think it needs to be a little longer").centerAligned();

row = new UITableRow();
row.height = h;
ui.addRow(row);
row.addText("some long text to force a line break, but I think it needs to be a little longer", "some long text to force a line break, but I think it needs to be a little longer").rightAligned();

ui.present();

Thanks for your examples. This will be fixed in the next update. If you’re on the beta, you’ll find the fix in the next build as well.

2 Likes

I also noticed something funky going on with background colours in UITableRow/Cell with todays beta (iPad). For some reason the bg colour of all my text is various bright colours now (I don’t set any bg colours on text in the script):

// Create a title row (bold text)
function addTitleRow(uiTable, text) {
    let uiTableRow = new UITableRow();
    let titleCell = uiTableRow.addText(text.toUpperCase());
    titleCell.leftAligned();
    titleCell.widthWeight = 100;
    uiTableRow.height = 70;
    uiTableRow.cellSpacing = 10;
    uiTableRow.dismissOnSelect = false;
    uiTableRow.isHeader = true;
    uiTable.addRow(uiTableRow);
    return uiTableRow;
}

The full script is here: https://github.com/psidnell/Scriptable/blob/master/Calendars.js

1 Like

Thanks for your feedback. I had accidentally left some debug code on in the build that went out. I’ll make a new build ASAP that fixes this.

1 Like

That’s hilarious - because it’s the kind of thing I do!

I actually wondered “are the backgrounds coloured to debug UI issues” but thought “Nahh”.

Thanks for the quick fix!

:slight_smile: