views:

37

answers:

1

Hi guys,
I have created a button template consisting of a border and a content presenter. A style is then wrapped around this template and applied to a button, when this button is used it is not carrying the values for horizontal and vertical alignment. In the designer the allignments are showing and the button is in the correct place, but when i run the program the button appears to have horizontal alignment = left and vertical alignment = right. Any ideas?
here is the code for the template:

<ControlTemplate TargetType="Button" x:Key="DefaultButtonTemplate">

    <Border CornerRadius="4"
            Background="{TemplateBinding Background}"
            BorderThickness="{TemplateBinding BorderThickness}"
            BorderBrush="{TemplateBinding BorderBrush}">
        <Grid>
            <ContentPresenter ContentSource="{TemplateBinding Content}" 
                    ContentTemplate="{TemplateBinding ContentTemplate}"
                    VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                    HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"/>
        </Grid>
    </Border>
</ControlTemplate>

Here is the code for the style:

<Style TargetType="Button">
    <Setter Property="Background" Value="{DynamicResource WindowHeaderBrush}" />
    <Setter Property="BorderBrush" Value="{DynamicResource WindowBorderBrush}" />
    <Setter Property="Template" Value="{DynamicResource DefaultButtonTemplate}" />
    <Setter Property="BorderThickness" Value="1" />
    <Style.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter Property="Background" Value="{DynamicResource ButtonHoverBrush}" />
            <Setter Property="BitmapEffect" Value="{DynamicResource ButtonHoverGlow}" />
        </Trigger>
        <Trigger Property="IsPressed" Value="True">
            <Setter Property="Background" Value="{DynamicResource ButtonPressedBrush}" />
        </Trigger>
    </Style.Triggers>
</Style>

And here is the code for the button :)

<Button Name="button1" Height="31"  VerticalAlignment="Bottom" HorizontalAlignment="Right" Margin="0,0,10,10">Button</Button>

There is no code behind file

The result of this code is a button that appears in the TOP LEFT corner of the parent flat up against the edge

A: 

i think that the line

<Button Name="button1" Height="31"  VerticalAlignment="Bottom" HorizontalAlignment="Right" Margin="0,0,10,10">Button</Button>

should be

<Button Name="button1" Height="31"  VerticalContentAlignment="Bottom" HorizontalContentAlignment="Right" Margin="0,0,10,10">Button</Button>

or else you are only setting the alignment of the button not the content.

Oggy
You know what... i'm impressed. You touched on the issue (i sorted it out). In the template of the window that was holding the button i was using verticalContentAlignment and HorizontalContentAlignment to set the allignment of the content, i killed that off and now it works fine :) i'll cred you with the answer because your method would have worked, but for the wrong reason
TerrorAustralis
hmm, thats right, i misunderstood the question, glad it worked out for you anyway :)
Oggy