How to center content in a button template and keep mouse events in an empty area

I use Button


to customize the look of my buttons like this:

<ControlTemplate TargetType="Button">
    <Border x:Name="Border" CornerRadius="6" BorderThickness="1">
        <ContentPresenter Margin="3" HorizontalAlignment="Center" VerticalAlignment="Center" RecognizesAccessKey="True" ContentSource="Content"/>


I want to center horizontally and vertically Content

, but when I do that, the "blank" areas Button

are unresponsive Mouse

. When I use it Stretch

, everything Button

behaves well but is Content

aligned at the top right.

How can I do it?


source to share

1 answer

To show the entire test scope of a tag Border

, you need to initialize the property Background

with Brush

. It might even be transparent, which will have the same visual effect as the default null.

 <Border ... Background="Transparent" />




All Articles