Standalone
Grouped
A C1NavigationListHeaderItem is a list item with text that is used to provide a header for a section of list items.
You can tie the text item to a group, or you can add it as a standalone item. If you are using a simple list, there will be no visual difference between a grouped and a standalone item. However, grouping does affect the appearance of a rounded corners list. In a rounded corners list, a text item nested within a C1NavigationGroup adopts the appearance of the other list items; if ungrouped, the text will appear over the background image of the C1ViewPort. Comparisons between the two types are illustrated in the following table:
|
Standalone |
Grouped |
|
|
|
To view the XHTML used to create the headers in the table above, select from the following options:
<cc1:C1NavigationList runat="server"
NavigationListType="RoundedCornersList" Text="Settings"
OnClientItemChecked="ItemChecked" OnClientItemClick="ItemClicked">
<Items>
<cc1:C1NavigationListHeaderItem Text="Header">
</cc1:C1NavigationListHeaderItem>
<cc1:C1NavigationListGroupItem>
<Items>
<cc1:C1NavigationListItem runat="server" Text="Wi-Fi Networks" DetailText="linksys" ImageUrl="Images/wifi_29x29.png" >
</cc1:C1NavigationListItem>
</Items>
</cc1:C1NavigationGroupItem>
</Items>
</cc1:C1NavigationList>
<cc1:C1NavigationList runat="server"
NavigationListType="RoundedCornersList" Text="Settings"
OnClientItemChecked="ItemChecked" OnClientItemClick="ItemClicked">
<Items>
<cc1:C1NavigationListGroupItem>
<Items>
<cc1:C1NavigationListHeaderItem Text="Header">
</cc1:C1NavigationListHeaderItem>
<cc1:C1NavigationListItem runat="server" Text="Wi-Fi Networks" DetailText="linksys" ImageUrl="Images/wifi_29x29.png" >
</cc1:C1NavigationListItem>
</Items>
</cc1:C1NavitationListGroupItem>
</Items>
</cc1:C1NavigationList>
The following image depicts a header item on a simple list:
The appearance of a C1NavigationListHeaderItem element can be modified with the following properties:
|
Property |
Description |
|
The top text of the header item. In the iPhone visual style, this appears in blue font. | |
|
The middle text of the header item. In the iPhone visual style, this appears in gray, bolded font. | |
|
The bottom text of the header item. In the iPhone visual style, this appears in gray font. | |
|
The text describing the details of this header item's subitems. | |
|
The path where the image for the header item is stored. The image appears to the left of all text. |