In wpf, when I press button it closes all stackpanels. I need to close the specific stackpanel when button is pressed

Question

As I said in title, I need to close the button interacted stackpanel item when close button is pressed. But I'm new in wpf and can't understand how to bind stackpanel or button with specific stackpanel item. Can you please help me ?

`<DataTemplate x:Key="fixTemplate">
    <Grid Background="Transparent" VerticalAlignment="Center" HorizontalAlignment="Center">
        <StackPanel  x:Name="fixPanel" MouseWheel="StackPanel_MouseWheel">
            <Border BorderThickness="1" CornerRadius="10" Opacity="1.0" Background="{dxi:ThemeResource {dxmt:MapBrushesThemeKey ResourceKey=OverlayBackground}}">
                <StackPanel Orientation="Vertical" Margin="8">
                    <Button x:Name="fixButton" Uid="0++" CommandParameter="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type StackPanel}}}" Content="X" Background="Red" Width="25" Height="25" HorizontalAlignment="Right" Click="fixButton_Click"/>
                    <TextBlock x:Name="fixText" Text="{Binding ToolTipText}" Foreground="{dxi:ThemeResource {dxmt:MapBrushesThemeKey ResourceKey=OverlayElementForeground}}"  TextWrapping="Wrap"/>
                </StackPanel>
            </Border>
            <Path Stretch="Fill" 
              Data="m 66.709675,141.93548 29.096774,-33 27.677421,33.35484 -18.80645,-0.35484 0.70968,43.29032 H 87.64516 l -0.709676,-43.29032 z"
              HorizontalAlignment="Center"
              Height="15"
              Width="20"
              UseLayoutRounding="False"
              VerticalAlignment="Center"
              Stroke="#BF000000" 
              StrokeThickness="0.4"
              Margin="-13 0 0 0" >
                <Path.Effect>
                    <DropShadowEffect ShadowDepth="2" BlurRadius="7" Opacity="0.5"/>
                </Path.Effect>
                <Path.Fill>
                    <RadialGradientBrush>
                        <GradientStop Color="Black" Offset="1." />
                    </RadialGradientBrush>
                </Path.Fill>
            </Path>
        </StackPanel>                
    </Grid>
</DataTemplate>`

As you see I have a button and dynamically created stackpanels. How can I delete the stackpanel that it's button is clicked ?

I tried to delete stackpanel which is under it's delete button but every stackpanel is deleted in my code. I don't know how to specify which stackpanel will deleted when that stackpanel's close button is pressed

Answer 1

I solved this by adding checkbox to stack panel

<Border BorderThickness="1" CornerRadius="10" Opacity="1.0" Background="{dxi:ThemeResource {dxmt:MapBrushesThemeKey ResourceKey=OverlayBackground}}">
   <StackPanel Orientation="Vertical" Margin="8">
       <CheckBox x:Name="MyCheckBox" IsChecked="True" HorizontalAlignment="Left"/>
       <TextBlock Text="{Binding ToolTipText}" Visibility="{Binding IsChecked, ElementName=MyCheckBox, Converter={dxmvvm:BooleanToVisibilityConverter}}" Foreground="{dxi:ThemeResource {dxmt:MapBrushesThemeKey ResourceKey=OverlayElementForeground}}"  TextWrapping="Wrap"/>
   </StackPanel>
</Border>

and this code in model view

public class BoolToVisibilityConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        var isChecked = (bool)value;
        return isChecked ? Visibility.Visible : Visibility.Collapsed;
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}