Home > Software design >  XAML - Cannot add border thickness to button when style is applied
XAML - Cannot add border thickness to button when style is applied

Time:06-10

I am trying to add a border thickness to my first navigation button. Normally, you can easily add a BorderThickness to a button but when I add my own style it hides the BorderThickness and BorderBrush. I added a BorderThickness to the style (0,0,0,1) but am not able to have a border thickness of (0,1,0,0) to the first initial button. Any ideas?

    <UserControl.Resources>
        <Style x:Key="navButtStyle" TargetType="Button">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid Background="{TemplateBinding Background}">
                            <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                            <Border BorderThickness="0,0,0,1" BorderBrush="Black"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </UserControl.Resources>
<Button Style="{StaticResource navButtStyle}"
        x:Name="navButton1" 
        Grid.Row="1" 
        Content="TR"
        Background="#33333D" 
        FontFamily="Roboto" 
        FontSize="65" 
        FontWeight="Bold" 
        Foreground="White"
        BorderBrush="Black"
        BorderThickness="0,1,0,0"
        HorizontalContentAlignment="Center" 
        ToolTip="navButton0"
        Click="navButton1_Click"
        />
<Button Style="{StaticResource navButtStyle}" x:Name="navButton2" Grid.Row="2" Background="#33333D" ToolTip="navButton2">
     <Grid>
          <TextBlock Text="&#xF00AF;" Padding="30,30,0,0" FontSize="56" FontFamily="Material Design Icons Desktop" Foreground="White"/>
          <TextBlock Text="&#xF05A9;" Padding="0,0,30,30" FontSize="56" FontFamily="Material Design Icons Desktop" Foreground="White"/> 
      </Grid>
</Button>
<Button Style="{StaticResource navButtStyle}" x:Name="navButton3" Grid.Row="3" Content="SL" Background="#33333D" FontFamily="Roboto" FontSize="65" FontWeight="Bold" Foreground="White" HorizontalContentAlignment="Center" ToolTip="navButton3" />

Navigation Buttons

CodePudding user response:

property value hardcoded in Template cannot be easily changed from outside. use TemplateBindings instead:

<Style x:Key="navButtStyle" TargetType="Button">
    <Setter Property="BorderThickness" Value="0,0,0,1"/>
    <Setter Property="BorderBrush" Value="Black"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Grid Background="{TemplateBinding Background}">
                    <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                    <Border BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}"/>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>
  • Related