xaml - Custom WPF ComboBox doesn't show grouping -
i have created custom combobox in wpf
<!-- combobox template --> <controltemplate x:key="customcomboboxtogglebutton" targettype="togglebutton"> <grid> <grid.columndefinitions> <columndefinition/> <columndefinition width="20"/> </grid.columndefinitions> <border x:name="border" grid.columnspan="2" cornerradius="3" background="{staticresource customdarkblue}" borderbrush="{staticresource customwhite}" borderthickness="2"/> <border x:name="border2" grid.column="0" cornerradius="3,0,0,3" margin="1" background="{staticresource custombackground}" borderbrush="{staticresource customwhite}" borderthickness="1,1,2,1"/> <path x:name="arrow" grid.column="1" fill="{staticresource customglyph}" horizontalalignment="center" verticalalignment="center" data="m 0 0 l 4 4 l 8 0 z"/> </grid> <controltemplate.triggers> <trigger property="togglebutton.ismouseover" value="true"> <setter targetname="border" property="background" value="{staticresource customdarkblue}"/> </trigger> <trigger property="togglebutton.ischecked" value="true"> <setter targetname="border" property="background" value="{staticresource customdarkblue}"/> </trigger> <trigger property="isenabled" value="false"> <setter targetname="border" property="borderbrush" value="{staticresource customgray}"/> <setter targetname="border2" property="borderbrush" value="{staticresource customgray}"/> <setter property="foreground" value="{staticresource customgray}"/> <setter targetname="arrow" property="fill" value="{staticresource customgray}"/> </trigger> </controltemplate.triggers> </controltemplate> <!-- combobox --> <style x:key="roundedcombobox" targettype="{x:type combobox}"> <setter property="snapstodevicepixels" value="true"/> <setter property="overridesdefaultstyle" value="true"/> <setter property="scrollviewer.horizontalscrollbarvisibility" value="auto"/> <setter property="scrollviewer.verticalscrollbarvisibility" value="auto"/> <setter property="scrollviewer.cancontentscroll" value="true"/> <setter property="foreground" value="{staticresource customwhite}"/> <setter property="background" value="{staticresource custombackground}"/> <setter property="height" value="21"/> <setter property="fontsize" value="14"/> <setter property="focusvisualstyle" value="{x:null}"/> <setter property="template"> <setter.value> <controltemplate targettype="combobox"> <grid> <togglebutton name="togglebutton" template="{staticresource customcomboboxtogglebutton}" grid.column="2" focusable="false" ischecked="{binding path=isdropdownopen,mode=twoway,relativesource={relativesource templatedparent}}" clickmode="press"/> <contentpresenter name="contentsite" ishittestvisible="false" content="{templatebinding selectionboxitem}" contenttemplate="{templatebinding selectionboxitemtemplate}" contenttemplateselector="{templatebinding itemtemplateselector}" contentstringformat="{templatebinding selectionboxitemstringformat}" margin="3,1,23,1" verticalalignment="center" horizontalalignment="left"/> <popup name="popup" placement="bottom" isopen="{templatebinding isdropdownopen}" allowstransparency="true" focusable="false" popupanimation="slide"> <grid name="dropdown" snapstodevicepixels="true" minwidth="{templatebinding actualwidth}" maxheight="{templatebinding maxdropdownheight}"> <border x:name="dropdownborder" background="{staticresource custombackground}" borderthickness="2" borderbrush="{staticresource customwhite}"/> <scrollviewer margin="4,6,4,6" snapstodevicepixels="true"> <stackpanel isitemshost="true" keyboardnavigation.directionalnavigation="contained"/> </scrollviewer> </grid> </popup> </grid> <controltemplate.triggers> <trigger property="hasitems" value="false"> <setter targetname="dropdownborder" property="minheight" value="95"/> </trigger> <trigger property="isenabled" value="false"> <setter property="foreground" value="{staticresource customgray}"/> </trigger> <trigger property="isgrouping" value="true"> <setter property="scrollviewer.cancontentscroll" value="false"/> </trigger> <trigger sourcename="popup" property="popup.allowstransparency" value="true"> <setter targetname="dropdownborder" property="cornerradius" value="4"/> <setter targetname="dropdownborder" property="margin" value="0,2,0,0"/> </trigger> </controltemplate.triggers> </controltemplate> </setter.value> </setter> </style>
this applied combobox
<combobox grid.column="0" x:name="cbochild" margin="140,65,0,0" itemssource="{binding source={staticresource groupeddata}}" itemtemplate="{staticresource accounttemplate}" selectedvalue="{binding source={staticresource item}, path=child}" selectedvaluepath="id" width="150" style="{staticresource roundedcombobox}" horizontalalignment="left" verticalalignment="top"> <combobox.groupstyle> <groupstyle headertemplate="{staticresource groupheader}"/> </combobox.groupstyle> </combobox>
the following found in window.resources
<window.resources> <collectionviewsource source="{binding childaccounts}" x:key="groupeddata"> <collectionviewsource.groupdescriptions> <propertygroupdescription propertyname="group"/> </collectionviewsource.groupdescriptions> </collectionviewsource> <datatemplate x:key="groupheader"> <textblock text="{binding group}" margin="0" foreground="{staticresource customwhite}"/> </datatemplate> <datatemplate x:key="accounttemplate"> <textblock text="{binding comment}" margin="0" foreground="{staticresource customwhite}"/> </datatemplate> </window.resources>
basically grouping works should when roundedcombobox style not applied (ie. default combobox) whenever style applied drop-down popup empty
help!!
thanks andy
found answer..... use <itemspresenter ...>
instead of <stackpanel ...>
thanks sa_ddam213 helpful advice above regarding binding.
andy
Comments
Post a Comment