Auto size Button Style

Question

I have this Style:

<!--Normal Button Style -->
<Style TargetType="{x:Type Button}" x:Key="NormalButtonStyle">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ButtonBase}">
                <Grid Background="{TemplateBinding Background}" SnapsToDevicePixels="True" Effect="{DynamicResource ShadowEffect}" >
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="16"/>
                        <ColumnDefinition/>
                    </Grid.ColumnDefinitions>

                    <Image Source="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Tag}" HorizontalAlignment="Left" Width="16" Stretch="None"  Margin="0,1" />
                    <!--<TextBlock Grid.Column="1" Text="{TemplateBinding Content}" Width="Auto" Margin="0,1" Padding="0" TextWrapping="Wrap" VerticalAlignment="Center" />-->         
                    <ContentPresenter Grid.Column="1" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" 
                      VerticalAlignment="{TemplateBinding VerticalContentAlignment}" RecognizesAccessKey="True" />
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

And this Button:

<Button Content="Record" HorizontalAlignment="Left" 
    VerticalAlignment="Top" Width="63" Style="{StaticResource NormalButtonStyle}" 
    Tag="Blabla.png" Height="24"/>

That gives me this:

The Question

For localization reasons, How to make the button with automatic size depending on the inner text?

Answer 1

Simple: don't give the button a fixed width (you've set it to 63) and make sure its HorizontalAlignment is not set to Stretch (so Left is fine).

You may also want to add some padding to give the text more breathing space.