怎么样使用ASP.NET移动控件List?
怎么样使用ASP.NET移动控件List?
ASP.NET 移动控件 |
List 控件
将项的列表呈现到移动设备。此控件支持通过设备模板集进行模板化呈现,它还支持内部分页。有关更多信息,请参见模板集和模板化控件或分页文档。
静态和交互模式
您可以设置此控件以以下模式运行:
- 静态模式 - 控件的行为类似于静态列表。静态列表项可被声明为项子元素。
- 交互模式 - 控件将项呈现为交互元素。
这些模式的行为基于是否存在事件处理程序。如果不存在事件处理程序,则控件被设置为静态模式。如果存在事件处理程序,则控件被设置为交互模式,在这种模式下,每项都是交互元素,在被单击时将生成事件。
移动控件语法
必需的属性、默认值和具有代码特征的元素以粗体显示。
<mobile:List
runat="server" id="id" Font-Name="fontName" Font-Size="{NotSet|Normal|Small|Large}" Font-Bold="{NotSet|False|True}" Font-Italic="{NotSet|False|True}" ForeColor="foregroundColor" BackColor="backgroundColor" Alignment="{NotSet|Left|Center|Right}" StyleReference="styleReference" Wrapping="{NotSet|Wrap|NoWrap}" DataMember="dataMember" DataTextField="dataTextField" DataValueField="dataValueField" Decoration="{None|Bulleted|Numbered}" ItemsAsLinks="{False|True}" ItemCount="itemCount" OnItemDataBind="onItemDataBindHandler" OnItemCommand="onItemCommandHandler" OnLoadItems="loadItemsHandler"> Place DeviceSpecific/Choice construct here. (optional) <DeviceSpecific> <Choice Add choice here> </Choice> </DeviceSpecific> Place statically declared list items here. (optional) <Item Text="Text" Value="Value" /> </mobile:List
>
包容规则
以下控件可以包含 List 控件。
控件 | 说明 |
---|---|
System.Web.UI.MobileControls.Form | 可以包含任意多个 List 控件。 |
System.Web.UI.MobileControls.Panel | 可以包含任意多个 List 控件。 |
List 控件可以包含以下控件。
控件 | 说明 |
---|---|
System.Web.UI.MobileControls.DeviceSpecific | List 控件中可以不包含 DeviceSpecific 控件,也可以包含一个 DeviceSpecific 控件。 |
System.Web.UI.MobileControls.Item | List 控件中可以包含任意数目的 Item 控件。 |
设备模板
模板 | 说明 |
---|---|
HeaderTemplate | 页眉模板呈现在列表的开头。在分页模式下,每页上都呈现页眉。 |
FooterTemplate | 页脚模板呈现在列表的末尾。在分页模式下,每页上都呈现页脚。 |
ItemTemplate | 呈现每个列表项的项模板。 |
AlternatingItemTemplate | 如果定义了此模板,则呈现替换项模板,而不是偶数项的项模板。例如,第二项是一个替换模板,第四项也是一个替换模板,同样,后面的每个偶数项都是替换模板。 |
SeparatorTemplate | 分隔符模板呈现在两项之间。 |
特定于设备的行为
设备语言 | 行为描述 |
---|---|
HTML |
HTML 的列表呈现取决于 Decoration 属性中设置的样式:
如果定义了 ItemCommand 事件,则项文本括在超级链接中。 对于模板化控件,控件仅根据模板的定义来呈现列表。 |
WML |
对于 WML 中的静态列表,列表呈现为一系列静态行。
对于 WML 中使用 Openwave 技术的设备上的交互列表,列表呈现为一个 <select> 构造,允许用户使用数字键来单击或选择项。卡片上的其他用户界面元素可以合并到此 select 块中。 对于其他 WML 设备上的交互列表,列表呈现为一系列定位点。 对于模板化控件,控件仅根据模板的定义来呈现列表。 |
示例
下面的示例显示一个水果的列表。当您选择某种水果时,控件显示其价格。
[Visual Basic] <%@ Page Inherits= "System.Web.UI.MobileControls.MobilePage" Language="VB" %> <%@ Register TagPrefix="mobile" Namespace="System.Web.UI.MobileControls" Assembly="System.Web.Mobile" %> <script language="vb" runat="server"> protected Sub List_Click(source As Object, e As ListCommandEventArgs) Dim selectedFruit as String selectedFruit = "You selected " + e.ListItem.Text + _ " at " + e.ListItem.Value + " per pound." PriceLabel.Text = selectedFruit ActiveForm = Price End Sub </script> <mobile:Form id="ShowProduce" runat="server" BackColor="Green"> <mobile:Label runat="server" id="label1">Pick a Fruit!</mobile:Label> <mobile:List runat="server" id="ListProduce" OnItemCommand="List_Click" > <item Text="Apples" Value="20 cents" /> <item Text="Apricots" Value="80 cents" /> <item Text="Bananas" Value="79 cents" /> <item Text="Grapes" Value="50 cents" /> <item Text="Oranges" Value="30 cents" /> <item Text="Peaches" Value="10 cents" /> <item Text="Pears" Value="70 cents" /> <item Text="Plums" Value="99 cents" /> </mobile:List> </mobile:Form> <mobile:Form id="Price" runat = "server"> <mobile:Label runat="server" id="PriceLabel"/> </mobile:Form> [C#] <%@ Page Inherits= "System.Web.UI.MobileControls.MobilePage" Language="C#" %> <%@ Register TagPrefix="mobile" Namespace="System.Web.UI.MobileControls" Assembly="System.Web.Mobile" %> <script language="c#" runat="server"> protected void List_Click(Object source, ListCommandEventArgs e) { String selectedFruit = "You selected " + e.ListItem.Text + " at " + e.ListItem.Value + " per pound."; PriceLabel.Text = selectedFruit; ActiveForm = Price; } </script> <mobile:Form id="ShowProduce" runat="server" BackColor="Green"> <mobile:Label runat="server" id="label1">Pick a Fruit!</mobile:Label> <mobile:List runat="server" id="ListProduce" OnItemCommand="List_Click" > <item Text="Apples" Value="20 cents" /> <item Text="Apricots" Value="80 cents" /> <item Text="Bananas" Value="79 cents" /> <item Text="Grapes" Value="50 cents" /> <item Text="Oranges" Value="30 cents" /> <item Text="Peaches" Value="10 cents" /> <item Text="Pears" Value="70 cents" /> <item Text="Plums" Value="99 cents" /> </mobile:List> </mobile:Form> <mobile:Form id="Price" runat = "server"> <mobile:Label runat="server" id="PriceLabel"/> </mobile:Form>