樣式sencha觸摸項目列表

Question

我正在尋找如何樣式清單從Sencha返回結果樣本。

我是否需要100行自定義CSS，還是有一些預定義的樣式需要應用，以使我的應用看起來像本機設備一樣？

Answer 1

默認樣式應該看起來不錯：至少與Touch用戶界面的其餘部分保持一致。

只需提供一個itemTpl：屬性和列表綁定到店：你應該看到的項目出現在列表中，如：

當然，你可以詳細闡述itemTpl就像你喜歡。還有一些「標準」UI行爲，例如披露按鈕和索引欄。看到這個屏幕錄像的例子：http://vimeo.com/19245335

最後，當然，它只是HTML & CSS，所以你可以完全瘋狂的樣式，如果你想。檢查：http://www.sencha.com/blog/2010/12/17/an-introduction-to-theming-sencha-touch/

Answer 2

在Sencha Touch的默認下載中，在演示中有一個名爲Kitchen Sink的文件夾。本演示中有一個基本的css文件，您可以將其用作起點。

此外，你可以給列表或nestedlist類與CLS：「yourClass」，然後在你的項目源，檢查嵌套的div和他們班...

另一種選擇是使用風格：'背景顏色：黑色;顏色：白色;'在組件內部獲得基本的樣式。

最好的辦法是檢查廚房水槽特殊的css文件，因爲它是以正確的方式縮進並且對初學者非常清楚。

Answer 3

使用此使其垂直居中對齊總是：

.x-list .x-list-item{ 
    display: -webkit-box; 
    -webkit-box-orient: horizontal; 
    -webkit-box-pack: center; 
    -webkit-box-align: center; 
}