c# - Styling repeat buttons? -
i using following template style repeat buttons text-box's scroll bar:
<style x:key="scrollbarlinebutton" targettype="{x:type repeatbutton}"> <setter property="snapstodevicepixels" value="true" /> <setter property="overridesdefaultstyle" value="true" /> <setter property="focusable" value="false" /> <setter property="template"> <setter.value> <controltemplate targettype="{x:type repeatbutton}"> <!--here adjust properties on top , bottom buttons --> <border x:name="border" cornerradius="4,4,0,0" borderthickness="0" > <border.borderbrush> <lineargradientbrush startpoint="0,0" endpoint="0,1"> <lineargradientbrush.gradientstops> <gradientstopcollection> <gradientstop color="{dynamicresource bordermediumcolor}" offset="0.0" /> <gradientstop color="{dynamicresource borderdarkcolor}" offset="1.0" /> </gradientstopcollection> </lineargradientbrush.gradientstops> </lineargradientbrush> </border.borderbrush> <border.background> <lineargradientbrush startpoint="0,0" endpoint="0,1"> <lineargradientbrush.gradientstops> <gradientstopcollection> <!--here set keys color--> <gradientstop color="white"/> <gradientstop color="white" offset="0" /> </gradientstopcollection> </lineargradientbrush.gradientstops> </lineargradientbrush> </border.background> <visualstatemanager.visualstategroups> <visualstategroup x:name="commonstates"> <visualstate x:name="normal" /> <visualstate x:name="mouseover" /> <visualstate x:name="pressed"> <storyboard> <coloranimationusingkeyframes storyboard.targetname="border" storyboard.targetproperty="(panel.background).(gradientbrush.gradientstops)[1].(gradientstop.color)"> <easingcolorkeyframe keytime="0" value="{staticresource controlpressedcolor}" /> </coloranimationusingkeyframes> </storyboard> </visualstate> <visualstate x:name="disabled"> <storyboard> <coloranimationusingkeyframes storyboard.targetname="arrow" storyboard.targetproperty="(shape.fill).(solidcolorbrush.color)"> <easingcolorkeyframe keytime="0" value="#79b0d4" /> </coloranimationusingkeyframes> </storyboard> </visualstate> </visualstategroup> </visualstatemanager.visualstategroups> <path x:name="arrow" horizontalalignment="center" verticalalignment="center" data="{binding content, relativesource={relativesource templatedparent}}" > <path.fill> <!--here set arrow color--> <solidcolorbrush color="#79b0d4"/> </path.fill> </path> </border> </controltemplate> </setter.value> </setter> </style>
however, template modifies both, top , bottom button @ same time. there way somehow 'unlink' 2 buttons, , then, instance change corners on top button, or size of top button?
Comments
Post a Comment