这是Win8 App神圣不可侵犯的头文件：
<head>
<meta charset="utf-8">
<title>ListViewExample</title><!-- WinJS references -->
<link href="//Microsoft.WinJS.0.6/css/ui-light.css" rel="stylesheet">
<script src="//Microsoft.WinJS.0.6/js/base.js"></script>
<script src="//Microsoft.WinJS.0.6/js/ui.js"></script><!-- ListViewExample references -->
<link href="/css/default.css" rel="stylesheet">
<script src="/js/default.js"></script><!-- Your data file. -->
<script src="/js/dataExample.js"></script></head>
HTML页面加入以下代码：
<div id="mediumListIconTextTemplate" data-win-control="WinJS.Binding.Template">
<div style="width: 150px; height: 100px;"><!-- Displays the "picture" field. -->
<img src="#" style="width: 60px; height: 60px;"
data-win-bind="alt: title; src: picture" />
<div><!-- Displays the "title" field. -->
<h4 data-win-bind="innerText: title"></h4><!-- Displays the "text" field. -->
<h6 data-win-bind="innerText: text"></h6>
</div>
</div>
</div><div id="basicListView" data-win-control="WinJS.UI.ListView"
data-win-options="{itemDataSource : DataExample.itemList.dataSource, itemTemplate: select(‘#mediumListIconTextTemplate‘)}">
</div>
js文件夹中dataExample.js中的js文件：
(function () {
"use strict";
var dataArray = [
{ title: "Basic banana", text: "Low-fat frozen yogurt", picture: "images/60banana.png" },
{ title: "Banana blast", text: "Ice cream", picture: "images/60banana.png" },
{ title: "Brilliant banana", text: "Frozen custard", picture: "images/60banana.png" },
{ title: "Orange surprise", text: "Sherbet", picture: "images/60orange.png" },
{ title: "Original orange", text: "Sherbet", picture: "images/60orange.png" },
{ title: "Vanilla", text: "Ice cream", picture: "images/60vanilla.png" },
{ title: "Very vanilla", text: "Frozen custard", picture: "images/60vanilla.png" },
{ title: "Marvelous mint", text: "Gelato", picture: "images/60mint.png" },
{ title: "Succulent strawberry", text: "Sorbet", picture: "images/60strawberry.png" }
];
var dataList = new WinJS.Binding.List(dataArray);
// Create a namespace to make the data publicly
// accessible.
var publicMembers =
{
itemList: dataList
};
WinJS.Namespace.define("DataExample", publicMembers);
})();
Win8 App使用Listview的简单方法,布布扣,bubuko.com