Question

我想在统一的网格上显示多个图像，我从互联网上获取他们的网址。）当我执行代码时，图像不会显示。这是视频窗口：

<Window x:Name="videos" x:Class="Navigateur.Presentation.Videos"
        xmlns:my="clr-namespace:Navigateur.Presentation"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Window2" Height="207" Width="463" WindowStyle="None" ResizeMode="NoResize" Topmost="True" WindowState="Maximized">

    <Grid>
        <ItemsControl Margin="72,30,76,30" ItemsSource="{Binding images}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <UniformGrid Columns="4" Rows="3"/>
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <Image Source="{Binding}"/>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
    </Grid>
</Window>

这就是背后的代码：

using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Shapes;

namespace Navigateur.Presentation
{
    /// <summary>
    /// Logique d'interaction pour Window2.xaml
    /// </summary>
    public partial class Videos : Window
    {
        ObservableCollection<Image> images;
        public Videos()
        {
            InitializeComponent();

        }
        public ObservableCollection<Image> Images()
        {
            images = new ObservableCollection<Image>();
            ServiceReferenceVideo.VideoServiceClient wcf = new ServiceReferenceVideo.VideoServiceClient();
            foreach (var item in wcf.GetAllVideos())
            {
                string link_thumb = wcf.GetThumbImage((wcf.GetVideoId(item.urlVideo)));
                var wSource = new BitmapImage(new Uri(link_thumb));
                var wImage = new Image { Source = wSource };
                images.Add(wImage);
            }
            return images;
        }


    }
}

Answer 1

这里有几个问题：

您的列表（ItemsControl）通过Binding访问图片，但您从未设置列表的DataContext - 绑定系统将尝试从中获取数据的对象（在您的case，Videos窗口本身）。
绑定仅适用于公共属性，而不适用于images集合等私人字段。
当Images()函数完成加载缩略图时，需要通过实现INotifyPropertyChanged通知绑定系统绑定集合（公共属性）已更改提升PropertyChanged事件，或将财产设为DependencyProperty。
现在编写的方式，Images()函数创建了一个Image的集合，而ItemsControl将它们用作新Image的源。使用Image作为Image的来源是过度的（如果它甚至可行）。 Image开心即可。虽然URI是一个来源，但代码中不会生成Image，您的images集合可以只是link_thumb网址的列表。

我建议您阅读WPF中的数据绑定。那里有很多资源。

对于这种特殊情况，因为所有内容都在Videos窗口中完成，您可以完全跳过绑定，只需将图像列表强制送入ItemsControl，如果您为其命名：

<ItemsControl Margin="72,30,76,30" x:Name="_imageList" >
    ...

代码隐藏：

public void Images()
{
    var images = new ObservableCollection<string>();
    var wcf = new ServiceReferenceVideo.VideoServiceClient();
    foreach (var item in wcf.GetAllVideos())
    {
        string link_thumb = wcf.GetThumbImage((wcf.GetVideoId(item.urlVideo)));
        images.Add(link_thumb);
    }

    _imageList.ItemsSource = images;
}

在WPF中绑定图像

1 个答案: