Note that there are some explanatory texts on larger screens.

plurals
  1. PODisplay image in content presenter in button
    primarykey
    data
    text
    <p>I have a button with a style that displays an image inside it. I would like to be able to specify the image it uses using the <code>Content</code> property on the button (or some other means). </p> <p>How can accomplish this without actually nesting an image directly in the button.</p> <pre><code>&lt;BitmapImage x:Key="closeImage" UriSource="close.png" /&gt; </code></pre> <p>I thought I could maybe specify the image file name like so:</p> <pre><code>&lt;Button Content="{{StaticResource closeImage}" x:Name="closeButton" Click="closeButton_Click" Style="{DynamicResource WindowToolboxButton}"/&gt; </code></pre> <p>Style:</p> <pre><code> &lt;Style x:Key="WindowToolboxButton" TargetType="{x:Type Button}"&gt; &lt;Setter Property="FocusVisualStyle" Value="{StaticResource ButtonFocusVisual}"/&gt; &lt;Setter Property="Background" Value="{StaticResource ButtonNormalBackgroundFill}"/&gt; &lt;Setter Property="BorderBrush" Value="{StaticResource ButtonBorder}"/&gt; &lt;Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/&gt; &lt;Setter Property="HorizontalContentAlignment" Value="Center"/&gt; &lt;Setter Property="VerticalContentAlignment" Value="Center"/&gt; &lt;Setter Property="Template"&gt; &lt;Setter.Value&gt; &lt;ControlTemplate TargetType="{x:Type Button}"&gt; &lt;Grid x:Name="grid" Height="15" Width="15"&gt; &lt;Border x:Name="border" CornerRadius="2,2,2,2" BorderBrush="#FFBBCDD2" BorderThickness="1" Opacity="0" Margin="0"&gt; &lt;Border.Background&gt; &lt;LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"&gt; &lt;GradientStop Color="#FF82A3AC" Offset="1"/&gt; &lt;GradientStop Color="#7FCDD9DC"/&gt; &lt;/LinearGradientBrush&gt; &lt;/Border.Background&gt; &lt;/Border&gt; &lt;Image x:Name="image" Source="close.png" Stretch="None" VerticalAlignment="Center" HorizontalAlignment="Center" &gt; &lt;/Image&gt; &lt;/Grid&gt; &lt;/ControlTemplate&gt; &lt;/Setter.Value&gt; &lt;/Setter&gt; &lt;/Style&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload