wpf - SurfaceCheckBox default template -
can please extract default template of surfacecheckbox me? have tried using blend 2 failed miserably. extracted template has unresolved targetname references.
i trying change template check mark top aligned. centered vertically default , there doesn't seem direct way change it.
[edit] have tried blend 3 bit better still missing "glow" target , many references it. renders template unusable unless "glow" references removed. if working template no glow.
from blend 4. working time, apperently had add reference microsoft.surface.presentation.generic.dll , add
xmlns:microsoft_surface_presentation_generic="clr-namespace:microsoft.surface.presentation.generic;assembly=microsoft.surface.presentation.generic" before glow part when editing style.
<!-- simplebuttonfocusvisual used show keyboard focus around simplebutton control --> <style x:key="surfacebuttonfocusvisual"> <setter property="control.template"> <setter.value> <controltemplate> <!-- nothing, don't want make difference whether element has focus or not--> </controltemplate> </setter.value> </setter> </style> <!--common brushes --> <solidcolorbrush x:key="normalforegroundbrush" color="#ff000000" /> <solidcolorbrush x:key="default_fillbrush" color="#33a4b4bd"/> <lineargradientbrush x:key="edgebrush" endpoint="0,1" startpoint="0,0"> <gradientstop color="#7fffffff" offset="0"/> <gradientstop color="#0cffffff" offset="1"/> </lineargradientbrush> <!-- disabled brushes used disabled of each control --> <solidcolorbrush x:key="disabledrenderbrush" color="#0cffffff"/> <solidcolorbrush x:key="disablededgebrush" color="#33ffffff"/> <solidcolorbrush x:key="disabledbevelborder" color="#33000000"/> <solidcolorbrush x:key="disabledforegroundbrush" color="#a5333333"/> <solidcolorbrush x:key="shadowborderbrush" color="#33000000"/> <lineargradientbrush x:key="bevelborderbrush" endpoint="0,0" startpoint="0,1"> <gradientstop color="#66000000" offset="0"/> <gradientstop color="#33000000" offset="1"/> </lineargradientbrush> <lineargradientbrush x:key="renderbrush" endpoint="0,0" startpoint="0,1"> <gradientstop color="#26000000" offset="0"/> <gradientstop color="#4cffffff" offset="1"/> </lineargradientbrush> <!--color glow--> <color x:key="glowcolor">#ffffffff</color> <!-- buttonbase --> <style x:key="surfacebuttonstyle" targettype="{x:type buttonbase}"> <setter property="snapstodevicepixels" value="true" /> <setter property="focusvisualstyle" value="{staticresource surfacebuttonfocusvisual}" /> <setter property="fontfamily" value="segoe ui" /> <setter property="fontsize" value="10" /> <setter property="foreground" value="{staticresource normalforegroundbrush}" /> <setter property="background" value="{staticresource default_fillbrush}" /> <setter property="borderbrush" value="{staticresource edgebrush}" /> <setter property="borderthickness" value="1,1,1,1" /> <setter property="horizontalcontentalignment" value="center" /> <setter property="verticalcontentalignment" value="center" /> <setter property="padding" value="15,6,15,6" /> <setter property="istabstop" value="false" /> <setter property="focusable" value="false" /> <setter property="minwidth" value="30" /> <setter property="minheight" value="30" /> <setter property="template"> <setter.value> <controltemplate targettype="{x:type buttonbase}"> <controltemplate.resources> <storyboard x:key="press"> <doubleanimationusingkeyframes begintime="00:00:00" storyboard.targetname="glow" storyboard.targetproperty="(uielement.opacity)"> <splinedoublekeyframe keytime="00:00:00.1000000" value="1" /> </doubleanimationusingkeyframes> <thicknessanimationusingkeyframes begintime="00:00:00" storyboard.targetname="glow" storyboard.targetproperty="(frameworkelement.margin)"> <splinethicknesskeyframe keytime="00:00:00.1000000" value="-3,-3,-3,-3" /> </thicknessanimationusingkeyframes> </storyboard> <storyboard x:key="release"> <doubleanimationusingkeyframes begintime="00:00:00" storyboard.targetname="glow" storyboard.targetproperty="(uielement.opacity)"> <splinedoublekeyframe keytime="00:00:00.0000000" value="1" /> <splinedoublekeyframe keyspline="0.5,0.5,0.5,1" keytime="00:00:00.5000000" value="0" /> </doubleanimationusingkeyframes> <thicknessanimationusingkeyframes begintime="00:00:00" storyboard.targetname="glow" storyboard.targetproperty="(frameworkelement.margin)"> <splinethicknesskeyframe keytime="00:00:00.0000000" value="-3,-3,-3,-3" /> <splinethicknesskeyframe keyspline="0.5,0.5,0.5,1" keytime="00:00:00.5000000" value="1,1,1,1" /> </thicknessanimationusingkeyframes> </storyboard> </controltemplate.resources> <grid x:name="grid" snapstodevicepixels="{templatebinding snapstodevicepixels}"> <border margin="1,1,1,0" x:name="shadow" borderthickness="0,0,0,1" cornerradius="6,6,6,6" padding="1,1,1,1" borderbrush="{staticresource shadowborderbrush}" /> <rectangle x:name="base" fill="{templatebinding background}" stroke="{staticresource bevelborderbrush}" strokethickness="1" radiusx="5" radiusy="5" snapstodevicepixels="{templatebinding snapstodevicepixels}" margin="1,1,1,1" /> <rectangle x:name="renderoverlay" opacity="1" fill="{staticresource renderbrush}" stroke="{templatebinding borderbrush}" strokethickness="1" radiusx="4" radiusy="4" snapstodevicepixels="{templatebinding snapstodevicepixels}" margin="2,2,2,2" /> <microsoft_surface_presentation_generic:surfaceshadowchrome margin="1,1,1,1" x:name="glow" color="{staticresource glowcolor}" cornerradius="4,4,4,4" opacity="0" /> <contentpresenter x:name="content" rendertransformorigin="0.5,0.5" horizontalalignment="{templatebinding horizontalcontentalignment}" margin="{templatebinding padding}" verticalalignment="{templatebinding verticalcontentalignment}" snapstodevicepixels="{templatebinding snapstodevicepixels}"> <contentpresenter.rendertransform> <translatetransform x="0" y="-1" /> </contentpresenter.rendertransform> </contentpresenter> </grid> <controltemplate.triggers> <trigger property="ispressed" value="true"> <trigger.enteractions> <beginstoryboard storyboard="{staticresource press}" /> </trigger.enteractions> <trigger.exitactions> <beginstoryboard storyboard="{staticresource release}" /> </trigger.exitactions> </trigger> <trigger property="isenabled" value="true" /> <trigger property="isenabled" value="false"> <setter property="fill" value="{staticresource disabledrenderbrush}" targetname="renderoverlay" /> <setter property="stroke" value="{staticresource disablededgebrush}" targetname="renderoverlay" /> <setter property="stroke" value="{staticresource disabledbevelborder}" targetname="base" /> <setter property="borderbrush" value="#00000000" targetname="shadow" /> <setter property="foreground" value="{staticresource disabledforegroundbrush}" /> <setter property="background" value="#00ffffff" /> </trigger> </controltemplate.triggers> </controltemplate> </setter.value> </setter> </style> <solidcolorbrush x:key="disabledbackgroundbrush" color="#00000000"/> <solidcolorbrush x:key="disabledborderbrush" color="#33000000"/> <radialgradientbrush x:key="checkbox_renderoverlaybrush" gradientorigin="0.627,0.5"> <radialgradientbrush.relativetransform> <transformgroup> <scaletransform centerx="0.5" centery="0.5" scalex="-2.056" scaley="-4.033"/> <skewtransform anglex="0" angley="0" centerx="0.5" centery="0.5"/> <rotatetransform angle="90.17" centerx="0.5" centery="0.5"/> <translatetransform x="-0.016" y="-0.429"/> </transformgroup> </radialgradientbrush.relativetransform> <gradientstop color="#19000000" offset="0.205"/> <gradientstop color="#0cffffff" offset="0.652"/> </radialgradientbrush> <!--checkbox brushes--> <lineargradientbrush x:key="checkmarkicongradientbrush" endpoint="0.5,0" startpoint="0.5,1"> <gradientstop color="#ff292929" offset="0.5"/> <gradientstop color="#ff1b1b1b" offset="0.196"/> </lineargradientbrush> <!-- checkbox --> <style x:key="surfacecheckboxstyle1" targettype="{x:type my:surfacecheckbox}" basedon="{staticresource surfacebuttonstyle}"> <setter property="horizontalcontentalignment" value="left" /> <setter property="background" value="transparent" /> <setter property="borderbrush" value="transparent" /> <setter property="foreground" value="{staticresource normalforegroundbrush}" /> <setter property="padding" value="5,0,0,0" /> <setter property="template"> <setter.value> <controltemplate targettype="{x:type my:surfacecheckbox}"> <controltemplate.resources> <storyboard x:key="press"> <doubleanimationusingkeyframes begintime="00:00:00" storyboard.targetname="glow" storyboard.targetproperty="(uielement.opacity)"> <splinedoublekeyframe keytime="00:00:00.1000000" value="1" /> </doubleanimationusingkeyframes> <thicknessanimationusingkeyframes begintime="00:00:00" storyboard.targetname="glow" storyboard.targetproperty="(frameworkelement.margin)"> <splinethicknesskeyframe keytime="00:00:00.1000000" value="-3,-3,-3,-3" /> </thicknessanimationusingkeyframes> </storyboard> <storyboard x:key="release"> <doubleanimationusingkeyframes begintime="00:00:00" storyboard.targetname="glow" storyboard.targetproperty="(uielement.opacity)"> <splinedoublekeyframe keytime="00:00:00.0000000" value="1" /> <splinedoublekeyframe keyspline="0.5,0.5,0.5,1" keytime="00:00:00.5000000" value="0" /> </doubleanimationusingkeyframes> <thicknessanimationusingkeyframes begintime="00:00:00" storyboard.targetname="glow" storyboard.targetproperty="(frameworkelement.margin)"> <splinethicknesskeyframe keytime="00:00:00.0000000" value="-3,-3,-3,-3" /> <splinethicknesskeyframe keyspline="0.5,0.5,0.5,1" keytime="00:00:00.5000000" value="1,1,1,1" /> </thicknessanimationusingkeyframes> </storyboard> <storyboard x:key="unchecked"> <doubleanimation duration="00:00:00.2000000" storyboard.targetname="checkmark" storyboard.targetproperty="opacity" to="0" /> </storyboard> <storyboard x:key="checked"> <doubleanimation duration="00:00:00.2000000" storyboard.targetname="checkmark" storyboard.targetproperty="opacity" to="1" /> </storyboard> <storyboard x:key="threestateenter"> <doubleanimationusingkeyframes begintime="00:00:00" storyboard.targetname="threestatemark" storyboard.targetproperty="(uielement.opacity)"> <splinedoublekeyframe keytime="00:00:00.1000000" value="0.9" /> </doubleanimationusingkeyframes> </storyboard> <storyboard x:key="threestateexit"> <doubleanimationusingkeyframes begintime="00:00:00" storyboard.targetname="threestatemark" storyboard.targetproperty="(uielement.opacity)"> <splinedoublekeyframe keytime="00:00:00.2000000" value="0" /> </doubleanimationusingkeyframes> </storyboard> </controltemplate.resources> <bulletdecorator minheight="30" minwidth="30" height="auto" background="transparent" snapstodevicepixels="{templatebinding snapstodevicepixels}" x:name="bulletdecorator"> <bulletdecorator.bullet> <grid minheight="30" minwidth="30" width="30" height="30" snapstodevicepixels="{templatebinding snapstodevicepixels}"> <rectangle x:name="base" fill="{templatebinding background}" stroke="transparent" strokethickness="1" radiusx="7" radiusy="7" snapstodevicepixels="{templatebinding snapstodevicepixels}" margin="2,2,2,2" /> <rectangle x:name="button" fill="{staticresource default_fillbrush}" stroke="{staticresource bevelborderbrush}" strokethickness="1" radiusx="7" radiusy="7" snapstodevicepixels="{templatebinding snapstodevicepixels}" margin="2,2,2,2" /> <rectangle x:name="renderoverlay" fill="{staticresource checkbox_renderoverlaybrush}" stroke="{staticresource edgebrush}" strokethickness="1" radiusx="6" radiusy="6" snapstodevicepixels="{templatebinding snapstodevicepixels}" margin="3,3,3,3" /> <microsoft_surface_presentation_generic:surfaceshadowchrome cornerradius="6,6,6,6" x:name="glow" color="{staticresource glowcolor}" opacity="0" margin="-1,-1,-1,-1" /> <path x:name="checkmark" strokeendlinecap="flat" fill="{x:null}" stroke="{staticresource checkmarkicongradientbrush}" strokestartlinecap="flat" strokethickness="4" horizontalalignment="stretch" verticalalignment="stretch" width="auto" height="auto" data="m4.2195036,10.149215 l9.4262573,13.556164 17.449568,5.9264725 17.449648,6.780637 9.3715682,13.987686 4.2190426,11.048134 z" opacity="0" snapstodevicepixels="{templatebinding snapstodevicepixels}" margin="7.96,11.023,7.999,8.187" stretch="fill" /> <rectangle x:name="threestatemark" opacity="0" fill="{staticresource checkmarkicongradientbrush}" stroke="{staticresource bevelborderbrush}" strokethickness="1" radiusx="4" radiusy="4" snapstodevicepixels="{templatebinding snapstodevicepixels}" margin="6,6,6,6" /> </grid> </bulletdecorator.bullet> <grid margin="5,0,0,0" snapstodevicepixels="{templatebinding snapstodevicepixels}"> <grid background="transparent" x:name="contentbox" snapstodevicepixels="{templatebinding snapstodevicepixels}"> <contentpresenter horizontalalignment="{templatebinding horizontalcontentalignment}" margin="{templatebinding padding}" x:name="content" verticalalignment="{templatebinding verticalcontentalignment}" snapstodevicepixels="{templatebinding snapstodevicepixels}" /> </grid> </grid> </bulletdecorator> <controltemplate.triggers> <multitrigger> <multitrigger.enteractions> <beginstoryboard storyboard="{staticresource threestateenter}" /> </multitrigger.enteractions> <multitrigger.exitactions> <beginstoryboard storyboard="{staticresource threestateexit}" /> </multitrigger.exitactions> <multitrigger.conditions> <condition property="isthreestate" value="true" /> <condition property="ischecked" value="{x:null}" /> </multitrigger.conditions> </multitrigger> <trigger property="ischecked" value="false"> <trigger.enteractions> <beginstoryboard storyboard="{staticresource unchecked}" /> </trigger.enteractions> <trigger.exitactions> <beginstoryboard storyboard="{staticresource checked}" /> </trigger.exitactions> </trigger> <trigger property="ischecked" value="true"> <trigger.enteractions> <beginstoryboard storyboard="{staticresource checked}" /> </trigger.enteractions> <trigger.exitactions> <beginstoryboard storyboard="{staticresource unchecked}" /> </trigger.exitactions> </trigger> <trigger property="ispressed" value="true"> <trigger.enteractions> <beginstoryboard storyboard="{staticresource press}" /> </trigger.enteractions> <trigger.exitactions> <beginstoryboard storyboard="{staticresource release}" /> </trigger.exitactions> </trigger> <trigger property="isenabled" value="false"> <setter property="fill" targetname="button" value="{staticresource disabledbackgroundbrush}" /> <setter property="stroke" targetname="button" value="{staticresource disabledborderbrush}" /> <setter property="foreground" value="{staticresource disabledforegroundbrush}" /> <setter property="fill" targetname="renderoverlay" value="{staticresource disabledbackgroundbrush}" /> <setter property="stroke" targetname="checkmark" value="{staticresource disabledborderbrush}" /> <setter property="opacity" targetname="renderoverlay" value="0.5" /> </trigger> </controltemplate.triggers> </controltemplate> </setter.value> </setter> </style>
Comments
Post a Comment