c# - Base Expander Style, override header color -
is possible create sort of base expander style , override background color of header in derived style? in application i'm using expanders lot , change background color of header. know copy&paste style , edit color, nicer create new style based on "base style" , setting header's background color. not know how access color. it's color of line: below i'd change (the border in header): border name="border"... cannot access "border" in setter of derived style...
this (base) style:
<style targettype="expander" x:key="expanderstyle"> <setter property="background" value="{dynamicresource {x:static systemcolors.controldarkbrushkey}}"/> <setter property="foreground" value="{dynamicresource {x:static systemcolors.controltextcolor}}"/> <setter property="template"> <setter.value> <!-- control template expander --> <controltemplate targettype="expander" x:name="exp"> <grid> <grid.rowdefinitions> <rowdefinition height="auto"/> <rowdefinition name="contentrow" height="0"/> </grid.rowdefinitions> <border name="border" grid.row="0" background="{dynamicresource {x:static systemcolors.controldarkbrushkey}}" borderthickness="1" cornerradius="4,4,0,0" > <grid> <grid.columndefinitions> <columndefinition width="*" /> <columndefinition width="20" /> </grid.columndefinitions> <togglebutton x:name="tb" fontfamily="marlett" fontsize="9.75" background="{dynamicresource {x:static systemcolors.controldarkbrushkey}}" foreground="black" grid.column="1" content="u" ischecked="{binding path=isexpanded,mode=twoway,relativesource={relativesource templatedparent}}" /> <contentpresenter x:name="headercontent" grid.column="0" margin="4" contentsource="header" recognizesaccesskey="true" /> </grid> </border> <border x:name="content" grid.row="1" borderthickness="1,0,1,1" cornerradius="0,0,4,4" > <contentpresenter margin="4" /> </border> </grid> <controltemplate.triggers> <trigger property="isexpanded" value="true"> <setter targetname="contentrow" property="height" value="{binding elementname=content,path=height}" /> <setter property="content" targetname="tb" value="t"></setter> </trigger> </controltemplate.triggers> </controltemplate> </setter.value> </setter> </style> i this:
<style x:key="expanderstylered" basedon="{staticresource expanderstyle}" targettype="expander"> <setter property="???" value="red"/> <style>
use templatebinding:
<style targettype="expander" x:key="expanderstyle"> <setter property="background" value="{dynamicresource {x:static systemcolors.controldarkbrushkey}}"/> <setter property="foreground" value="{dynamicresource {x:static systemcolors.controltextcolor}}"/> <setter property="template"> <setter.value> <!-- control template expander --> <controltemplate targettype="expander" x:name="exp"> <grid> <grid.rowdefinitions> <rowdefinition height="auto"/> <rowdefinition name="contentrow" height="0"/> </grid.rowdefinitions> <border name="border" grid.row="0" background="{templatebinding background}" borderthickness="1" cornerradius="4,4,0,0" > <grid> <grid.columndefinitions> <columndefinition width="*" /> <columndefinition width="20" /> </grid.columndefinitions> <togglebutton x:name="tb" fontfamily="marlett" fontsize="9.75" background="{dynamicresource {x:static systemcolors.controldarkbrushkey}}" foreground="black" grid.column="1" content="u" ischecked="{binding path=isexpanded,mode=twoway,relativesource={relativesource templatedparent}}" /> <contentpresenter x:name="headercontent" grid.column="0" margin="4" contentsource="header" recognizesaccesskey="true" /> </grid> </border> <border x:name="content" grid.row="1" borderthickness="1,0,1,1" cornerradius="0,0,4,4" > <contentpresenter margin="4" /> </border> </grid> <controltemplate.triggers> <trigger property="isexpanded" value="true"> <setter targetname="contentrow" property="height" value="{binding elementname=content,path=height}" /> <setter property="content" targetname="tb" value="t"></setter> </trigger> </controltemplate.triggers> </controltemplate> </setter.value> </setter> </style> <style x:key="expanderstylered" basedon="{staticresource expanderstyle}" targettype="expander"> <setter property="background" value="#2fff0000"/> </style> and then:
<grid> <expander x:name="expander1" style="{dynamicresource expanderstyle}" header="expander" horizontalalignment="left" verticalalignment="top" margin="7,10,0,0" height="108"> <textblock width="250" height="150" textwrapping="wrap"> asklsaklsa saaskklsaklas alsaklalkjd asklsaklsaklsa saklsaklsakl jsajkjska saklsaklsakl sasa </textblock> </expander> <expander x:name="expander2" style="{dynamicresource expanderstylered}" header="expander" horizontalalignment="left" verticalalignment="top" margin="12,126,0,0" height="133"> <textblock width="250" height="150" textwrapping="wrap"> asklsaklsa saaskklsaklas alsaklalkjd asklsaklsaklsa saklsaklsakl jsajkjska saklsaklsakl sasa </textblock> </expander> </grid> 
Comments
Post a Comment