Titanium Community Questions & Answer Archive

Question

Apple-style table with field label and text entry (like account setup)?

Apple seems to use a fairly consistent design for credential info where they have what looks like a table with a label inside naming the field, and a text entry field that hold's user information. Check out the images here to see what I'm talking about (http://support.apple.com/kb/HT2480) for email, domain, username, etc.

What's the recommended way to recreate this in Titanium? Would it be a label and text field stuffed into a tableview? There are a lot of interesting examples in the KitchenSink, just not one that showcases this explicitly.

Accepted Answer

Accepted Answer

That is right. Here is the code to reproduce it:

var data = [];
var row = Ti.UI.createTableViewRow({
    height:'auto'
});

var label1 = Titanium.UI.createLabel({
    text:'Email',
    font:{fontSize:20,fontFamily:'Helvetica Neue'},
    left: 5
});

row.add(label1);

var textField = Ti.UI.createTextField({
    left: 100,
    hintText: 'email@company.com',
    borderStyle: Ti.UI.INPUT_BORDERSTYLE_NONE
});

row.add(textField);
data.push(row);

var table = Ti.UI.createTableView({
    data:data,
    style: Ti.UI.iPhone.TableViewStyle.GROUPED
});

win1.add(table);

hope this helps. Titanium rocks!

Answer 2

I believe is a textField without border and the hint set

Titanium Community Questions & Answer Archive

We felt that 6+ years of knowledge should not die so this is the Titanium Community Questions & Answer Archive

Apple-style table with field label and text entry (like account setup)?

2 Answers

Accepted Answer