2011-11-18 60 views
3

所以我正在使用jQuery的移動框架的Web應用程序,我希望有一種方法來進一步自定義列表視圖元素的外觀。具體而言,我希望能夠按照意願定位文本,並適當調整文本大小。我知道jquery mobile內置了頭文件標籤支持,以及一種將class = ui-li置於一邊的元素以小文本顯示在列表元素右上角的方法。jQuery的移動自定義列表視圖格式

但是,我最好想要一個可重複使用的列表視圖元素,它具有稍微不同的選項。對於初學者,我想在列表元素中左對齊1個字符的標題,並且基本上填充列表項的整個高度。然後在右邊,而不是一個文本元素,這正確的理由和頂部的位置,我想要的東西是垂直對齊在中心和右對齊。最後,我想要一個第三個文本元素,左對齊大1字符標題的左側,跨越列表視圖元素的整個中間。

總之,我希望每個樣式列表視圖元素能夠是這樣的:(這實際上是一個UITableViewCell的圖片,但要點是相同的)

enter image description here

計數氣泡在查詢移動中本地處理,只需要弄清楚如何爲我想要顯示的三種其他文本類型設置類

回答

2

的ThemeRoller似乎不錯,自定義顏色,字體,邊框,...但不使用方式不同的元素定位。我認爲您需要編寫自己的.css文件並覆蓋類別ui-li-headingui-li-asideui-li-desc。 祝你好運

+0

我已經注意到ui-li在旁邊和ui-li-desc一起使用。這兩者之間的確切區別是什麼? – ecbtln

+0

AFAIK差別似乎是'ui-li-aside'類用於右側對齊的輔助組件,而'ui-li-desc'則用於主要的左對齊組件。 – Pablo

+0

我不確定這件事。看起來好像將ui-li-desc分配給

  • 標籤中的任何免費標籤。它也最終被分配到jQuery的渲染後的ui-li-aside組件。 – ecbtln

    1

    也許有可能使用隨JQM 1.0附帶的ThemeRoller,I認爲它是提供「可重用性」的最準確的方法。但我認爲你必須逐步調整你想要的特徵,比如填充文本高度到100%。

    http://jquerymobile.com/themeroller/

    ZY