列表框和ItemContainerStyle的错误

Question

我有一个简单的列表框

<ListBox Name="GenreListBox" ItemsSource="{Binding}" ItemContainerStyle="{StaticResource ListBoxItemGenreStyle}"          SelectionChanged="GenreListBox_SelectionChanged" ScrollViewer.VerticalScrollBarVisibility="Visible">
  <ListBox.ItemTemplate>
     <DataTemplate >
         <Grid Height="115" Background="Transparent"/>
     </DataTemplate>
  </ListBox.ItemTemplate>
</ListBox>

和ItemContainerStyle（没有VisualStates），例如：

 <Style x:Key="ListBoxItemGenreStyle" TargetType="ListBoxItem">
        <Setter Property="Background" Value="Transparent"/>
        <Setter Property="BorderThickness" Value="0"/>
        <Setter Property="BorderBrush" Value="Transparent"/>
        <Setter Property="Padding" Value="0"/>
        <Setter Property="HorizontalContentAlignment" Value="Left"/>
        <Setter Property="VerticalContentAlignment" Value="Top"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ListBoxItem">
                    <Border x:Name="LayoutRoot" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" HorizontalAlignment="{TemplateBinding HorizontalAlignment}" VerticalAlignment="{TemplateBinding VerticalAlignment}">
                        <Grid x:Name="border">
                            <Image Name="img" Source="{Binding picUrl}" DataContext="{TemplateBinding DataContext}" Width="65" Height="65" VerticalAlignment="Center" HorizontalAlignment="Left" Margin="30,0,0,0" Opacity="0" ImageOpened="Image_ImageOpened"/>
                            <TextBlock Name="title" Text="{Binding title}" DataContext="{TemplateBinding DataContext}" Foreground="Black" FontFamily="Segoe WP SemiLight" FontSize="36" VerticalAlignment="Top" Margin="111,14,0,0"/>
                            <TextBlock Name="artist" Text="{Binding artist}" DataContext="{TemplateBinding DataContext}" Foreground="{StaticResource RedBrush}" FontFamily="Segoe WP" FontSize="21.333" VerticalAlignment="Top" Margin="111,55,0,0"/>
                            <TextBlock Name="price" Text="{Binding price}"  DataContext="{TemplateBinding DataContext}" Foreground="#FF6E6E6E" FontFamily="Segoe WP"   FontSize="20.8" VerticalAlignment="Bottom"  Margin="111,0,0,8" />
                            <ContentControl x:Name="ContentContainer" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
                        </Grid>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

前10个项目看起来很正常，但如果我添加10个新项目，其中一些看起来像第一个项目，如果我在SelectionChanged方法数据中检查数据将是正常的。我的代码出了什么问题？

Here is an example of app that you can build and run 如果我添加10个项目并向下滚动，您将看到最后的项目看起来像第一个，然后您向上滚动然后向下然后所有项目看起来正常。

截图

Answer 1

首先，我不确定这一点，但我猜你是listbox与ObservableCollection Melodies绑定的，所以在你的容器样式中，你正确绑定Melodies类的变量。但是我没理解为什么你在自定义DataContext中为相同的变量绑定ItemContainerStyle，因为你已经绑定了它们？ {Binding <something>}表示绑定{Binding <something>.DataContext}

我的意思是这些tags：

<Image Name="img" Source="{Binding picUrl}" DataContext="{TemplateBinding DataContext}" Width="65" Height="65" VerticalAlignment="Center" HorizontalAlignment="Left" Margin="30,0,0,0" Opacity="0" ImageOpened="Image_ImageOpened"/>
<TextBlock Name="title" Text="{Binding title}" DataContext="{TemplateBinding DataContext}" Foreground="Black" FontFamily="Segoe WP SemiLight" FontSize="36" VerticalAlignment="Top" Margin="111,14,0,0"/>
<TextBlock Name="artist" Text="{Binding artist}" DataContext="{TemplateBinding DataContext}" Foreground="{StaticResource RedBrush}" FontFamily="Segoe WP" FontSize="21.333" VerticalAlignment="Top" Margin="111,55,0,0"/>
<TextBlock Name="price" Text="{Binding price}"  DataContext="{TemplateBinding DataContext}" Foreground="#FF6E6E6E" FontFamily="Segoe WP"   FontSize="20.8" VerticalAlignment="Bottom"  Margin="111,0,0,8" />

所以在这里你绑定他们的源/数据。但你又binding DataContext，Data又是<Image Name="img" Source="{Binding picUrl}" Width="65" Height="65" VerticalAlignment="Center" HorizontalAlignment="Left" Margin="30,0,0,0" Opacity="0" ImageOpened="Image_ImageOpened"/> <TextBlock Name="title" Text="{Binding title}" Foreground="Black" FontFamily="Segoe WP SemiLight" FontSize="36" VerticalAlignment="Top" Margin="111,14,0,0"/> <TextBlock Name="artist" Text="{Binding artist}" Foreground="{StaticResource RedBrush}" FontFamily="Segoe WP" FontSize="21.333" VerticalAlignment="Top" Margin="111,55,0,0"/> <TextBlock Name="price" Text="{Binding price}" Foreground="#FF6E6E6E" FontFamily="Segoe WP" FontSize="20.8" VerticalAlignment="Bottom" Margin="111,0,0,8" /> 。这可能会导致问题。所以改为：

DataContext

我的意思是简单地从这些tags中删除Binding个属性。 再一次，我对此不太确定，但只是尝试一下＆amp;让我知道。在同一标记中包含DataContext和{{1}}对我来说很奇怪。我以前从未这样做过。我可能不对。但你仍然可以试试这个。我希望这将有所帮助。感谢。