Titanium：创建类似于 iPhone 联系人（编辑模式）应用程序中的字段

Question

注意：分隔符又名分隔符是这个问题的要点。它必须是可见的。

有没有办法创建类似于 iPhone 联系人（编辑联系人模式）应用程序中的字段？

我想创建一个分隔符，将 titleLabel 与 textField 分开。 就像“名字 | 提示文本” 不是“名字提示文本”，

我认为我想做的 与此类似......只是我使用的是钛。有什么办法可以使用钛来做到这一点吗？ iPhone 联系人应用程序的详细信息视图是如何实现的

@MRT 和任何人谁知道： 您如何使组合视图看起来像这样？

 ____________________
( Name  |   hinttext )
 --------------------

Answer 1

您必须创建一个新的 TableViewRow 并对其进行自定义。

您可以在 TableViewRow 中放置标签、字段、图像等。

例子：

var row = Ti.UI.createTableViewRow();

var label = Ti.UI.createLabel({
    text: "Name",
    width: 50,
    top: 5,
    bottom: 5,
    left: 5,
    font: {fontSize:10}
});
row.add(label);

Answer 2

尝试一下这对你真的有用

var view1 = Ti.UI.createView({
    height : 50,
    width: 150,
    top: 5,
    bottom: 5,
    left: 5,
    font: {fontSize:10}
});
var text1 = Ti.UI.createTextField({
    hintText : 'First Name',
    height : 50,
    width: 75,
    top: 0,
    left: 0,
    font: {fontSize:10}
});
var text2 = Ti.UI.createTextField({
    hintText : 'hint text',
    height : 50,
    width: 75,
    top: 0,
    left: 75,
    font: {fontSize:10}
});

view1.add(text1);
view1.add(text2);

Answer 3

你有两种方法可以做到这一点。

1. 取 2 个 TextField 并调整（上边距和左边距）并将其连接起来。
   或

1 Take 1 TextField
2.取1个Label，其宽度为2，高度等于文本字段的高度。
3. TextField.add(lable1)

var win1 = Ti.UI.createWindow({
title : 'Window1',
backgroundColor : '#f00',
id    : 0,
});

var text1 = Ti.UI.createTextField({
width : 150,
height : 50,
borderRadius : 9,
backgroundColor : '#fff',
top  : 50,
left : 20,
    });

var label1 = Ti.UI.createLabel({
width : 2,
height : 50,
top   : 0,
left  : 75,
});

text1.add(label1);
win1.add(text1);
win1.open();

Answer 4

添加垂直线

var vline = Ti.UI.createView({
    height: 44,
    width: 1,
    top: 0,
    left: 85,
    backgroundColor:'#CCC'
});

row.add(vline);

Answer 5

您只需创建一个 TableViewRow 并向其添加标签即可。此行没有现成的模板。但如果您经常使用它，您可以为其创建一个包装器。例如：

var createTableViewRowWithTitleAndValue(title, value) {

    // TableViewRow
    row = Ti.UI.createTableViewRow({
        backgroundColor: "#FFFFFF"
    });

    // Title
    row.add(Ti.UI.createLabel({
        text: title,
        left: 5,
        font: { fontWeight: "bold" }
    }));

    // Value
    row.add(Ti.UI.createLabel({
        text: value,
        right: 5,
        textAlign: "right"
    }));

}

然后，当您将数据设置到 TableView 时，您会创建一个新的 TableViewRow，而是创建一个新的 tableViewRowWithTitleAndValue，其中包含 标题 和 值需要。例如：

rows.push(new createTableViewRowWithTitleAndValue("Foo", "Bar"));