无法更改按钮高度 WPF

Question

I have a UserControl which contains a button CollapseConsoleBtn :

<UserControl //namespaces
   <Grid
        Name="LoggingGrid"
        Height="100"
        Background="Black">
        <Grid.RowDefinitions>
            <RowDefinition Height="25" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <StackPanel
            Grid.Row="0"
            Margin="5,0,0,0"
            Orientation="Horizontal">
            <Button
                x:Name="CollapseBtn"
                Width="25"
                Height="25"
                HorizontalAlignment="Left"
                VerticalAlignment="Center"
                Click="CollapseBtn_Click"
                Content="▼"
                FontSize="12">
                <Button.Template>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Grid>
                            <Ellipse Fill="White" />
                            <ContentPresenter
                                HorizontalAlignment="Center"
                                VerticalAlignment="Center"
                                Content="{TemplateBinding Content}" />
                        </Grid>
                    </ControlTemplate>
                </Button.Template>
            </Button>
            <Image
                Height="25"
                Margin="7,0,0,0"
                Source="/Images/console-icon.png"
                Visibility="Visible" />
            <Label
                Margin="2,0,0,0"
                Content="Console"
                FontSize="16"
                Foreground="White" />
        </StackPanel>
   </Grid>
</UserControl>

My problem here is that I want to make the button smaller - for example with Height 20 and Width 20. I can change the width, but apparently, the height is fixed to be 25. Even if I set it to 15, it remains the same size.

Has anyone encountered this problem?

Answer 1

I think trouble is in <TextBlock Grid.Row="0" Margin="{StaticResource SmallLeftMargin}"> (you put Button and StackPanel there).

I tried to removed it, a bit played with margins and paddings, setted a size of button 16x16 ( MinWidth & MinHeight properties) and get this result:

UserControl XAML:

<Grid Name="LoggingGrid"
      Height="100"
      Background="Black">
    <Grid.RowDefinitions>
        <RowDefinition Height="26" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Button x:Name="CollapseButton"
            Click="CollapseBtn_Click"
            MinWidth="16"
            MinHeight="16"
            Margin="2,0,0,0"
            HorizontalAlignment="Left"
            VerticalAlignment="Center"
            Grid.Row="0"
            Content="▼">
        <Button.Template>
            <ControlTemplate TargetType="{x:Type Button}">
                <Grid>
                    <Ellipse Fill="White" />
                    <ContentPresenter HorizontalAlignment="Center"
                                      VerticalAlignment="Center"
                                      Content="{TemplateBinding Content}" />
                </Grid>
            </ControlTemplate>
        </Button.Template>
    </Button>
    <StackPanel Margin="5,0,0,0" 
                Orientation="Horizontal">
        <Image Height="25"
               Visibility="Visible" />
        <Label Margin="18,0,0,0"
               Content="Console"
               HorizontalContentAlignment="Center"
               VerticalContentAlignment="Center"
               Padding="0,0,0,2"
               FontSize="16"
               Foreground="White" />
    </StackPanel>
</Grid>

Answer 2

What you can do is:

1. Set the button's MinHeight instead of Height .
2. Make sure that the button's HorizontalAlignment and VerticalAlignment are set as their default value is Stretch .