WPF Litbox樣式和模板

2021-09-06 19:43:51 字數 2619 閱讀 9440

1、在專案中使用listbox時,經常會將itemcontainerstyle和itemtemplate的作用搞混,itemtemplate可以搞定一切好似itemcontainerstyle有點多餘。我們再來看下itemcontainerstyle和itemtemplate。 itemcontainerstyle用於給每個item的容器定義樣式,其型別是style。包含了操作item的triggers。 itemtemplate是每個item的現實樣式,其型別是datatemplate

在實際應用中,我們往往需要根據使用者操作不斷的改變listbox中items的顯示樣式。這裡 總結一下listbox中3種應用場景中的最優解決方案。

a.選中item時改變item項的背景顏色。

s.在 itemcontainerstyle中寫controltemplate的樣式給定背景色,使用trigger在selected為true時改變背景色,**如下:

b. 選中item時改變item項的部分顯示。

s. 使用改變變數的方式,**如下:

c. 選中item時需要完全改變item呈現的樣式,如圓形變成矩形等等。 

s. 改變item項的datatemplate,**如下:

...

...

2、使用舉例

<

listbox

name

="changeadlistbox"

grid.row

="0"

background

="#77000000"

verticalalignment

="bottom"

horizontalalignment

="right"

itemssource=""

selectionchanged

="changeadlistbox_selectionchanged"

margin

="0,0,20,5"

d:ishidden

="true"

>

<

listbox.itemspanel

>

<

itemspaneltemplate

>

<

stackpanel

orientation

="horizontal"

/>

itemspaneltemplate

>

listbox.itemspanel

>

<

listbox.itemcontainerstyle

>

<

style

targettype

="listboxitem"

>

<

setter

property

="background"

value

="white"

/>

<

setter

property

="width"

value

="12"

/>

<

setter

property

="height"

value

="12"

/>

<

setter

property

="margin"

value

="4"

/>

<

setter

property

="template"

>

<

setter.value

>

<

controltemplate

targettype

="listboxitem"

>

<

border

x:name

="bd"

borderthickness

="1"

borderbrush

="white"

background=""

>

border

>

<

controltemplate.triggers

>

<

trigger

property

="isselected"

value

="true"

>

<

setter

property

="background"

value

="skyblue"

/>

trigger

>

controltemplate.triggers

>

controltemplate

>

setter.value

>

setter

>

style

>

listbox.itemcontainerstyle

>

listbox

>

HTML模板和CSS基準樣式(三)

今 天是這個 的最後一部分,內容關於網頁的布局。然後,我對這個範例做一點解釋。從布局上看,世界上所有的網頁,大多由三個部分構成 header 頭部 footer 尾部 content 內容區 一般來說,header總是在網頁的上方,footer總是在網頁的下方,content是中間的一大塊。在 co...

通用css樣式模板,

通用樣式01 charset utf 8 全域性定義 將具有預設margin和padding的標記置零,所有標記的margin padding都在使用時具體定義 修正ie5.x和ie6的斜體溢位bug html body html iframe,html frame html frameset 常用...

通用css樣式模板

通用樣式1 charset utf 8 全域性定義 將具有預設margin和padding的標記置零,所有標記的margin padding都在使用時具體定義 修正ie5.x和ie6的斜體溢位bug html body html iframe,html frame html frameset 常用標...