2012-02-15 66 views
0

注意:分隔符aka分隔符是這個問題的主要觀點。它必須可見。鈦:創建類似於iPhone中的字段Contacts(編輯模式)應用程序

有沒有辦法像iPhone聯繫人(編輯聯繫人模式)應用程序創建字段?

我想創建一個分隔符,將titleLabel與textField分開。 像「名| hinttext」 而不是「名hinttext」

我想什麼,我試圖做的是類似這樣的......只是我使用鈦。有沒有辦法使用Titanium來做到這一點? How is iPhone Contact app's detail View implemented

@MRT和任何知道的人: 你如何使組合視圖看起來像這樣?

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

回答

0

您必須創建一個新的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); 
+0

我的意思是,我該如何添加該分頻器?我知道如何添加名稱標籤和文本字段。但是,我如何添加分隔線? – 2012-02-22 16:23:53

0

試試這真的有用到您

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); 
+0

你可以看看後續問題嗎?謝謝。 – 2012-02-28 18:46:03

+0

你有2種方式來做到這一點。 檢查如下:。 – MRT 2012-02-29 08:14:58

0

你有2個辦法做到這一點。

  1. 取2 TextField並調整(頂部和左邊距)並將它聯合起來。 或

1取1周的TextField 2.取1個標籤和其寬度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(); 
+0

你如何做中間的分隔線?這實際上是我的問題中的主要問題。 +++ 如果我創建一個標籤,它會有圓角?我只想在左側和右側的尖角上做出圓角。 – 2012-02-29 16:47:40

+0

我寫了一個演示完整的代碼,你可以複製和過去並在模擬器上運行。在此之後,你告訴我。發生了什麼事,你想要什麼okey ... – MRT 2012-03-01 05:53:48

+0

複製上面的代碼,並檢查它... – MRT 2012-03-01 05:55:00

0

要添加一條垂直線

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

row.add(vline); 
+0

這條線是不是動態的權利?你知道創建一個動態行的方法,它會自動跟蹤文本框的高度嗎? – 2012-04-01 05:00:25

0

你只需要創建一個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")); 
相關問題