1.最外邊放乙個scrollview控制項，目的是如果導航欄超過固定高度時
自動出現右側下拉條。
2.在最外側放置listbox控制項，作為一級導航按鈕集合。
3.通過xmal設定listbox.itemtemplate的datatemplate
一級導航窗格的datatemplate是expander控制項,並在後台新增
expander的expanded 和collapsed事件(擴充套件和收取事件)
4.將expander的content屬性,即expander點開所包含的內容控制項,設定為
listbox,即二級導航按鈕集合.
5.自定義設定二級導航按鈕集合控制項listbox控制項的
listbox.itemtemplate的datatemplate屬性即二級導航按鈕的
模板
<
scrollviewer verticalscrollbarvisibility=
"auto" background=
"#ff080e3e"
>
<
listbox x:name=
"mainlistbox" itemssource=
"" scrollviewer.horizontalscrollbarvisibility=
"disabled" background=
"#ff080e3e"
>
<
expander style=
"" width=
"" tag=
"" expanded=
"expander_expanded" collapsed=
"expander_collapsed"
>
<
listbox x:name=
"itemlistbox" itemssource=
",path=tag.itemlst}"
scrollviewer.horizontalscrollbarvisibility=
"disabled" gotfocus=
"itemlistbox_gotfocus" selectionchanged=
"itemlistbox_selectionchanged" foreground=
"#ff0c1647"
>
<
grid horizontalalignment=
"left" name=
"gdbackground" width=
"" height=
"30"
>
<
image width=
"28" height=
"28" horizontalalignment=
"left" source=
"">
<
/image>
<
textblock horizontalalignment=
"left" text=
"" fontsize=
"16" margin=
"30,0,0,0" foreground=
"white" verticalalignment=
"center"
>
<
/textblock>
<
/grid>
<
datatrigger binding=
"},path=isselected}" value=
"true"
>
<
setter targetname=
"gdbackground" property=
"background" value=
"#ff223071"
>
<
/setter>
<
/datatrigger>
<
/datatemplate.triggers>
<
/datatemplate>
<
/listbox.itemtemplate>
<
/listbox>
<
/expander.content>
<
/expander>
<
/datatemplate>
<
/listbox.itemtemplate>
<
/listbox>
<
/scrollviewer>
UserControl如果製作設定屬性
前台 id eval mid target blank convert.tostring eval title length 16 convert.tostring eval title substring 0,16 eval title 在前台直接把控制項託上去 設定好繫結資料 在後台設定它的屬性...
導航製作總結
1.導航條可用標籤實現，可以方便搜尋引擎解析頁面結構 3.導航條內的元素定位可利用margin padding實現，如 1 設定 父元素 的padding 2 設定子元素的margin 4.實現左右水平布局，可以讓內聯元素右浮動即可 5.對於較重要的字眼可用標籤修飾，如數字 購物車中商品件數 等 6...
製作風琴導航
製作風琴導航 註明 本文獻的一切圖來自潘老師的 下面我們看一下老師的 風琴導航，用a標籤包括em標籤，用a標籤能更方便更有可以跳轉的效果，當然要實現頁面跳轉要加幾個頁面還有在a標籤裡面加 這個符號，同樣可以加乙個 在裡面來進行頁面跳轉。接著我們來看老師的css部分，首先把風琴固定在右邊 因為a 標籤...