Forums | NoesisGUI

Welcome to our official discussion site. You’ll find topics on features, bugs, development, and general support here
https://www.noesisengine.com/forums/

Attached property and image source

https://www.noesisengine.com/forums/viewtopic.php?t=2544

Page 1 of 1

Attached property and image source

Posted: 09 Feb 2022, 12:40
by danrer
When I use the attached property for image.imagesource , there is an error about not being able to find the image.
Code: Select all
<Button Grid.Column="0" Content="100" Style="{StaticResource Style.MoneyButton}" dependencys:Icon.IconSource="Assets/Resources/GUI/KeyIcon.png"/>
<Button Grid.Column="1" Content="100" Style="{StaticResource Style.MoneyButton}" dependencys:Icon.IconSource="/Assets/Resources/GUI/DiamondIcon.png"/>
<Button Grid.Column="2" Content="100" Style="{StaticResource Style.MoneyButton}" dependencys:Icon.IconSource="/Assets/Resources/GUI/GoldIcon.png"/>
Code: Select all
 <Image Grid.Column="0" Source="{Binding Path=(dependencys:Icon.IconSource), RelativeSource={RelativeSource TemplatedParent}}" Stretch="Fill"/>
Code: Select all
    public class Icon : DependencyObject
    {
        public static readonly DependencyProperty IconSourceProperty;
 
        static Icon()
        {
            IconSourceProperty = DependencyProperty.RegisterAttached("IconSource", typeof(string), typeof(Icon));
        }
        public string IconSource
        {
            get { return (string)GetValue(IconSourceProperty); }
            set { SetValue(IconSourceProperty, value); }
        }
    }
In order for this to work, you must declare this picture in the resources.
Code: Select all
 <Image x:Key="MoneyKeyIcon" Source="/Assets/Resources/GUI/KeyIcon.png"/>

Re: Attached property and image source

Posted: 10 Feb 2022, 13:21
by sfernandez
The problem is that the textures corresponding to those strings are not set as dependencies of the xaml and couldn't be found when playing. This is why if you add the image as a resource it starts to work, because it is added as a dependency to the xaml.

Only Uri properties are scanned as dependencies, so you should change your property to type Uri to be processed by the xaml importer.

Unfortunately I found that the ImageSourceConverter does not accept Uri properties (I created a ticket to fix it for next release #2268). The workaround in the meantime is to set the binding directly in the BitmapImage.UriSource:
Code: Select all
<Image Grid.Column="0" Stretch="Fill">
  <Image.Source>
    <BitmapImage UriSource="{Binding Path=(dependencys:Icon.IconSource), RelativeSource={RelativeSource TemplatedParent}}"/>
  </Image.Source>
</Image>

Re: Attached property and image source

Posted: 10 Feb 2022, 15:14
by danrer
I changed the code and still get this error.
Code: Select all
      <Image Grid.Column="0" Stretch="Fill">
        <Image.Source>
          <BitmapImage UriSource="{Binding Path=(dependencys:Icon.IconSource), RelativeSource={RelativeSource TemplatedParent}}"/>
        </Image.Source>
      </Image>
Code: Select all
   public class Icon : DependencyObject
    {
        public static readonly DependencyProperty IconSourceProperty;
 
        static Icon()
        {
            IconSourceProperty = DependencyProperty.RegisterAttached("IconSource", typeof(Uri), typeof(Icon));
        }
        public Uri IconSource
        {
            get { return (Uri)GetValue(IconSourceProperty); }
            set { SetValue(IconSourceProperty, value); }
        }
    }
Code: Select all
        
                <Button Grid.Column="0" Content="100" Style="{StaticResource Style.MoneyButton}" dependencys:Icon.IconSource="/Assets/Resources/GUI/KeyIcon.png"/>
                <Button Grid.Column="1" Content="100" Style="{StaticResource Style.MoneyButton}" dependencys:Icon.IconSource="/Assets/Resources/GUI/DiamondIcon.png"/>
                <Button Grid.Column="2" Content="100" Style="{StaticResource Style.MoneyButton}" dependencys:Icon.IconSource="/Assets/Resources/GUI/GoldIcon.png"/>

Re: Attached property and image source

Posted: 10 Feb 2022, 15:54
by sfernandez
Can you check if the xaml where the Buttons using the attached property are defined has the textures as dependencies?
If you reimport the xaml asset, is it fixed?

Because I reproduced the issue before and I was able to fix it as explained, by using a Uri attached property and binding it to the BitmapImage.UriSource.

Re: Attached property and image source

Posted: 10 Feb 2022, 19:15
by danrer
This is the entire xaml that is used
Theme.xaml
Code: Select all
<ResourceDictionary 
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:b="http://schemas.microsoft.com/xaml/behaviors"
        xmlns:noesis="clr-namespace:NoesisGUIExtensions;assembly=Noesis.GUI.Extensions"
        xmlns:converters="clr-namespace:YourHeroes.GUI.Converters"
        xmlns:dependencys="clr-namespace:YourHeroes.GUI.Dependencys"
        mc:Ignorable="d">

  <converters:TabSizeConverter x:Key="tabSizeConverter"/> 
  <converters:ItemRareConverter x:Key="itemRareConverter"/> 
  
  <ImageBrush x:Key="MoneyBackgroundLeft" ImageSource="/Assets/Resources/GUI/MoneyBackground.png" ViewboxUnits="Absolute" Viewbox="0,0,14,57"/>
  <ImageBrush x:Key="MoneyBackgroundCenter" ImageSource="/Assets/Resources/GUI/MoneyBackground.png" ViewboxUnits="Absolute" Viewbox="14,0,238,57"/>
  <ImageBrush x:Key="MoneyBackgroundRight" ImageSource="/Assets/Resources/GUI/MoneyBackground.png" ViewboxUnits="Absolute" Viewbox="252,0,14,57"/> 
  <!-- <Image x:Key="MoneyKeyIcon" Source="/Assets/Resources/GUI/KeyIcon.png"/>
  <Image x:Key="MoneyDiamondIcon" Source="/Assets/Resources/GUI/DiamondIcon.png"/>
  <Image x:Key="MoneyGoldIcon" Source="/Assets/Resources/GUI/GoldIcon.png"/> -->
  
  <!-- HeroListBox -->
  <ControlTemplate x:Key="Template.HeroListBox" TargetType="{x:Type ListBox}">
    <ScrollViewer Padding="{TemplateBinding Padding}" Focusable="False">
      <ItemsPresenter />
    </ScrollViewer>
  </ControlTemplate>
  <Style x:Key="Style.HeroListBox" TargetType="{x:Type ListBox}" BasedOn="{StaticResource {x:Type ItemsControl}}">
    <Setter Property="OverridesDefaultStyle" Value="True"/>
    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
    <Setter Property="ScrollViewer.CanContentScroll" Value="True"/>
    <Setter Property="ScrollViewer.PanningMode" Value="VerticalFirst"/>
    <Setter Property="VirtualizingPanel.VirtualizationMode" Value="Recycling"/>
    <Setter Property="VirtualizingPanel.ScrollUnit" Value="Pixel"/>
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    <Setter Property="Template" Value="{StaticResource Template.HeroListBox}"/>
    <Setter Property="FocusVisualStyle" Value="{StaticResource Style.Focus.Outer.Uniform}"/>
    <Style.Triggers>
      <Trigger Property="IsEnabled" Value="False">
        <Setter Property="Foreground" Value="{DynamicResource Brush.Foreground.Disabled}"/>
      </Trigger>
    </Style.Triggers>
  </Style>

  <!-- HeroListBoxItem -->
  <ControlTemplate x:Key="Template.HeroListBoxItem" TargetType="{x:Type ListBoxItem}">
      <Grid Margin="5" RenderTransformOrigin="0.5,0.5">
          <Image Source="/Assets/Resources/GUI/HeroBackground.png" Stretch="UniformToFill"/>
          <Viewbox x:Name="Icon" RenderTransformOrigin="0.5,0.5" Margin="7">
              <Viewbox.RenderTransform>
                  <ScaleTransform/>
              </Viewbox.RenderTransform>
              <Image Source="{Binding Icon}"/>
          </Viewbox> 
      </Grid>
  </ControlTemplate>
  <Style x:Key="Style.HeroListBoxItem" TargetType="{x:Type ListBoxItem}" BasedOn="{StaticResource {x:Type ContentControl}}">
    <Setter Property="OverridesDefaultStyle" Value="True"/>
    <Setter Property="Background" Value="Transparent"/>
    <Setter Property="HorizontalContentAlignment" Value="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ListBox}}}"/>
    <Setter Property="VerticalContentAlignment" Value="{Binding VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ListBox}}}"/>
    <Setter Property="Padding" Value="12,8.5"/>
    <Setter Property="Template" Value="{StaticResource Template.HeroListBoxItem}"/>
    <Setter Property="FocusVisualStyle" Value="{StaticResource Style.Focus.Inner.Uniform}"/>
    <Style.Triggers>
      <Trigger Property="IsEnabled" Value="False">
        <Setter Property="Foreground" Value="{DynamicResource Brush.Foreground.Disabled}"/>
      </Trigger>
    </Style.Triggers>
  </Style>    

<!-- TabControl -->
  <ControlTemplate x:Key="Template.InventoryTabControl" TargetType="TabControl">
    <Grid KeyboardNavigation.TabNavigation="Local">
      <Grid.RowDefinitions>
        <RowDefinition x:Name="Row0"/>
        <RowDefinition x:Name="Row1"/>
      </Grid.RowDefinitions>
      <Grid.ColumnDefinitions>
        <ColumnDefinition x:Name="Col0"/>
        <ColumnDefinition x:Name="Col1"/>
      </Grid.ColumnDefinitions>
      <TabPanel x:Name="HeaderPanel" Panel.ZIndex="1" Background="Transparent" IsItemsHost="True" KeyboardNavigation.TabIndex="1"/>
      <Border x:Name="SelectedContentBorder" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}" KeyboardNavigation.DirectionalNavigation="Contained" KeyboardNavigation.TabIndex="2" KeyboardNavigation.TabNavigation="Local">
        <ContentPresenter x:Name="PART_SelectedContentHost" ContentSource="SelectedContent" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
      </Border>
       <Image Source="/Assets/Resources/GUI/TabLine.png" Stretch="Fill"/>
    </Grid>
    <ControlTemplate.Triggers>
      <Trigger Property="TabStripPlacement" Value="Top">
        <Setter Property="Height" Value="Auto" TargetName="Row0"/>
        <Setter Property="Height" Value="*" TargetName="Row1"/>
        <Setter Property="Width" Value="*" TargetName="Col0"/>
        <Setter Property="Width" Value="0" TargetName="Col1"/>
        <Setter Property="Grid.Row" Value="0" TargetName="HeaderPanel"/>
        <Setter Property="Grid.Column" Value="0" TargetName="HeaderPanel"/>
        <Setter Property="Grid.Row" Value="1" TargetName="SelectedContentBorder"/>
        <Setter Property="Grid.Column" Value="0" TargetName="SelectedContentBorder"/>
        <Setter Property="CornerRadius" Value="{DynamicResource Corner.Border0.Bottom}" TargetName="SelectedContentBorder"/>
      </Trigger>
      <Trigger Property="TabStripPlacement" Value="Bottom">
        <Setter Property="Height" Value="*" TargetName="Row0"/>
        <Setter Property="Height" Value="Auto" TargetName="Row1"/>
        <Setter Property="Width" Value="*" TargetName="Col0"/>
        <Setter Property="Width" Value="0" TargetName="Col1"/>
        <Setter Property="Grid.Row" Value="1" TargetName="HeaderPanel"/>
        <Setter Property="Grid.Column" Value="0" TargetName="HeaderPanel"/>
        <Setter Property="Grid.Row" Value="0" TargetName="SelectedContentBorder"/>
        <Setter Property="Grid.Column" Value="0" TargetName="SelectedContentBorder"/>
        <Setter Property="CornerRadius" Value="{DynamicResource Corner.Border0.Top}" TargetName="SelectedContentBorder"/>
      </Trigger>
      <Trigger Property="TabStripPlacement" Value="Left">
        <Setter Property="Height" Value="*" TargetName="Row0"/>
        <Setter Property="Height" Value="0" TargetName="Row1"/>
        <Setter Property="Width" Value="Auto" TargetName="Col0"/>
        <Setter Property="Width" Value="*" TargetName="Col1"/>
        <Setter Property="Grid.Row" Value="0" TargetName="HeaderPanel"/>
        <Setter Property="Grid.Column" Value="0" TargetName="HeaderPanel"/>
        <Setter Property="Grid.Row" Value="0" TargetName="SelectedContentBorder"/>
        <Setter Property="Grid.Column" Value="1" TargetName="SelectedContentBorder"/>
        <Setter Property="CornerRadius" Value="{DynamicResource Corner.Border0.Right}" TargetName="SelectedContentBorder"/>
      </Trigger>
      <Trigger Property="TabStripPlacement" Value="Right">
        <Setter Property="Height" Value="*" TargetName="Row0"/>
        <Setter Property="Height" Value="0" TargetName="Row1"/>
        <Setter Property="Width" Value="*" TargetName="Col0"/>
        <Setter Property="Width" Value="Auto" TargetName="Col1"/>
        <Setter Property="Grid.Row" Value="0" TargetName="HeaderPanel"/>
        <Setter Property="Grid.Column" Value="1" TargetName="HeaderPanel"/>
        <Setter Property="Grid.Row" Value="0" TargetName="SelectedContentBorder"/>
        <Setter Property="Grid.Column" Value="0" TargetName="SelectedContentBorder"/>
        <Setter Property="CornerRadius" Value="{DynamicResource Corner.Border0.Left}" TargetName="SelectedContentBorder"/>
      </Trigger>
      <Trigger Property="IsEnabled" Value="False">
        <Setter Property="Foreground" Value="{DynamicResource Brush.Foreground.Disabled}"/>
        <Setter Property="BorderBrush" Value="{DynamicResource Brush.Border.Disabled}"/>
      </Trigger>
    </ControlTemplate.Triggers>
  </ControlTemplate>
  <Style x:Key="Style.InventoryTabControl" TargetType="TabControl" BasedOn="{StaticResource {x:Type ItemsControl}}">
    <Setter Property="OverridesDefaultStyle" Value="True"/>
    <Setter Property="Background" Value="Transparent"/>
    <Setter Property="Padding" Value="12"/>
    <Setter Property="Template" Value="{StaticResource Template.InventoryTabControl}"/>
  </Style>

  <!-- InventoryTabItem -->
  <ControlTemplate x:Key="Template.InventoryTabItem" TargetType="TabItem">
    <Grid>
      <Border x:Name="Border" Background="Transparent" BorderBrush="{TemplateBinding Background}" Padding="{TemplateBinding Padding}">
        <ContentPresenter x:Name="ContentHost" ContentSource="Header" TextElement.FontSize="10" TextElement.Foreground="{DynamicResource Brush.Glyph.Normal}"/>
      </Border>
      <Image x:Name="SelectedArrow" Source="/Assets/Resources/GUI/TabSelected1.png" Stretch="Fill" Visibility="Hidden"/>
    </Grid>
    <ControlTemplate.Triggers>
      <Trigger Property="IsMouseOver" Value="True">
        <Setter Property="Panel.ZIndex" Value="1"/>
        <Setter Property="TextElement.Foreground" Value="{DynamicResource Brush.Glyph.Over}" TargetName="ContentHost"/>
      </Trigger>
      <Trigger Property="IsSelected" Value="True">
        <Setter Property="Panel.ZIndex" Value="2"/>
        <Setter Property="TextElement.Foreground" Value="{DynamicResource Brush.Glyph.Over}" TargetName="ContentHost"/>
        <Setter Property="Visibility" Value="Visible" TargetName="SelectedArrow"/>
      </Trigger>
      <Trigger Property="IsEnabled" Value="False">
        <Setter Property="TextElement.Foreground" Value="{DynamicResource Brush.Glyph.Disabled}" TargetName="ContentHost"/>
      </Trigger>
      <DataTrigger Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Top">
        <Setter Property="Margin" Value="0,-2,0,0" TargetName="ContentHost"/>
      </DataTrigger>
      <DataTrigger Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Bottom">
        <Setter Property="Margin" Value="0,0,0,-2" TargetName="ContentHost"/>
      </DataTrigger>
      <DataTrigger Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Left">
        <Setter Property="Margin" Value="-2,0,0,0" TargetName="ContentHost"/>
      </DataTrigger>
      <DataTrigger Binding="{Binding TabStripPlacement, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}" Value="Right">
        <Setter Property="Margin" Value="0,0,-2,0" TargetName="ContentHost"/>
      </DataTrigger>
    </ControlTemplate.Triggers>
  </ControlTemplate>
  <Style x:Key="Style.InventoryTabItem" TargetType="TabItem" BasedOn="{StaticResource {x:Type HeaderedContentControl}}">
    <Setter Property="OverridesDefaultStyle" Value="True"/>
    <Setter Property="Foreground" Value="{Binding Foreground, RelativeSource={RelativeSource AncestorType={x:Type TabControl}}}"/>
    <Setter Property="Padding" Value="12,7.5"/>
    <Setter Property="Template" Value="{StaticResource Template.InventoryTabItem}"/>
    <Setter Property="FocusVisualStyle" Value="{StaticResource Style.Focus.Inner.Uniform}"/>
    <Setter Property="Width">
      <Setter.Value>
        <MultiBinding Converter="{StaticResource tabSizeConverter}">
          <Binding RelativeSource="{RelativeSource Mode=FindAncestor,
            AncestorType={x:Type TabControl}}" />
          <Binding RelativeSource="{RelativeSource Mode=FindAncestor,
            AncestorType={x:Type TabControl}}" Path="ActualWidth" />
        </MultiBinding>
      </Setter.Value>
    </Setter>
  </Style>
  
  <!-- ItemListBox -->
  <ControlTemplate x:Key="Template.ItemListBox" TargetType="{x:Type ListBox}">
    <ScrollViewer Padding="{TemplateBinding Padding}" Focusable="False">
      <ItemsPresenter />
    </ScrollViewer>
  </ControlTemplate>
  <Style x:Key="Style.ItemListBox" TargetType="{x:Type ListBox}" BasedOn="{StaticResource {x:Type ItemsControl}}">
    <Setter Property="OverridesDefaultStyle" Value="True"/>
    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
    <Setter Property="ScrollViewer.CanContentScroll" Value="True"/>
    <Setter Property="ScrollViewer.PanningMode" Value="VerticalFirst"/>
    <Setter Property="VirtualizingPanel.VirtualizationMode" Value="Recycling"/>
    <Setter Property="VirtualizingPanel.ScrollUnit" Value="Pixel"/>
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    <Setter Property="Template" Value="{StaticResource Template.ItemListBox}"/>
    <Setter Property="FocusVisualStyle" Value="{StaticResource Style.Focus.Outer.Uniform}"/>
    <Style.Triggers>
      <Trigger Property="IsEnabled" Value="False">
        <Setter Property="Foreground" Value="{DynamicResource Brush.Foreground.Disabled}"/>
      </Trigger>
    </Style.Triggers>
  </Style>

  <!-- ItemListBoxItem -->
  <ControlTemplate x:Key="Template.ItemListBoxItem" TargetType="{x:Type ListBoxItem}">
      <Grid Margin="5" RenderTransformOrigin="0.5,0.5">
          <Image Source="/Assets/Resources/GUI/ItemBackground.png" Stretch="UniformToFill"/>
          <Image Source="{Binding ItemRare, Converter={StaticResource itemRareConverter}}" Stretch="UniformToFill"/>
          <Viewbox x:Name="Icon" RenderTransformOrigin="0.5,0.5" Margin="7">
              <Viewbox.RenderTransform>
                  <ScaleTransform/>
              </Viewbox.RenderTransform>
              <Image Source="{Binding Icon}"/>
          </Viewbox> 
      </Grid>
  </ControlTemplate>
  <Style x:Key="Style.ItemListBoxItem" TargetType="{x:Type ListBoxItem}" BasedOn="{StaticResource {x:Type ContentControl}}">
    <Setter Property="OverridesDefaultStyle" Value="True"/>
    <Setter Property="Background" Value="Transparent"/>
    <Setter Property="HorizontalContentAlignment" Value="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ListBox}}}"/>
    <Setter Property="VerticalContentAlignment" Value="{Binding VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ListBox}}}"/>
    <Setter Property="Padding" Value="12,8.5"/>
    <Setter Property="Template" Value="{StaticResource Template.ItemListBoxItem}"/>
    <Setter Property="FocusVisualStyle" Value="{StaticResource Style.Focus.Inner.Uniform}"/>
    <Style.Triggers>
      <Trigger Property="IsEnabled" Value="False">
        <Setter Property="Foreground" Value="{DynamicResource Brush.Foreground.Disabled}"/>
      </Trigger>
    </Style.Triggers>
  </Style>   

  <!-- MoneyButton dependencys -->
  <ControlTemplate x:Key="Template.MoneyButton" TargetType="{x:Type Button}">
    <Grid x:Name="TemplateRoot" RenderTransformOrigin="0.5,0.5">
      <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
      </Grid.ColumnDefinitions>
      <Grid Grid.ColumnSpan="3">
        <Grid.ColumnDefinitions>
          <ColumnDefinition Width="14"/>
          <ColumnDefinition Width="*"/>
          <ColumnDefinition Width="14"/>
        </Grid.ColumnDefinitions>
        <Rectangle Grid.Column="0" Fill="{StaticResource MoneyBackgroundLeft}"/>
        <Rectangle Grid.Column="1" Fill="{StaticResource MoneyBackgroundCenter}"/>
        <Rectangle Grid.Column="2" Fill="{StaticResource MoneyBackgroundRight}"/>
      </Grid>
      <Grid.RenderTransform>
        <ScaleTransform />
      </Grid.RenderTransform>
      <!-- <Image Grid.Column="0" Source="{Binding dependencys:Icon.IconSource}" Stretch="Fill"/> -->
      <!-- <Image Grid.Column="0" Source="{Binding Path=(dependencys:Icon.IconSource), Mode=TwoWay, RelativeSource={RelativeSource Self}}" Stretch="Fill"/> -->
      <!-- <Image Grid.Column="0" Source="{Binding RelativeSource={RelativeSource FindAncestor,AncestorType={x:Type Image}},Path=(dependencys:Icon.IconSource), Mode=TwoWay}" Stretch="Fill"/> -->
      <Image Grid.Column="0" Stretch="Fill">
        <Image.Source>
          <BitmapImage UriSource="{Binding Path=(dependencys:Icon.IconSource), RelativeSource={RelativeSource TemplatedParent}}"/>
        </Image.Source>
      </Image>
      <TextBlock Text="{TemplateBinding Content}" Grid.Column="1" HorizontalAlignment="Center" VerticalAlignment="Center"/>
      <Image Grid.Column="2" Source="/Assets/Resources/GUI/AddMoneyIcon.png" Stretch="Fill"/>
    </Grid>
    <ControlTemplate.Resources>
      <Storyboard x:Key="Anim.Press">
        <DoubleAnimation Storyboard.TargetName="TemplateRoot" Storyboard.TargetProperty="RenderTransform.ScaleX" To="0.99" Duration="0:0:0.1" DecelerationRatio="0.25"/>
        <DoubleAnimation Storyboard.TargetName="TemplateRoot" Storyboard.TargetProperty="RenderTransform.ScaleY" To="0.99" Duration="0:0:0.1" DecelerationRatio="0.25"/>
      </Storyboard>
      <Storyboard x:Key="Anim.Release">
        <DoubleAnimation Storyboard.TargetName="TemplateRoot" Storyboard.TargetProperty="RenderTransform.ScaleX" To="1" Duration="0:0:0.2" DecelerationRatio="1"/>
        <DoubleAnimation Storyboard.TargetName="TemplateRoot" Storyboard.TargetProperty="RenderTransform.ScaleY" To="1" Duration="0:0:0.2" DecelerationRatio="1"/>
      </Storyboard>
    </ControlTemplate.Resources>
    <ControlTemplate.Triggers>
      <Trigger Property="IsMouseOver" Value="True">
      </Trigger>
      <Trigger Property="IsPressed" Value="True">
        <Trigger.EnterActions>
          <BeginStoryboard Storyboard="{StaticResource Anim.Press}"/>
        </Trigger.EnterActions>
        <Trigger.ExitActions>
          <BeginStoryboard Storyboard="{StaticResource Anim.Release}"/>
        </Trigger.ExitActions>
      </Trigger>
      <Trigger Property="IsEnabled" Value="False">
        <Setter Property="Foreground" Value="{DynamicResource Brush.Foreground.Disabled}"/>
      </Trigger>
    </ControlTemplate.Triggers>
  </ControlTemplate>
  <Style x:Key="Style.MoneyButton" TargetType="{x:Type Button}" BasedOn="{StaticResource {x:Type ContentControl}}">
    <Setter Property="OverridesDefaultStyle" Value="True"/>
    <Setter Property="Background" Value="{DynamicResource Brush.Background.Normal}"/>
    <Setter Property="BorderBrush" Value="{DynamicResource Brush.Border.Normal}"/>
    <Setter Property="BorderThickness" Value="{DynamicResource Border.Normal}"/>
    <Setter Property="HorizontalContentAlignment" Value="Center"/>
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    <Setter Property="Padding" Value="8,7"/>
    <Setter Property="UseLayoutRounding" Value="True"/>
    <Setter Property="Template" Value="{StaticResource Template.MoneyButton}"/>
    <Setter Property="FocusVisualStyle" Value="{StaticResource Style.Focus.Outer.Uniform}"/>
  </Style>
  
