WPF-将列表绑定到列表视图

Posted 2023-02-23

【中文标题】WPF-将列表绑定到列表视图

【英文标题】：WPF- Bind list to listview

【发布时间】：2017-09-22 03:08:54

【问题描述】：

我正在创建一个 wpf 应用程序并从我的 USB 网络摄像头捕获图像。我尝试将所有捕获的图像存储在List 中，并在Listview 中显示它们

public List<BitmapImage> listOfCapturedImages = new List<BitmapImage>();

private void addNewImageButton_Click(object sender, RoutedEventArgs e)
        
            CameraWindow cw = new CameraWindow(this);
            cw.newlyCapturedImage += (BitmapImage newImage) =>
            
                listOfCapturedImages.Add(newImage);
                newlyAddedImage.Source = newImage;
            ;
            cw.Show();
        

XAML：

<ListView ItemsSource="Binding listOfCapturedImages" Height="345" Margin="577,10,10,0" VerticalAlignment="Top">            
            <ListView.View>
                <GridView>
                    <GridView.ColumnHeaderContainerStyle>
                        <Style TargetType="GridViewColumnHeader">
                            <Setter Property="Visibility" Value="Collapsed"/>
                        </Style>
                    </GridView.ColumnHeaderContainerStyle>
                    <GridViewColumn x:Name="previewImagesColumn">
                        <GridViewColumn.CellTemplate>
                            <DataTemplate>
                                <StackPanel Orientation="Vertical">
                                <Button x:Name="firstImageOflistViewButton" Content="Binding listOfCapturedImages" Height="50">
                                    <Button.Template>
                                        <ControlTemplate TargetType="Button">
                                            <ContentPresenter/>
                                        </ControlTemplate>
                                    </Button.Template>
                                </Button>
                                </StackPanel>
                            </DataTemplate>
                        </GridViewColumn.CellTemplate>
                    </GridViewColumn>
                </GridView>
            </ListView.View>

有人可以帮我吗，我缺少什么？

【参考方案1】：

几个问题

使用ObservableCollection 而不是List。 List 在添加项目时不通知 View 更新自身。 ObservableCollection 就是这样做的。

listOfCapturedImages 是一个字段。即使设置为public，也不能用于WPF中的绑定。因为字段对XAML 是不可见的，而属性是可见的。所以这样做

public ObservableCollection<BitmapImage> listOfCapturedImages  get;  = 
   new ObservableCollection<BitmapImage>();

【讨论】：

Xaml 怎么样？我也可以在那里进行更改吗？

Tadej 涵盖了 Xaml 问题，这涵盖了问题背后的代码，它们涵盖了所有内容

【参考方案2】：

非常感谢大家，在你们的帮助下我已经解决了我的问题。我想只为可能与我有同样问题的其他人分享我的工作代码。这是工作代码：

public ObservableCollection<BitmapImage> listOfCapturedImages  get;  = 
   new ObservableCollection<BitmapImage>();

private void addNewImageButton_Click(object sender, RoutedEventArgs e)
        
            CameraWindow cw = new CameraWindow(this);
            cw.newlyCapturedImage += (BitmapImage newImage) =>
            
                listOfCapturedImages.Add(newImage);
                newlyAddedImage.Source = newImage;
            ;
            cw.Show();
        

我也加了this.DataContext = this;。

public Test(Window window)
        
            InitializeComponent();
            this.DataContext = this;          
        

最后是 XAML：

<ListView ItemsSource="Binding listOfCapturedImages" Height="345" Margin="577,10,10,0" VerticalAlignment="Top">
        <ListView.ItemsPanel>
            <ItemsPanelTemplate>
                <UniformGrid Columns="1"/>
            </ItemsPanelTemplate>
        </ListView.ItemsPanel>
        <ListView.ItemTemplate>
            <DataTemplate>
                <Image Source="Binding"/>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>

【参考方案3】：

您正在绑定到字段而不是属性。

变化：

public List<BitmapImage> listOfCapturedImages = new List<BitmapImage>();

到

public ObservableCollection<BitmapImage> ListOfCapturedImages get; = new ObservableCollection<BitmapImage>();

ObservableCollection 是通知其内容更改的集合，并且在您向其中添加项目后绑定将更新。 List 不会那样做。

还包括一些Image显示项：

<ListView ItemsSource="Binding ListOfCapturedImages" >
    <ListView.ItemTemplate>
        <DataTemplate>
            <Image Source="Binding"/>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

【讨论】：

好的答案栏你关于图像控制的观点缺乏任何背景

【参考方案4】：

您的DataTemplate 中应该有Image 控件。这就是我正在使用的：

<ListView ItemsSource="Binding listOfCapturedImages" >
     <ListView.ItemsPanel>
        <ItemsPanelTemplate>
            <UniformGrid Columns="1"/>
        </ItemsPanelTemplate>
    </ListView.ItemsPanel>
    <ListView.ItemTemplate>
        <DataTemplate>
            <Image Source="Binding"/>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

【讨论】：

您错过了绑定问题，但遇到了 XAML 问题