Search code examples
wpfimageresourcedictionary

ResourceDictionary Make an Image Style


I am trying to make a style for adding Images in wpf. This is my code right now. I see the pictures in the design mode from Visual Studio But when I start the program the pictures don't show up.

I made a ResourceDictionary and I added them into it.

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

<Style TargetType="Image" x:Key="InstanceLogo">
    <Setter Property="Source">
        <Setter.Value>
            <BitmapImage UriSource="Resources/InstanceResources/logo.png"/>
        </Setter.Value>
    </Setter>
</Style>

<Style TargetType="Image" x:Key="AddNewInstance">
    <Setter Property="Source">
        <Setter.Value>
            <BitmapImage UriSource="Resources/ProgramResources/Add-New.png"/>
        </Setter.Value>
    </Setter>
</Style>
<Style TargetType="Image" x:Key="Settings">
    <Setter Property="Source">
        <Setter.Value>
            <BitmapImage UriSource="Resources/ProgramResources/Settings.png"/>
        </Setter.Value>
    </Setter>
</Style>
<Style TargetType="Image" x:Key="About">
    <Setter Property="Stretch" Value="Fill"/>
    <Setter Property="Source">
        <Setter.Value>
            <BitmapImage UriSource="Resources/ProgramResources/About.png"/>
        </Setter.Value>
    </Setter>
</Style>
</ResourceDictionary>

This is the window where I try to add them.

<Window x:Class="GhostLauncher.Client.Views.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="GhostLauncher" Height="700" Width="800" WindowStyle="ThreeDBorderWindow">

<Window.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary Source="../ResourceDictionaries/ResourceDictionary.xaml" />
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
</Window.Resources>

<DockPanel>
    <ToolBarTray DockPanel.Dock="Top">
        <ToolBar>
            <Button>
                <Image Style="{StaticResource AddNewInstance}"  />
            </Button>
            <Button>
                <Image Style="{StaticResource Settings}"  />
            </Button>
            <Button>
                <Image Style="{StaticResource About}"  />
            </Button>
        </ToolBar>
    </ToolBarTray>
    <ListView DockPanel.Dock="Left">
        <ListViewItem>
            <StackPanel>
                <Image Style="{StaticResource InstanceLogo}" />
                <Label HorizontalAlignment="Center">Minecraft 1</Label>
            </StackPanel>
        </ListViewItem>
        <ListViewItem>
            <StackPanel>
                <Image Style="{StaticResource InstanceLogo}" />
                <Label HorizontalAlignment="Center">Minecraft 2</Label>
            </StackPanel>
        </ListViewItem>
        <ListViewItem>
            <StackPanel>
                <Image Style="{StaticResource InstanceLogo}" />
                <Label HorizontalAlignment="Center">Minecraft 3</Label>
            </StackPanel>
        </ListViewItem>
        <ListViewItem>
            <StackPanel>
                <Image Style="{StaticResource InstanceLogo}" />
                <Label HorizontalAlignment="Center">Minecraft 4</Label>
            </StackPanel>
        </ListViewItem>
        <ListViewItem>
            <StackPanel>
                <Image Style="{StaticResource InstanceLogo}" />
                <Label HorizontalAlignment="Center">Minecraft 5</Label>
            </StackPanel>
        </ListViewItem>
    </ListView>
    <StackPanel DockPanel.Dock="Right">

    </StackPanel>
</DockPanel>
</Window>

Solution

  • What you need is this:

    <Style TargetType="Image" x:Key="InstanceLogo">
        <Setter Property="Source" Value="Resources/InstanceResources/logo.png">
    </Style>