Question

我有ContentPresenter，显示UserControl。 UserControl包含绑定到图像列表的ItemsControl。当我为我的DataContext更改UserControl时，图像就在那里，它们只是没有显示。我认为发生的事情是他们只是堆叠在一起而不是包裹，但我不知道为什么。这里有一些代码可以让您更好地了解我正在使用的内容。

修改为了更好地了解程序如何在这里流动是正在发生的事情。 ListOfScreenShots是另一个用户控件，它显示允许用户选择图像的图像和按钮。选择屏幕截图后，它们会添加到List<BitmapSource>，并且应该显示在EnlargedScreenShots中。以下是UserControl的应用方式

private void MainWindowCommandBinding_Executed(object sender, ExecutedRoutedEventArgs e) { if (e.Command == SelectImageCommand) { selectedImages.Add(e.Parameter as BitmapSource); ess.DataContext = selectedImages; this._contentPresenter2.Content = ess; } }

以下是ListOfScreenShots的xaml。这也应该更清楚地了解正在发生的事情。

ListOfScreenShots xaml：

    <UserControl x:Class="Client.App.Support.ListOfScreenShots"
             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" 
             mc:Ignorable="d"
             xmlns:support="clr-namespace:Client.App.Support"
             d:DesignHeight="400" d:DesignWidth="800">
    <Grid>
        <ScrollViewer HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Auto">
            <ItemsControl Name="_listBox" ItemsSource="{Binding ''}">
                <!--<ItemsControl.ItemsPanel>
                    <ItemsPanelTemplate>
                        <WrapPanel Orientation="Vertical"/>
                    </ItemsPanelTemplate>
                </ItemsControl.ItemsPanel>-->
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <StackPanel Orientation="Horizontal">
                            <Image Name ="_thumbnailImage" Width="600" VerticalAlignment="Center" Source="{Binding ''}"/>
                            <Button VerticalAlignment="Center" HorizontalAlignment="Center" Name="_addscreenshot" Content="Select Screenshot" Command="{x:Static support:SelectScreenShots.SelectImageCommand}" 
                                    CommandParameter="{Binding ''}" Width="150" />
                        </StackPanel>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>
        </ScrollViewer>
    </Grid>
</UserControl>

主窗口xaml：

<dxc:DXWindow x:Class="Client.App.Support.SelectScreenShots"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:dxc="http://schemas.devexpress.com/winfx/2008/xaml/core" Focusable="False" IsTabStop="False"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:dx="http://schemas.devexpress.com/winfx/2008/xaml/core"
    xmlns:libRes="clr-namespace:Shared.Lib.Resources;assembly=Shared.Lib"
    xmlns:support="clr-namespace:Client.App.Support"
    Title="Select Images" Height="600" Width="800">

<Window.CommandBindings>
    <CommandBinding Command="support:SelectScreenShots.SelectImageCommand" Executed="MainWindowCommandBinding_Executed"/>
</Window.CommandBindings>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="367"/>
            <RowDefinition Height="167"/>
            <RowDefinition Height="33"/>
        </Grid.RowDefinitions>
        <ContentPresenter Grid.Row="0" Name="_contentPresenter" Content="{Binding ''}"/>
        <ContentPresenter Grid.Row="1" Name="_contentPresenter2" Content="{Binding ''}"/>
        <StackPanel Grid.Row="2" HorizontalAlignment="Right"  Orientation="Horizontal">
            <Button Name="_OK_Button" Content="OK" Click="_OK_Button_Click" Margin="0,5,5,5" Width="75" Height="23"/>
            <Button Name="_Cancel_Button" Content="Cancel" Click="_Cancel_Button_Click" Margin="0,5,5,5" Width="75" Height="23"/>
        </StackPanel>
    </Grid>

背后的主窗口代码：

    public partial class SelectScreenShots : DXWindow
{
    public static readonly RoutedCommand SelectImageCommand = new RoutedCommand();

    public static List<BitmapSource> selectedImages = new List<BitmapSource>();
    public static List<BitmapSource> screenshots = new List<BitmapSource>();
    public static ListOfScreenShots loss = new ListOfScreenShots();
    public static EnlargedScreenShot ess = new EnlargedScreenShot();

    public SelectScreenShots()
    {
        Client.GUI.AppGUI.SetupTheme(this);
        InitializeComponent();
        screenshots = RenderWindows();
        loss.DataContext = screenshots;
        this._contentPresenter.Content = loss;
    }