</ResourceDictionary>
MainWindow.xaml
Code: Select all
<UserControl x:Class="YourHeroes.GUI.MainWindow"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:YourHeroes"
             xmlns:b="http://schemas.microsoft.com/xaml/behaviors"
             xmlns:dependencys="clr-namespace:YourHeroes.GUI.Dependencys"
             mc:Ignorable="d" 
             d:DesignHeight="450" d:DesignWidth="800" >
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition Height="0.15*"/>
        </Grid.RowDefinitions>
        <Grid Grid.Row="0" Grid.Column="0" Margin="5">
            <Grid.RowDefinitions>
                <RowDefinition Height="auto"/>
                <RowDefinition/>
            </Grid.RowDefinitions>
            <Label Grid.Row="0" Content="COLLECTION HERO"/>
            <ListBox x:Name="HeroesListBox" Grid.Row="1" ItemsSource="{Binding Heroes}" SelectedItem ="{Binding SelectedHero}"
                Style="{StaticResource Style.HeroListBox}" ItemContainerStyle="{StaticResource Style.HeroListBoxItem}" ScrollViewer.HorizontalScrollBarVisibility="Disabled">
                <ListBox.ItemsPanel>
                    <ItemsPanelTemplate>
                        <UniformGrid Columns="3" VerticalAlignment="Top" Margin="5" KeyboardNavigation.DirectionalNavigation="Contained"/>
                    </ItemsPanelTemplate>
                </ListBox.ItemsPanel>    
                <b:Interaction.Triggers>
                    <b:EventTrigger EventName="SelectionChanged">
                        <b:InvokeCommandAction Command="{Binding SelectHero}" CommandParameter="{Binding ElementName=HeroesListBox, Path=SelectedItem}"/>
                    </b:EventTrigger>
                </b:Interaction.Triggers>
            </ListBox>
        </Grid>
        <Grid Height="30">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="14"/>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="14"/>
            </Grid.ColumnDefinitions>
            <Rectangle Grid.Column="0" Grid.Row="0" Fill="{StaticResource MoneyBackgroundLeft}"/>
            <Rectangle Grid.Column="1" Grid.Row="0" Fill="{StaticResource MoneyBackgroundCenter}"/>
            <Rectangle Grid.Column="2" Grid.Row="0" Fill="{StaticResource MoneyBackgroundRight}"/>
        </Grid>
        <Grid Grid.Row="0" Grid.Column="2">
            <Grid.RowDefinitions>
                <RowDefinition Height="0.107*"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
            <Grid Grid.Row="0">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>
                <Button Grid.Column="0" Content="100" Style="{StaticResource Style.MoneyButton}" dependencys:Icon.IconSource="/Assets/Resources/GUI/KeyIcon.png"/>
                <Button Grid.Column="1" Content="100" Style="{StaticResource Style.MoneyButton}" dependencys:Icon.IconSource="/Assets/Resources/GUI/DiamondIcon.png"/>
                <Button Grid.Column="2" Content="100" Style="{StaticResource Style.MoneyButton}" dependencys:Icon.IconSource="/Assets/Resources/GUI/GoldIcon.png"/>
            </Grid>   
            <TabControl Grid.Row="1" Style="{StaticResource Style.InventoryTabControl}">
                <TabItem Header="Equipment" Style="{StaticResource Style.InventoryTabItem}" FontSize="10">
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="auto"/>
                            <RowDefinition Height="auto"/>
                            <RowDefinition Height="auto"/>
                        </Grid.RowDefinitions>
                        <ListBox Grid.Row="0" x:Name="EquipmentListBox" ItemsSource="{Binding SelectedHero.Equipment}" 
                                 Style="{StaticResource Style.ItemListBox}" ItemContainerStyle="{StaticResource Style.ItemListBoxItem}" ScrollViewer.HorizontalScrollBarVisibility="Disabled">
                            <ListBox.ItemsPanel>
                                <ItemsPanelTemplate>
                                    <UniformGrid Columns="3" VerticalAlignment="Top" Margin="5" KeyboardNavigation.DirectionalNavigation="Contained"/>
                                </ItemsPanelTemplate>
                            </ListBox.ItemsPanel>    
                            <ListBox.ItemTemplate>
                                <DataTemplate>
                                    <Viewbox x:Name="Icon" RenderTransformOrigin="0.5,0.5">
                                        <Viewbox.RenderTransform>
                                            <ScaleTransform/>
                                        </Viewbox.RenderTransform>
                                        <Image Source="{Binding Icon}"/>
                                    </Viewbox>
                                </DataTemplate>
                            </ListBox.ItemTemplate>
                        </ListBox>
                        <Image Grid.Row="1" Source="/Assets/Resources/GUI/InventoryLine.png" Stretch="UniformToFill"/>
                        <ListBox Grid.Row="2" x:Name="ArtefactsListBox" ItemsSource="{Binding SelectedHero.Artefacts}" 
                                 Style="{StaticResource Style.ItemListBox}" ItemContainerStyle="{StaticResource Style.ItemListBoxItem}" ScrollViewer.HorizontalScrollBarVisibility="Disabled">
                            <ListBox.ItemsPanel>
                                <ItemsPanelTemplate>
                                    <UniformGrid Columns="3" VerticalAlignment="Top" Margin="5" KeyboardNavigation.DirectionalNavigation="Contained"/>
                                </ItemsPanelTemplate>
                            </ListBox.ItemsPanel>    
                            <ListBox.ItemTemplate>
                                <DataTemplate>
                                    <Viewbox x:Name="Icon" RenderTransformOrigin="0.5,0.5">
                                        <Viewbox.RenderTransform>
                                            <ScaleTransform/>
                                        </Viewbox.RenderTransform>
                                        <Image Source="{Binding Icon}"/>
                                    </Viewbox>
                                </DataTemplate>
                            </ListBox.ItemTemplate>
                        </ListBox>
                    </Grid>
                </TabItem>
                <TabItem Header="Other 1" Style="{StaticResource Style.InventoryTabItem}">
                    
                </TabItem>
                <TabItem Header="Other 2" Style="{StaticResource Style.InventoryTabItem}">
                    
                </TabItem>
            </TabControl>
        </Grid>  
        <Image Grid.ColumnSpan="3" Grid.Row="1" Source="/Assets/Resources/GUI/popup_bg.png" VerticalAlignment="Center" HorizontalAlignment="Center" Stretch="Fill"/>
    </Grid>
</UserControl>

Re: Attached property and image source

Posted: 12 Feb 2022, 08:26
by danrer
Any idea what I'm doing wrong?

Re: Attached property and image source

Posted: 14 Feb 2022, 10:55
by sfernandez
Find attached a sample scene I created from your xaml files and code. I tried it with latest 3.1.2 version and the images are added as dependencies to the MainWindow xaml, and then correctly shown when playing. Could you please check if you have anything different in your project.

Re: Attached property and image source

Posted: 18 Feb 2022, 13:16
by danrer
Everything works without errors. I checked my code again, and now everything works without errors, too.

Re: Attached property and image source

Posted: 18 Feb 2022, 13:25
by sfernandez
Ok, thanks for the update, maybe you didn't reimported the xaml after changing the attached property type.
Marking this as solved.
All times are UTC+02:00
Page 1 of 1
Powered by phpBB® Forum Software © phpBB Limited
https://www.phpbb.com/