javascript - phonegap javascriptでtablviewのようにリストを表示するにはどうすればよいですか?

Question

HTML:

<ul id="listview" data-inset="true"></ul>

JavaScript:

for(i=0;i<titles.length;i++){
    $('#listview').append('<li><a href="#">'+titles[i]+'</a>      </li>');
}

シンプルなリストが表示されますが、テーブルビューとしてリストビューが必要ですか?

Answer 1

PhoneGapは、JS/HTMLをObjective-Cスタイルのコードにコンパイルするためのラッパーではありません。私はあなたが達成したいことは次の画像のようなものだと思います：

#listviewこれを実現するには、CSSを使用してスタイルを設定する必要があります。たとえば、次のようなことを試してみてください。

#listview {
    list-style: none;
    float: left;
    width: 100%;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    margin: 0;
    padding: 0;
}

    #listview li {
        width: 100%;
        padding: 10px;
        font-weight: bold;
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
        background-color: #fff;
        float: left;
        clear: both;
        border-bottom: 1px solid #ccc;
    }
        #listview li:last-of-type {
            border-bottom: none;
        }