    public static List<BitmapSource> RenderWindows()
    {
        var windows = Application.Current.Windows
                                         .OfType<Window>()
                                         .Where(x => x.GetType() != typeof(AskAQuestionDialog) & x.GetType() != typeof(SelectScreenShots));

        var bitmaps = new List<BitmapSource>();

        foreach (var window in windows)
        {
            var bitmap = new RenderTargetBitmap((int)window.Width, (int)window.Height, 96d, 96d, PixelFormats.Default);
            bitmap.Render(window);

            bitmaps.Add(bitmap);
        }

        return bitmaps;
    }


    private void MainWindowCommandBinding_Executed(object sender, ExecutedRoutedEventArgs e)
    {
        if (e.Command == SelectImageCommand)
        {
            selectedImages.Add(e.Parameter as BitmapSource);
            ess.DataContext = selectedImages;
            this._contentPresenter2.Content = ess;
        }
    }


    private void _OK_Button_Click(object sender, RoutedEventArgs e)
    {
        this.Close();
    }

    private void _Cancel_Button_Click(object sender, RoutedEventArgs e)
    {
        this.Close();
    }
}
}

用户控制xaml：

<UserControl x:Class="Client.App.Support.EnlargedScreenShot"
         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" 
         mc:Ignorable="d" 
         d:DesignHeight="162" d:DesignWidth="800">
<Grid>
    <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Disabled">
        <StackPanel Orientation="Horizontal">
            <ItemsControl Name="_itemsControl" ItemsSource="{Binding ''}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <WrapPanel Orientation="Horizontal"/>
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                        <Image Name ="_thumbnailImage" HorizontalAlignment="Left" VerticalAlignment="Center" Source="{Binding ''}"/>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
        </StackPanel>
    </ScrollViewer>
</Grid>

除了调整大小和滚动条可见性不正常之外，还有其他一些事情正在发生，但我会稍后解决这些问题。现在这真的让我烦恼。

任何人都会看到任何明显错误。我猜测它与我在堆栈面板中包含所有内容的事实有关，但在我将DataTemplate中的图像包裹在StackPanel中并且它仍然没有'之前工作。我还尝试完全删除StackPanel，只使用WrapPanel。

非常感谢任何帮助。谢谢。

Answer 1

为了给出明确的答案，有很多事情要做，但有一点会立即浮现在脑海中，因为你没有进行财产变更通知。尝试将列表切换为ObservableCollection并阅读this MSDN article on the subject。

Answer 2

我的猜测：

1）您的UserControl大小为0; 0，因此您将看不到任何内容。将UserControl宽度/高度绑定到ContentPresenter宽度/高度，如下所示：

<UserControl x:Class="Client.App.Support.EnlargedScreenShot"
         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" 
         mc:Ignorable="d" 
         Width="{Binding Path=ActualWidth, RelativeSource={RelativeSource AncestorType={x:Type ContentPresenter}}}"
         Height="{Binding Path=ActualHeight, RelativeSource={RelativeSource AncestorType={x:Type ContentPresenter}}}"
         d:DesignHeight="162" d:DesignWidth="800">

2）向Image元素添加Width / Height属性，明确设置它以进行测试。还要添加TextBlock并将Text绑定到Image.Source以查看绑定是否正常工作。

这个问题需要Snoop（WPF Spy实用程序）的帮助，它会在几分钟内回答这个问题，所以也许这是目前最有用的建议：http://snoopwpf.codeplex.com/

您正在两个控件之间共享相同的BitmapSource。我不知道，但这也可能是鱼腥味的一部分。所以，如果可以，请尝试复制它。

Answer 3

我的代码背后显然做错了。

执行命令时，我没有实例化EnlargedScreenShot的新实例。它被实例化一次，当窗口加载，然后我没有更新它。我只需要移动

EnlargedScreenShot ess = new EnlargedScreenShot();

进入这里：

private void MainWindowCommandBinding_Executed(object sender, ExecutedRoutedEventArgs e)
{
    EnlargedScreenShot ess = new EnlargedScreenShot();
    if (e.Command == SelectImageCommand)
    {
        selectedImages.Add(e.Parameter as BitmapSource);
        ess.DataContext = selectedImages;
        this._contentPresenter2.Content = ess;
    }
}

为什么我的图像没有显示在我的UserControl中？

3 个答案: