我在WrapPanel
(灰色背景)中有一个ListBox
(绿色背景)。
我正在尝试在StackPanel
中多次动态添加WrapPanel
(通过点击给定图片下方的按钮)。
StackPanel
包含内容为“X”的Button
。我想在单击此按钮时删除单个StackPanel
个对象(橙色背景)。
如何制定出来?
答案 0 :(得分:6)
Data Binding& Data Templating + Commanding
你的问题很广泛。基本大纲是创建可绑定集合,数据模板,并使用命令或事件从中删除单击的项目。
使用在内部使用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);
}
如果你这样做,你当然不应该在添加按钮点击时添加一个面板,而是添加一个数据项到该集合。该面板将自动生成。
答案 1 :(得分:0)
这是最终的代码..........
<强> MainWindow.xaml 强>
<Window.Resources>
<DataTemplate x:Key="itemsTemplate">
<!-- This might also be included in a UserControl -->
<Border Width="200" Height="200" CornerRadius="10,10,10,10" Margin="4,4,0,0" Padding="4,4,4,4">
<Border.Background>
<LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
<GradientStop Color="AliceBlue" Offset="0"/>
<GradientStop Color="Bisque" Offset="1"/>
</LinearGradientBrush>
</Border.Background>
<Grid >
<Button HorizontalAlignment="Right" VerticalAlignment="Top" Width="30" Height="20" Content="X" Background="Red" Click="Remove_Click"></Button>
<WrapPanel Orientation="Vertical">
<TextBox Text="{Binding Name}" Margin="10,10" Height="20" ></TextBox>
<TextBox Text="{Binding City}" Margin="10,10" Height="20" ></TextBox>
<TextBox Text="{Binding Age}" Margin="10,10" Height="20"></TextBox>
<TextBox Text="{Binding Count}" Margin="10,10" Height="20" ></TextBox>
</WrapPanel>
</Grid>
</Border>
</DataTemplate>
</Window.Resources>
<Grid>
<ItemsControl
Width="Auto"
Height="Auto"
ItemsSource="{Binding ElementName=mainWindow, Path=EmployeeCollection}"
ItemTemplate="{StaticResource itemsTemplate}" Background="Aqua">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel Orientation="Vertical" />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ItemsControl>
<Button Content="Add" Height="23" HorizontalAlignment="Left" Margin="487,287,0,0" Name="button1" VerticalAlignment="Top" Width="75" Click="Add_Click" />
</Grid>
的 MainWindow.xaml.cs 强>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
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.Navigation;
using System.Windows.Shapes;
using System.Collections.ObjectModel;
namespace DynamicAddRemovePanel
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
public ObservableCollection<Employee> employeeCollection = new ObservableCollection<Employee>();
public ObservableCollection<Employee> EmployeeCollection
{
get
{
return this.employeeCollection;
}
set
{
this.employeeCollection = value;
}
}
public MainWindow()
{
InitializeComponent();
}
public class Employee
{
public string Name { get; set; }
public string City { get; set; }
public int Age { get; set; }
public static int Count { get; set; }
public Employee()
{
Count++;
}
public Employee(string nameArg, string cityArg, int ageArg)
{
this.Name = nameArg;
this.City = cityArg;
this.Age = ageArg;
Count++;
}
}
private void Add_Click(object sender, RoutedEventArgs e)
{
employeeCollection.Add(new Employee("Pritesh","Abad",22));
}
private void Remove_Click(object sender, RoutedEventArgs e)
{
var emp = (sender as FrameworkElement).DataContext as Employee;
employeeCollection.Remove(emp);
}
}
}