c# - ControlTemplate working correctly in Blend but not in actual application -

-

i created custom button, nothing fancy, extension of mahapps squarebutton little colored marker @ left side.

enter image description here

i designed in blend, , copied code real application in visual studio. when starting in blend it's working fine, when starting in visual studio marker not visible , text gets left aligned, button looking normal squarebutton. doing wrong?

enter image description here

the xaml put copied blend:

<style x:key="markerbuttonstyle" targettype="{x:type button}">     <setter property="minheight" value="25"/>     <setter property="fontfamily" value="{dynamicresource defaultfont}"/>     <setter property="fontweight" value="semibold"/>     <setter property="background" value="{dynamicresource whitebrush}"/>     <setter property="borderbrush" value="{dynamicresource blackbrush}"/>     <setter property="foreground" value="{dynamicresource textbrush}"/>     <setter property="padding" value="5,6"/>     <setter property="borderthickness" value="2"/>     <setter property="snapstodevicepixels" value="true"/>     <setter property="template">         <setter.value>             <controltemplate targettype="{x:type button}">                 <grid background="{templatebinding background}">                     <visualstatemanager.visualstategroups>                         <visualstategroup x:name="commonstates">                             <visualstate x:name="normal"/>                             <visualstate x:name="disabled">                                 <storyboard>                                     <doubleanimationusingkeyframes storyboard.targetproperty="opacity" storyboard.targetname="disabledvisualelement">                                         <splinedoublekeyframe keytime="0" value="0.7"/>                                     </doubleanimationusingkeyframes>                                     <doubleanimationusingkeyframes storyboard.targetproperty="(uielement.opacity)" storyboard.targetname="part_contentpresenter">                                         <easingdoublekeyframe keytime="0" value="0.3"/>                                     </doubleanimationusingkeyframes>                                 </storyboard>                             </visualstate>                         </visualstategroup>                         <visualstategroup x:name="focusstates">                             <visualstate x:name="focused"/>                             <visualstate x:name="unfocused"/>                         </visualstategroup>                         <visualstategroup x:name="validationstates">                             <visualstate x:name="valid"/>                             <visualstate x:name="invalidfocused"/>                             <visualstate x:name="invalidunfocused"/>                         </visualstategroup>                     </visualstatemanager.visualstategroups>                     <border x:name="background" borderbrush="{templatebinding borderbrush}" borderthickness="{templatebinding borderthickness}" background="{x:null}" snapstodevicepixels="{templatebinding snapstodevicepixels}"/>                     <rectangle fill="#ffaa2222" horizontalalignment="left" width="15" margin="{binding borderthickness, elementname=background}" strokethickness="0" ishittestvisible="false"/>                     <rectangle x:name="disabledvisualelement" fill="{dynamicresource controlsdisabledbrush}" ishittestvisible="false" opacity="0"/>                     <custom:contentcontrolex x:name="part_contentpresenter" contenttemplate="{templatebinding contenttemplate}" content="{templatebinding content}" contentstringformat="{templatebinding contentstringformat}" horizontalcontentalignment="{templatebinding horizontalcontentalignment}" padding="{templatebinding padding}" recognizesaccesskey="true" snapstodevicepixels="{templatebinding snapstodevicepixels}" verticalcontentalignment="{templatebinding verticalcontentalignment}"/>                 </grid>                 <controltemplate.triggers>                     <trigger property="ismouseover" value="true">                         <setter property="background" value="{dynamicresource graybrush8}"/>                         <setter property="foreground" value="{dynamicresource blackbrush}"/>                     </trigger>                     <trigger property="ispressed" value="true">                         <setter property="background" value="{dynamicresource blackbrush}"/>                         <setter property="foreground" value="{dynamicresource whitebrush}"/>                     </trigger>                 </controltemplate.triggers>             </controltemplate>         </setter.value>     </setter> </style>

just custom part of button:

<rectangle fill="#ffaa2222" horizontalalignment="left" width="15" margin="{binding borderthickness, elementname=background}" strokethickness="0" ishittestvisible="false"/>

and code put around vs:

<resourcedictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"                 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"                 xmlns:controls="http://metro.mahapps.com/winfx/xaml/controls"                 xmlns:view="clr-namespace:myapplication.view">     <style x:key="markerbuttonstyle" targettype="{x:type view:markerbutton}">     ...     </style>     <style targettype="{x:type view:markerbutton}" basedon="{staticresource markerbuttonstyle}"/> </resourcedictionary>

then used button this:

<view:markerbutton markercolor="{binding color}" content="{binding name}" markerwidth="15" .... />

with punker76's solution of extending button this:

enter image description here

the positioning broken, xaml seems right....

fixed old solution, problem width: declared uint instead of double. still, button appears different normal square style (different border, focus rect, text alignment) , don't know why.

enter image description here

first show this

<style x:key="markerbuttonstyle" targettype="{x:type button}">

and this

<style x:key="markerbuttonstyle" targettype="{x:type view:markerbutton}">

if markerbutton button, should work if use first style targets button

