Reputation: 4546
I have a UserControl which I need to keep adding to a StackPanel during runtime (per User's action). I want a close button (a small 'x') on the right side top corner for each item in StackPanel.
I could do this: add my UserControl to some Panel which has the 'x' button that glows on mouse hover, which when clicked deletes the item from the StackPanel.
However, I am looking for a better solution to this problem. Like is there any control out there which offers a similar functionality?
I was looking for TileView. All I need is a single row of Tiles which keep added per users input, and have the ability to delete a "Tile". Each tile would contain my UserControl.
Please let me know,
Upvotes: 0
Views: 144
Reputation: 7449
You can do this easily with the ItemsControl. Think of it like a ListBox without the selection. Just modify it a little:
<ItemsControl HorizontalAlignment="Center" VerticalAlignment="Center">
<ItemsControl.ItemTemplate>
<DataTemplate>
<Border Padding="4" Background="CornflowerBlue">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition/>
</Grid.RowDefinitions>
<Button Content="Close" HorizontalAlignment="Right"/>
<Grid Margin="4" Grid.Row="1">
<!-- put your usercontrol here -->
</Grid>
</Grid>
</Border>
</DataTemplate>
</ItemsControl.ItemTemplate>
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal"/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ItemsControl>
Upvotes: 0
Reputation: 6330
you can use tileview, but Grid can work here too, you can add you usercontrol to a cell and on other cell you can give a close button and on the close button click you can remove that row from the grid ,
if you are going to add more than one usercontrol than Grid can be easily maintain.
Upvotes: 1