WPF - Image not showing up

Question

I have my application and now I want to add a close button. I created it in the designer with a Image (Maybe there is a better way! If so, please answer) and everything seems to work:

Then I run the application and it looks like this:

Why isn't there the button / Image anymore? I have no idea! BTW, the picture is a .png and is saved in the resources!

my wpf code:

<Window x:Class="Chat_App.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="500" Width="1000" WindowStyle="None" AllowsTransparency="True">
    <Window.Background>
        <RadialGradientBrush>
            <GradientStop Color="#FF323A44" Offset="1"/>
            <GradientStop Color="#FF384A5A"/>
        </RadialGradientBrush>
    </Window.Background>

    <Grid>
        <Border BorderThickness="1" Height="26" VerticalAlignment="Top" Background="#FF436B85" MouseLeftButtonDown="Border_MouseLeftButtonDown">
            <Image HorizontalAlignment="Left" Height="20" VerticalAlignment="Top" Width="33" Source="pack://siteoforigin:,,,/Resources/simat_btn_chat.png" MouseLeftButtonDown="Image_MouseLeftButtonDown" Margin="963,2,0,0"/>
        </Border>
    </Grid>
</Window>

BTW, I tried it with a ico file too!

Thank you!

Answer 1

Remove the verticalAlighment and horizontalAlignment of image and wrap it inside a grid, It should be like this,

<Border BorderThickness="1" Height="26" VerticalAlignment="Top" Background="#FF436B85">
 <Grid HorizontalAlignment="Right" Width="24">
 <Image Source="Images/download.jpg"  Margin="0,0,0,0" d:LayoutOverrides="Width"/>
</Grid>
</Border>

Answer 2

try adding it as a resource (enables reusability too!)

<Window.Resources>
     <Image x:Key="MyImage" Source.../>
</Window.Resources>

Then use it in your Grid as:

<Button Content={StaticResource MyImage} />

Also, make sure your image is built as a Resource

EDIT: The button is showing up, but not your image. So it cannot find it properly. Try changing your pack url.

Either like,

Source="pack://application:,,,/Resources/simat_btn_chat.png"

or

Source="/Resources/simat_btn_chat.png"