c# - How to change the color of a selected item of a ComboboxItem which includes a TextBlock? -
i have following xaml of combobox:
<combobox> <comboboxitem> <textblock fontweight="bold" background="palegreen">1</textblock> </comboboxitem> <comboboxitem> <textblock fontweight="bold" background="salmon">2</textblock> </comboboxitem> <comboboxitem> <textblock fontweight="bold" background="paleturquoise">3</textblock> </comboboxitem> <comboboxitem> <textblock fontweight="bold" background="gold">4</textblock> </comboboxitem> <comboboxitem> <textblock fontweight="bold" background="black" foreground="white">5</textblock> </comboboxitem> <comboboxitem> <textblock fontweight="bold" background="gray">6</textblock> </comboboxitem> </combobox>
the following pictures shows problem:
so can see in picture "combobox closed" number "4" has no color, want text "4" yellow. can me?
@janonimus: when add template said has following code:
<window.resources> <controltemplate x:key="comboboxcontroltemplate1" targettype="{x:type combobox}"> <grid x:name="placement" snapstodevicepixels="true"> <grid.columndefinitions> <columndefinition width="*"/> <columndefinition width="auto"/> </grid.columndefinitions> <popup x:name="part_popup" allowstransparency="true" grid.columnspan="2" isopen="{binding isdropdownopen, relativesource={relativesource templatedparent}}" popupanimation="{dynamicresource {x:static systemparameters.comboboxpopupanimationkey}}" placement="bottom"> <themes:systemdropshadowchrome x:name="shdw" color="transparent" maxheight="{templatebinding maxdropdownheight}" minwidth="{binding actualwidth, elementname=placement}"> <border x:name="dropdownborder" borderbrush="{dynamicresource {x:static systemcolors.windowframebrushkey}}" borderthickness="1" background="{dynamicresource {x:static systemcolors.windowbrushkey}}"> <scrollviewer x:name="dropdownscrollviewer"> <grid renderoptions.cleartypehint="enabled"> <canvas horizontalalignment="left" height="0" verticalalignment="top" width="0"> <rectangle x:name="opaquerect" fill="{binding background, elementname=dropdownborder}" height="{binding actualheight, elementname=dropdownborder}" width="{binding actualwidth, elementname=dropdownborder}"/> </canvas> <itemspresenter x:name="itemspresenter" keyboardnavigation.directionalnavigation="contained" snapstodevicepixels="{templatebinding snapstodevicepixels}"/> </grid> </scrollviewer> </border> </themes:systemdropshadowchrome> </popup> <themes:listboxchrome x:name="border" borderbrush="{templatebinding borderbrush}" borderthickness="{templatebinding borderthickness}" background="{templatebinding background}" grid.columnspan="2" rendermouseover="{templatebinding ismouseover}" renderfocused="{templatebinding iskeyboardfocuswithin}"/> <textbox x:name="part_editabletextbox" horizontalcontentalignment="{templatebinding horizontalcontentalignment}" isreadonly="{binding isreadonly, relativesource={relativesource templatedparent}}" margin="{templatebinding padding}" verticalcontentalignment="{templatebinding verticalcontentalignment}"> <textbox.style> <style targettype="{x:type textbox}"> <setter property="overridesdefaultstyle" value="true"/> <setter property="allowdrop" value="true"/> <setter property="minwidth" value="0"/> <setter property="minheight" value="0"/> <setter property="focusvisualstyle" value="{x:null}"/> <setter property="scrollviewer.panningmode" value="verticalfirst"/> <setter property="stylus.isflicksenabled" value="false"/> <setter property="template"> <setter.value> <controltemplate targettype="{x:type textbox}"> <scrollviewer x:name="part_contenthost" background="transparent" focusable="false" horizontalscrollbarvisibility="hidden" verticalscrollbarvisibility="hidden"/> </controltemplate> </setter.value> </setter> </style> </textbox.style> </textbox> <togglebutton grid.column="1" ischecked="{binding isdropdownopen, mode=twoway, relativesource={relativesource templatedparent}}"> <togglebutton.style> <style targettype="{x:type togglebutton}"> <setter property="overridesdefaultstyle" value="true"/> <setter property="istabstop" value="false"/> <setter property="focusable" value="false"/> <setter property="clickmode" value="press"/> <setter property="background" value="transparent"/> <setter property="template"> <setter.value> <controltemplate targettype="{x:type togglebutton}"> <themes:buttonchrome x:name="chrome" borderbrush="{templatebinding borderbrush}" background="{templatebinding background}" rendermouseover="{templatebinding ismouseover}" renderpressed="{templatebinding ispressed}" roundcorners="false" snapstodevicepixels="true" width="{dynamicresource {x:static systemparameters.verticalscrollbarwidthkey}}"> <path x:name="arrow" data="m0,0l3.5,4 7,0z" fill="black" horizontalalignment="center" margin="0,1,0,0" verticalalignment="center"/> </themes:buttonchrome> <controltemplate.triggers> <trigger property="ischecked" value="true"> <setter property="renderpressed" targetname="chrome" value="true"/> </trigger> <trigger property="isenabled" value="false"> <setter property="fill" targetname="arrow" value="#ffafafaf"/> </trigger> </controltemplate.triggers> </controltemplate> </setter.value> </setter> </style> </togglebutton.style> </togglebutton> </grid> <controltemplate.triggers> <trigger property="iskeyboardfocuswithin" value="true"> <setter property="foreground" value="black"/> </trigger> <trigger property="isdropdownopen" value="true"> <setter property="renderfocused" targetname="border" value="true"/> </trigger> <trigger property="hasitems" value="false"> <setter property="height" targetname="dropdownborder" value="95"/> </trigger> <trigger property="isenabled" value="false"> <setter property="foreground" value="{dynamicresource {x:static systemcolors.graytextbrushkey}}"/> <setter property="background" value="#fff4f4f4"/> </trigger> <multitrigger> <multitrigger.conditions> <condition property="isgrouping" value="true"/> <condition> <condition.value> <system:boolean>false</system:boolean> </condition.value> </condition> </multitrigger.conditions> <setter property="scrollviewer.cancontentscroll" value="false"/> </multitrigger> <trigger property="hasdropshadow" sourcename="part_popup" value="true"> <setter property="margin" targetname="shdw" value="0,0,5,5"/> <setter property="color" targetname="shdw" value="#71000000"/> </trigger> <trigger property="cancontentscroll" sourcename="dropdownscrollviewer" value="false"> <setter property="canvas.top" targetname="opaquerect" value="{binding verticaloffset, elementname=dropdownscrollviewer}"/> <setter property="canvas.left" targetname="opaquerect" value="{binding horizontaloffset, elementname=dropdownscrollviewer}"/> </trigger> </controltemplate.triggers> </controltemplate> </window.resources>
in addition, error thrown have inserted template:
invalidoperationexception: nicht-null-wert für "property" erforderlich.
edit:
i have solution. quite easy :d don't need template. added triggers:
<style targettype="combobox"> <setter property="background" value="transparent"/> <setter property="fontsize" value="10"/> <setter property="horizontalalignment" value="center"/> <setter property="verticalalignment" value="center"/> <setter property="width" value="115"/> <setter property="foreground" value="black"/> <setter property="borderbrush" value="white"/> <setter property="selectedindex" value="0"/> <setter property="horizontalcontentalignment" value="center"/> <setter property="iseditable" value="true"/> <eventsetter event="selectionchanged" handler="selectionchanged"/> <style.triggers> <trigger property="isenabled" value="false"> <setter property="opacity" value="0.4"/> </trigger> <trigger property="selectedindex" value="0"> <setter property="background" value="palegreen"/> <setter property="foreground" value="black"/> </trigger> <trigger property="selectedindex" value="1"> <setter property="background" value="salmon"/> <setter property="foreground" value="black"/> </trigger> <trigger property="selectedindex" value="2"> <setter property="background" value="paleturquoise"/> <setter property="foreground" value="black"/> </trigger> <trigger property="selectedindex" value="3"> <setter property="background" value="gold"/> <setter property="foreground" value="black"/> </trigger> <trigger property="selectedindex" value="4"> <setter property="background" value="black"/> <setter property="foreground" value="white"/> </trigger> <trigger property="selectedindex" value="5"> <setter property="background" value="gray"/> <setter property="foreground" value="black"/> </trigger> </style.triggers> </style>
Comments
Post a Comment