当我使用用户控件时，用户控件中的 WPF 图像未显示在编辑器中

Question

在我的程序中，我有选项卡和选项卡栏用户控件来按住按钮以在它们之间进行切换。选项卡栏中的按钮是我制作的 TabButton 用户控件，其中有一个背景图像、另一个半透明全黑图像（用于显示选择了哪个选项卡）、一个文本块以及顶部用于检测单击的不可见按钮。背景图像显示在 TabButton 用户控件的编辑器中，但不会显示在选项卡栏和主窗口的编辑器中，尽管文本块和按钮会显示。半透明图像的可见性设置为隐藏，但即使我更改它，它也不会显示在 TabButton 编辑器之外或运行时。

编辑器中的TabButton预览：
编辑器中的 TabBar 预览
添加背景是因为否则很难看到文本：
无背景：
主窗口预览：
在运行时：

我已将图像的构建操作设置为资源，清理并重建解决方案并检查所有代码。

TabButton.xaml

<UserControl x:Class="EmeraldBattleFactoryHelper.Custom_Controls.TabButton"
             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:EmeraldBattleFactoryHelper.Custom_Controls"
             mc:Ignorable="d" 
             d:DesignHeight="100" d:DesignWidth="295">
    <Grid>
        <Image Source="/Custom Controls/Resources/tab.png" Stretch="Fill" RenderOptions.BitmapScalingMode="NearestNeighbor"/>
        <Image x:Name="SelectionIndicator" Source="/Custom Controls/Resources/35percentblack.png" Stretch="Fill" Panel.ZIndex="1" Visibility="Hidden"/>
        <TextBlock Text="TEXT BLOCK" Background="Transparent" Panel.ZIndex="2" HorizontalAlignment="Center" VerticalAlignment="Center" FontFamily="Power Green"/>
        <Button Background="Transparent" BorderThickness="0" Panel.ZIndex="3" Click="Button_Click"/>
    </Grid>
</UserControl>

TabButton.xaml.cs

public partial class TabButton : UserControl
{
    public TabButton()
    {
        InitializeComponent();
    }

    private void Button_Click(object sender, RoutedEventArgs e)
    {
        SelectionIndicator.Visibility = Visibility.Visible;
    }

    public void Deselect() 
    {
        SelectionIndicator.Visibility = Visibility.Hidden;
    }
}

TabBar.xaml

<UserControl x:Class="EmeraldBattleFactoryHelper.Custom_Controls.TabBar"
             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:EmeraldBattleFactoryHelper.Custom_Controls"
             mc:Ignorable="d" 
             d:DesignHeight="100" d:DesignWidth="1280">
    <Grid x:Name="TabBarGrid" SizeChanged="TabBarGrid_SizeChanged">
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition x:Name="SettingsColumn"/>
        </Grid.ColumnDefinitions>
        <local:TabButton/>
        <local:TabButton Grid.Column="1"/>
        <local:TabButton Grid.Column="2"/>
        <local:TabButton Grid.Column="3"/>
        <local:TabButton Grid.Column="4"/>
    </Grid>
</UserControl>

TabBar.xaml.cs

public partial class TabBar : UserControl
{
    public TabBar()
    {
        InitializeComponent();
    }

    private void TabBarGrid_SizeChanged(object sender, SizeChangedEventArgs e)
    {
        SettingsColumn.Width = new GridLength(TabBarGrid.ActualHeight);
    }

    private void ResetButtons() 
    {
        foreach (TabButton tabButton in TabBarGrid.Children) 
        {
            tabButton.Deselect();
        }            
    }
}

主窗口.xaml

<Window x:Class="EmeraldBattleFactoryHelper.MainWindow"
        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:local="clr-namespace:EmeraldBattleFactoryHelper"
        xmlns:customControls="clr-namespace:EmeraldBattleFactoryHelper.Custom_Controls"
        mc:Ignorable="d"
        Title="Battle Factory Helper" Height="720" Width="1280" ResizeMode="CanMinimize">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition x:Name="TabBar" MaxHeight="100" MinHeight="40" Height="15*"/>
            <RowDefinition Height="85*"/>
        </Grid.RowDefinitions>
        <customControls:TabBar/>
    </Grid>
</Window>

MainWindow.xaml.cs

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
    }
}

Answer 1

我认为这实际上可能是设计师的一个错误。

但是，修复方法是完全限定图像的路径并包含程序集名称。假设您的程序集名称是

EmeraldBattleFactoryHelper

，您的图像标签将需要程序集前缀

EmeraldBattleFactoryHelper;component

，如下所示：

<Image Source="EmeraldBattleFactoryHelper;component/Custom Controls/Resources/tab.png" Stretch="Fill" RenderOptions.BitmapScalingMode="NearestNeighbor"/>
<Image x:Name="SelectionIndicator" Source="EmeraldBattleFactoryHelper;component/Custom Controls/Resources/35percentblack.png" Stretch="Fill" Panel.ZIndex="1" Visibility="Hidden"/>

添加程序集名称后，图像显示在设计器的父组件中。