无法在设计视图中创建 UserControl 的实例，在发布模式和运行时工作

Question

I have a user control LoadingIndicatorControl which is displayed in various other controls when loading is happened.

This user control is very simple and looks like this:

<StackPanel HorizontalAlignment="Stretch"
            Visibility="{Binding Loading, Converter={StaticResource Bool2Vis}}">
    <Image x:Name="imgLoadingSpinner"
           gif:ImageBehavior.AnimatedSource="pack://application:,,,/Images/Loading_Spinner.gif"
           HorizontalAlignment="Right"
           Width="30"
           Height="30" />
</StackPanel>

I nest it in other views like this:

<uc:LoadingIndicatorControl Loading="{Binding Loading}"
                            DockPanel.Dock="Bottom"/>

When I run this application it compiles without issues and the loading indicator is displayed as I expect.

However at design time only I'm getting errors about this user control, related to the image resource. This gif is set to Build Action Resource .

In my host view I get this:

And if I look at the detail of why, it says Cannot locate resource 'images/loading_spinner.gif' :

If I look at LoadingIndicatorControl in design view it does in fact locate the loading_spinner.gif resource and gives no errors.

What I have tried:

• Clean and rebuild numerous times
• Close VS2019 and reopen
• Clean, close VS, reopen and rebuild
• Set Loading_Spinner.gif Build Action to Embedded Resource (was Resource which also works at runtime)
• Tried platform targets Any CPU , x64 , x86

Interestingly, setting to build configuration to Release does prevent the error from appearing! It only appears when Debug is used.

I'm using Visual Studio Professional v16.11.16.

Any ideas how I can fix this?

Answer 1

Just use the direct path to the image:

<Image gif:ImageBehavior.AnimatedSource="Images/Loading_Spinner.gif"
       HorizontalAlignment="Center"
       VerticalAlignment="Center"
       Width="30"
       Height="30" />

If you really need the pack URI, the format is explained here , it look like this:

<Image gif:ImageBehavior.AnimatedSource="pack://application:,,,/SO_72648958;component/Images/Loading_Spinner.gif"
       HorizontalAlignment="Center"
       VerticalAlignment="Center"
       Width="30"
       Height="30" />

Working demo here .