<style targettype="{x:type view:markerbutton}"        basedon="{staticresource markerbuttonstyle}">        <setter property="markercolor" value="#ffaa2222" />        <setter property="markerwidth" value="15" /> </style>

enter image description here

<button content="test" horizontalalignment="center" verticalalignment="center" width="100" />

edit

you can use attached properties , inherited style instead createing new button class.

public static class buttonshelper {     public static readonly dependencyproperty markercolorproperty         = dependencyproperty.registerattached("markercolor", typeof(brush), typeof(buttonshelper), new frameworkpropertymetadata(brushes.transparent));      public static void setmarkercolor(dependencyobject obj, brush value)     {         obj.setvalue(markercolorproperty, value);     }      public static brush getmarkercolor(dependencyobject obj)     {         return (brush)obj.getvalue(markercolorproperty);     }      public static readonly dependencyproperty markerwidthproperty         = dependencyproperty.registerattached("markerwidth", typeof(double), typeof(buttonshelper), new frameworkpropertymetadata(15d));      public static void setmarkerwidth(dependencyobject obj, double value)     {         obj.setvalue(markerwidthproperty, value);     }      public static double getmarkerwidth(dependencyobject obj)     {         return (double)obj.getvalue(markerwidthproperty);     } }

usage

<style x:key="markerbuttonstyle" basedon="{staticresource squarebuttonstyle}" targettype="{x:type button}">     <setter property="buttonshelper.markercolor" value="#ffaa2222"/>     <setter property="buttonshelper.markerwidth" value="15"/>     <setter property="padding" value="2"/>     <setter property="contenttemplate">         <setter.value>             <datatemplate>                 <grid horizontalalignment="stretch">                     <rectangle width="{binding relativesource={relativesource ancestortype=button}, path=(buttonshelper.markerwidth), mode=oneway}"                                horizontalalignment="left"                                fill="{binding relativesource={relativesource ancestortype=button}, path=(buttonshelper.markercolor), mode=oneway}"                                ishittestvisible="false"                                strokethickness="0" />                     <textblock horizontalalignment="center"                                verticalalignment="center"                                text="{binding mode=oneway}" />                 </grid>             </datatemplate>         </setter.value>     </setter> </style>  <style basedon="{staticresource markerbuttonstyle}" targettype="{x:type button}" />

you can change color in xaml this

<button content="test" buttonshelper.markercolor="yellowgreen" />

enter image description here


Comments

Post a Comment

Popular posts from this blog

java - Run spring boot application error: Cannot instantiate interface org.springframework.context.ApplicationListener -

-
i have spring project , try make use spring boot , run @ embadded tomcat following : https://spring.io/guides/gs/rest-service/ this application //@configuration //@enableaspectjautoproxy @springbootapplication @componentscan(basepackages = "gux.prome") public class application { public static void main(string[] args) { springapplication.run(application.class, args); } } if use maven command: mvn spring-boot:run , project starts fine, need debug , run main method @ intelij, exception occurs: exception in thread "main" java.lang.illegalargumentexception: cannot instantiate interface org.springframework.context.applicationlistener : org.springframework.boot.logging.classpathloggingapplicationlistener @ org.springframework.boot.springapplication.createspringfactoriesinstances(springapplication.java:414) @ org.springframework.boot.springapplication.getspringfactoriesinstances(springapplication.java:394) @ org.springframework.bo...
Read more

reactjs - React router and this.props.children - how to pass state to this.props.children -

-
i'm using react-router first time , don't know how think in yet. here's how i'm loading components in nested routes. entry point .js reactdom.render( <router history={hashhistory} > <route path="/" component={app}> <route path="models" component={content}> </route> </router>, document.getelementbyid('app') ); app.js render: function() { return ( <div> <header /> {this.props.children} </div> ); } so child of app content component sent in. i'm using flux , app.js has state , listens changes, don't know how pass state down this.props.children. before using react-router app.js defines children explicitly, passing state natural don't see how now. using couple of react helper methods can add state, props , whatever else this.props.children render: function() { var children = react.ch...
Read more

Excel VBA "Microsoft Windows Common Controls 6.0 (SP6)" Location Changes -

-
i have excel workbook used generate quotations customers. there main page user inputs data, , there buttons generate various pdfs , send them customer. however, 1 user consistently getting error preventing generating , sending pdfs. i beleive "microsoft windows common controls 6.0 (sp6)". it's installed on users' computers. on mine, location "c:\windows\syswow64\mscomctl.ocx" on others "c:\windows\system32\mscomctl.ocx" the user experiencing issues on 32-bit machine, "mscomctl.ocx" file should in system32. have manually put in there, , pointed common controls reference in vba it. issue seems keep reverting looking in syswow64. since folder doesn't exist, can't find it, , can't produce pdfs. i thought perhaps issue user running older version of office (2007) there users on 2013 , 2016. thought perhaps mixture of 64-bit , 32-bit users. user gets sent workbook other users (as quotation process goes further, gets passed ...
Read more