Issues in Expander and ListBox nesting in WPF (ItemsControl)

1. When the listbox is placed in the expander, in order to achieve the effect of real-time updating the data, we use the

ObservableCollection type as the data source,

The initial simple example is as follows: only one listbox

XAML file

1 <Windowx:class= "Observablecollectionaddremovedemo.mainwindow"2 xmlns= "Http://schemas.microsoft.com/winfx/2006/xaml/presentation"3 xmlns:x= "Http://schemas.microsoft.com/winfx/2006/xaml"4 Title= "MainWindow"Height= " the"Width= "525">5     <Grid>6         <ListBoxBorderBrush= "Red"borderthickness= "2"HorizontalAlignment= "Left"Height= "Auto"Margin= "37,32,0,0"VerticalAlignment= "Top"Width= "157"ItemsSource="{Binding}">7             <Listbox.itemcontainerstyle>8                 <StyleTargetType= "ListBoxItem" >9                     <Setter Property= "Opacity"Value= "0.5" />Ten                     <Setter Property= "Opacity"Value= "0.5" /> One                     <Setter Property= "MaxHeight"Value= " the" /> A                     <Setter Property= "Background"Value= "Green"/> -                     <style.triggers> -                         <Trigger Property= "IsSelected"Value= "True"> the                             <Setter Property= "Opacity"Value= "1.0" /> -                         </Trigger> -                     </style.triggers> -                 </Style> +             </Listbox.itemcontainerstyle> -         </ListBox> +         <ItemsControlHorizontalAlignment= "Left"Height= "Auto"Margin= "210,32,0,0"VerticalAlignment= "Top"Width= "157"ItemsSource="{Binding}"> A             <Itemscontrol.itemcontainerstyle> at                 <StyleTargetType= "ContentPresenter"> -                     <Setter Property= "Opacity"Value= "0.5" /> -                     <Setter Property= "Opacity"Value= "0.5" /> -                     <Setter Property= "MaxHeight"Value= " the" /> -                 </Style> -             </Itemscontrol.itemcontainerstyle> in         </ItemsControl> -         <ButtonContent= "Add"HorizontalAlignment= "Left"Margin= "398,65,0,0"VerticalAlignment= "Top"Width= " the"Click= "Button_Click"/> to         <ButtonContent= "Remove"HorizontalAlignment= "Left"Margin= "398,160,0,0"VerticalAlignment= "Top"Width= " the"Click= "Button_click_remove"/> +  -     </Grid> the </Window>

View Code

Background files

1 usingSystem;2 usingSystem.Collections.Generic;3 usingSystem.Collections.ObjectModel;4 usingSystem.Linq;5 usingSystem.Text;6 usingSystem.Threading.Tasks;7 usingSystem.Windows;8 usingSystem.Windows.Controls;9 usingSystem.Windows.Data;Ten usingSystem.Windows.Documents; One usingSystem.Windows.Input; A usingSystem.Windows.Media; - usingSystem.Windows.Media.Imaging; - usingSystem.Windows.Navigation; the usingSystem.Windows.Shapes; -  - namespaceObservablecollectionaddremovedemo - { +     /// <summary> -     ///Interaction logic for MainWindow.xaml +     /// </summary> A      Public Partial classMainwindow:window at     { -          PublicObservablecollection<string>list; -         //Public list<string> List; -          PublicMainWindow () -         { - InitializeComponent (); inList =Newobservablecollection<string> () {"Asda","12asdas","a22321","asda112323","XCVCVCXV","AASDA","123123","ASDASDASD"}; -              This. DataContext =list; to         } +  -         Private voidButton_Click (Objectsender, RoutedEventArgs e) the         { *             intAddnumber =NewRandom (). Next (999); $ list. ADD (Addnumber.tostring ());Panax Notoginseng         } -  the  +         Private voidButton_click_remove (Objectsender, RoutedEventArgs e) A         { the             if(list. Count >0) +List. RemoveAt (0); -         } $     } $}

View Code

Discover the code implementation is smooth, both additions and deletions can be in real-time response to the interface

2. But when a expander is set up outside the listbox, the problem arises, such as:

In the deletion of data, the content is significantly less, but the deletion of the content of the location is still retained in the interface!!!

The solution is to set a stackpanel outside the ContentPresenter of Expander, as follows:

1  < StackPanel > 2          <  x:name= "Expandercontent"  ContentSource= "Content"/>  3</StackPanel>

View Code

===========================================

A similar problem may occur when Expander is placed in a ListBox: Https://www.dotblogs.com.tw/ouch1978/archive/2011/03/11/wpf-expander-in-listbox.aspx

Issues in Expander and ListBox nesting in WPF (ItemsControl)