我有一个WrapPanel (带有绿色背景)在ListBox (灰色背景)内。
我试图在WrapPanel多次动态添加一个StackPanel (通过点击给定图像下面的按钮)。
StackPanel包含一个Button ,其内容为“X”。 当单击此按钮时,我想要移除各个StackPanel对象(带有橙色背景)。
如何解决?
I have one WrapPanel (with green background) inside of a ListBox(with gray background).
I am trying to dynamically add a StackPanel multiple times (by clicking on the button below given image) in the WrapPanel.
The StackPanel contains a Button which has Content “X”. I want to remove individual StackPanel objects (with orange background) when this button is clicked.
How can it be worked out?
最满意答案
数据绑定和数据模板 + 指挥
你的问题很广泛。 基本概述是创建可绑定集合,为它们创建数据模板,并使用命令或事件从其中删除单击的项目。
使用内部使用WrapPanel进行布局的ItemsControl的DataTemplating示例:
<ItemsControl ItemsSource="{Binding DpData}"> <ItemsControl.ItemsPanel> <ItemsPanelTemplate> <WrapPanel /> </ItemsPanelTemplate> </ItemsControl.ItemsPanel> <ItemsControl.ItemTemplate> <DataTemplate> <Grid> <!-- The content goes here, X-Button will be overlayed --> <Button HorizontalAlignment="Right" VerticalAlignment="Top" Content="X" Click="RemoveItem_Click"/> </Grid> </DataTemplate> </ItemsControl.ItemTemplate> </ItemsControl> // Does not need to be a dependency property. public static readonly DependencyProperty DpDataProperty = DependencyProperty.Register("DpData", typeof(ObservableCollection<Employee>), typeof(MainWindow), new UIPropertyMetadata(new ObservableCollection<Employee>())); public ObservableCollection<Employee> DpData { get { return (ObservableCollection<Employee>)GetValue(DpDataProperty); } set { SetValue(DpDataProperty, value); } } // For simplicity i use an event instead of a command. private void RemoveItem_Click(object sender, RoutedEventArgs e) { var button = (FrameworkElement)sender; var emp = (Employee)button.DataContext; DpData.Remove(emp); }如果你这样做,你当然不应该在添加按钮点击时添加一个面板,而是向该集合添加一个数据项。 面板将自动生成。
Data Binding & Data Templating + Commanding
Your question is kind of extensive. The basic outline is to create bindable collections, data template them, and remove the clicked item from it using a command or event.
Example of DataTemplating using an ItemsControl that internally uses a WrapPanel for the layout:
<ItemsControl ItemsSource="{Binding DpData}"> <ItemsControl.ItemsPanel> <ItemsPanelTemplate> <WrapPanel /> </ItemsPanelTemplate> </ItemsControl.ItemsPanel> <ItemsControl.ItemTemplate> <DataTemplate> <Grid> <!-- The content goes here, X-Button will be overlayed --> <Button HorizontalAlignment="Right" VerticalAlignment="Top" Content="X" Click="RemoveItem_Click"/> </Grid> </DataTemplate> </ItemsControl.ItemTemplate> </ItemsControl> // Does not need to be a dependency property. public static readonly DependencyProperty DpDataProperty = DependencyProperty.Register("DpData", typeof(ObservableCollection<Employee>), typeof(MainWindow), new UIPropertyMetadata(new ObservableCollection<Employee>())); public ObservableCollection<Employee> DpData { get { return (ObservableCollection<Employee>)GetValue(DpDataProperty); } set { SetValue(DpDataProperty, value); } } // For simplicity i use an event instead of a command. private void RemoveItem_Click(object sender, RoutedEventArgs e) { var button = (FrameworkElement)sender; var emp = (Employee)button.DataContext; DpData.Remove(emp); }If you do it like this you should of course not add a panel upon add-button click but a data item to the collection. The panel will be generated automatically.
更多推荐
发布评论