通过WPF自定义ListBox控件实现ListBoxItem中开关及删除功能

最新推荐文章于 2025-06-13 16:10:25 发布
最新推荐文章于 2025-06-13 16:10:25 发布
阅读量2k 收藏 7
点赞数 1
CC 4.0 BY-SA版权
分类专栏： WPF 文章标签： wpf
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_42296146/article/details/120520069

通过WPF自定义ListBox控件实现类似CAD图层关闭与删除功能

文章目录

前言

提示：这里可以添加本文要记录的大概内容：
例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的基础内容。

提示：以下是本篇文章正文内容，下面案例可供参考

一、程序界面设计

ListBox控件设计如下所示，主要用到了TabControl、ListBox以及Button控件。
在这里插入图片描述

二、代码部分

2.1前端代码

<Window
    x:Class="ListBoxDemo.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:local="clr-namespace:ListBoxDemo"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    Title="MainWindow"
    Width="200"
    Height="450"
    mc:Ignorable="d">
    <Window.Resources>
        <Style x:Key="FocusVisual">
            <Setter Property="Control.Template">
                <Setter.Value>
                    <ControlTemplate>
                        <Rectangle
                            Margin="2"
                            SnapsToDevicePixels="true"
                            Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"
                            StrokeDashArray="1 2"
                            StrokeThickness="1" />
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <SolidColorBrush x:Key="Item.MouseOver.Background" Color="#1F26A0DA" />
        <SolidColorBrush x:Key="Item.MouseOver.Border" Color="#a826A0Da" />
        <SolidColorBrush x:Key="Item.SelectedInactive.Background" Color="#3DDADADA" />
        <SolidColorBrush x:Key="Item.SelectedInactive.Border" Color="#FFDADADA" />
        <SolidColorBrush x:Key="Item.SelectedActive.Background" Color="#3D26A0DA" />
        <SolidColorBrush x:Key="Item.SelectedActive.Border" Color="#FF26A0DA" />
        <Style x:Key="ListBoxItemStyle1" TargetType="{x:Type ListBoxItem}">
            <Setter Property="SnapsToDevicePixels" Value="True" />
            <Setter Property="Padding" Value="1,0" />
            <Setter Property="HorizontalContentAlignment" Value="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}" />
            <Setter Property="VerticalContentAlignment" Value="{Binding VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}" />
            <Setter Property="Background" Value="Transparent" />
            <Setter Property="BorderBrush" Value="Transparent" />
            <Setter Property="BorderThickness" Value="0" />
            <Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisual}" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type ListBoxItem}">
                        <Border
                            x:Name="Bd"
                            Grid.Column="1"
                            Padding="{TemplateBinding Padding}"
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            SnapsToDevicePixels="true">
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="30" />
                                    <ColumnDefinition Width="1" />
                                    <ColumnDefinition Width="*" />
                                    <ColumnDefinition Width="1" />
                                    <ColumnDefinition Width="30" />
                                </Grid.ColumnDefinitions>
                                <Button
                                    x:Name="btn_DisplaySwitch"
                                    Grid.Column="0"
                                    Background="Transparent"
                                    BorderBrush="Transparent"
                                    Click="Btn_DisplaySwitch"
                                    Content="O"
                                    Foreground="Black" />
                                <TextBlock Grid.Column="1" Background="Gray" />
                                <ContentPresenter
                                    Grid.Column="2"
                                    Margin="10,0,0,0"
                                    HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                    VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                    SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
                                <TextBlock Grid.Column="3" Background="Gray" />
                                <Button
                                    x:Name="btn_DeleteLayer"
                                    Grid.Column="4"
                                    Background="Transparent"
                                    BorderBrush="Transparent"
                                    Click="Btn_DeleteLayer_Click"
                                    Content="X" />
                            </Grid>
                        </Border>
                        <ControlTemplate.Triggers>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="IsMouseOver" Value="True" />
                                </MultiTrigger.Conditions>
                                <Setter TargetName="Bd" Property="Background" Value="{StaticResource Item.MouseOver.Background}" />
                                <Setter TargetName="Bd" Property="BorderBrush" Value="{StaticResource Item.MouseOver.Border}" />
                            </MultiTrigger>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="Selector.IsSelectionActive" Value="False" />
                                    <Condition Property="IsSelected" Value="True" />
                                </MultiTrigger.Conditions>
                                <Setter TargetName="Bd" Property="Background" Value="{StaticResource Item.SelectedInactive.Background}" />
                                <Setter TargetName="Bd" Property="BorderBrush" Value="{StaticResource Item.SelectedInactive.Border}" />
                            </MultiTrigger>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="Selector.IsSelectionActive" Value="True" />
                                    <Condition Property="IsSelected" Value="True" />
                                </MultiTrigger.Conditions>
                                <Setter TargetName="Bd" Property="Background" Value="{StaticResource Item.SelectedActive.Background}" />
                                <Setter TargetName="Bd" Property="BorderBrush" Value="{StaticResource Item.SelectedActive.Border}" />
                            </MultiTrigger>
                            <Trigger Property="IsEnabled" Value="False">
                                <Setter TargetName="Bd" Property="TextElement.Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <SolidColorBrush x:Key="ListBox.Static.Background" Color="#FFFFFFFF" />
        <SolidColorBrush x:Key="ListBox.Static.Border" Color="#FFABADB3" />
        <SolidColorBrush x:Key="ListBox.Disabled.Background" Color="#FFFFFFFF" />
        <SolidColorBrush x:Key="ListBox.Disabled.Border" Color="#FFD9D9D9" />
        <Style x:Key="ListBoxStyle1" TargetType="{x:Type ListBox}">
            <Setter Property="Background" Value="{StaticResource ListBox.Static.Background}" />
            <Setter Property="BorderBrush" Value="{StaticResource ListBox.Static.Border}" />
            <Setter Property="BorderThickness" Value="1" />
            <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" />
            <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
            <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
            <Setter Property="ScrollViewer.CanContentScroll" Value="true" />
            <Setter Property="ScrollViewer.PanningMode" Value="Both" />
            <Setter Property="Stylus.IsFlicksEnabled" Value="False" />
            <Setter Property="VerticalContentAlignment" Value="Center" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type ListBox}">
                        <Border
                            x:Name="Bd"
                            Padding="1"
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            SnapsToDevicePixels="true">
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="31" />
                                    <ColumnDefinition Width="1" />
                                    <ColumnDefinition Width="*" />
                                    <ColumnDefinition Width="1" />
                                    <ColumnDefinition Width="31" />
                                </Grid.ColumnDefinitions>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="20" />
                                    <RowDefinition Height="1" />
                                    <RowDefinition Height="*" />
                                </Grid.RowDefinitions>
                                <TextBlock
                                    Grid.Row="0"
                                    Grid.Column="0"
                                    HorizontalAlignment="Center"
                                    VerticalAlignment="Center"
                                    Text="显示" />
                                <TextBlock
                                    Grid.Row="0"
                                    Grid.Column="1"
                                    Background="Gray" />
                                <TextBlock
                                    Grid.Row="0"
                                    Grid.Column="2"
                                    HorizontalAlignment="Center"
                                    VerticalAlignment="Center"
                                    Text="图层名称" />
                                <TextBlock
                                    Grid.Row="0"
                                    Grid.Column="3"
                                    Background="Gray" />
                                <TextBlock
                                    Grid.Row="0"
                                    Grid.Column="4"
                                    HorizontalAlignment="Center"
                                    VerticalAlignment="Center"
                                    Text="删除" />
                                <TextBlock
                                    Grid.Row="1"
                                    Grid.ColumnSpan="5"
                                    Background="Gray" />
                                <ScrollViewer
                                    Grid.Row="2"
                                    Grid.ColumnSpan="5"
                                    Padding="{TemplateBinding Padding}"
                                    Focusable="false"
                                    HorizontalScrollBarVisibility="Hidden"
                                    VerticalScrollBarVisibility="Hidden">
                                    <ItemsPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
                                </ScrollViewer>
                            </Grid>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsEnabled" Value="false">
                                <Setter TargetName="Bd" Property="Background" Value="{StaticResource ListBox.Disabled.Background}" />
                                <Setter TargetName="Bd" Property="BorderBrush" Value="{StaticResource ListBox.Disabled.Border}" />
                            </Trigger>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="IsGrouping" Value="true" />
                                    <Condition Property="VirtualizingPanel.IsVirtualizingWhenGrouping" Value="false" />
                                </MultiTrigger.Conditions>
                                <Setter Property="ScrollViewer.CanContentScroll" Value="false" />
                            </MultiTrigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>
    <StackPanel>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="*"/>
                <RowDefinition Height="25"/>
                <RowDefinition Height="25"/>
                <RowDefinition Height="25"/>
                <RowDefinition Height="25"/>
            </Grid.RowDefinitions>
            <TabControl x:Name="tabCtr" Grid.Row="0" >
                <TabItem Name="tab_Column" Width="30" Header="柱" IsSelected="True">
                    <ListBox
                            Name="lbox_Column"                            
                            BorderBrush="Gray"
                            Style="{DynamicResource ListBoxStyle1}">
                        <ListBoxItem Style="{DynamicResource ListBoxItemStyle1}">1</ListBoxItem>
                        <ListBoxItem Style="{DynamicResource ListBoxItemStyle1}">1</ListBoxItem>
                        <ListBoxItem Style="{DynamicResource ListBoxItemStyle1}">1</ListBoxItem>
                    </ListBox>
                </TabItem>
                <TabItem Name="tab_Bean" Width="30" Header="梁">
                    <ListBox
                            Name="lbox_Bean"                            
                            BorderBrush="Gray"
                            Style="{DynamicResource ListBoxStyle1}">
                        <ListBoxItem Style="{DynamicResource ListBoxItemStyle1}">1</ListBoxItem>
                        <ListBoxItem Style="{DynamicResource ListBoxItemStyle1}">1</ListBoxItem>
                        <ListBoxItem Style="{DynamicResource ListBoxItemStyle1}">1</ListBoxItem>
                    </ListBox>
                </TabItem>
                <TabItem Name="tab_Wall" Width="30" Header="墙" IsSelected="True">
                    <ListBox
                            Name="lbox_Wall"                            
                            BorderBrush="Gray"
                            Style="{DynamicResource ListBoxStyle1}">
                        <ListBoxItem Style="{DynamicResource ListBoxItemStyle1}">1</ListBoxItem>
                        <ListBoxItem Style="{DynamicResource ListBoxItemStyle1}">1</ListBoxItem>
                        <ListBoxItem Style="{DynamicResource ListBoxItemStyle1}">1</ListBoxItem>
                    </ListBox>
                </TabItem>
                <TabItem Name="tab_Palte" Width="30" Header="板" IsSelected="True">
                    <ListBox
                            Name="lbox_Plate"                            
                            BorderBrush="Gray"
                            Style="{DynamicResource ListBoxStyle1}">
                        <ListBoxItem Style="{DynamicResource ListBoxItemStyle1}">1</ListBoxItem>
                        <ListBoxItem Style="{DynamicResource ListBoxItemStyle1}">1</ListBoxItem>
                        <ListBoxItem Style="{DynamicResource ListBoxItemStyle1}">1</ListBoxItem>
                    </ListBox>
                </TabItem>
            </TabControl>
            <Button Grid.Row="1" 
                            Name="btn_AddLayer"                            
                            Click="Btn_AddLayer"
                            Content="添加图层" />            
        </Grid>
    </StackPanel>
</Window>

2.2后台代码

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
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;

namespace ListBoxDemo
{
    /// <summary>
    /// MainWindow.xaml 的交互逻辑
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }
        
        private void Btn_DeleteLayer_Click(object sender, RoutedEventArgs e)
        {
            ListBoxItem item = (sender as Button).TemplatedParent as ListBoxItem;
            this.lbox_Bean.Items.Remove(item);
            //foreach (var item in this.lbox_Bean.Items)
            //{                
            //    str += ((ListBoxItem)item).Content.ToString()+"\n";
            //}
            //MessageBox.Show(str);
        }
        int count = 0;
        private void Btn_AddLayer(object sender, RoutedEventArgs e)
        {
            ++count;
            string str = count.ToString();
            //TabItem tabItem = this.tabCtr.SelectedItem as TabItem;
            //ListBox lbox=tabItem.Content as ListBox;
            ListBox lbox = this.tabCtr.SelectedContent as ListBox;
            ListBoxItem item = new ListBoxItem();
            item.Content = str;
            item.Style = ((ListBoxItem)(lbox.Items[0])).Style;
            lbox.Items.Add(item);            
        }

        private void Btn_DisplaySwitch(object sender, RoutedEventArgs e)
        {
            ListBoxItem item = (sender as Button).TemplatedParent as ListBoxItem;
            string layerName = item.Content.ToString();
            if ((sender as Button).Content.ToString()=="O")
            {
                (sender as Button).Content = "▫";
                (sender as Button).Foreground = Brushes.Gray;
            }
            else
            {
                (sender as Button).Content = "O";
                (sender as Button).Foreground = Brushes.Black;
            }
        }
    }
}

总结

主要是通过控件模板来改变ListBox样式，实现类似AutoCad图层开关及删除的效果。

C# WPF 中的 ListBox 控件：从基础到高级应用 28
Code365
04-03 196
ListBox 是一个用于显示项目列表的控件，它继承自，这意味着它可以包含多个子项。用户可以通过鼠标点击或键盘操作来选择列表中的项目，支持单选和多选模式。在某些情况下，为了满足特定的设计需求，需要自定义 ListBox 的外观和行为。WPF 提供了丰富的样式和模板机制，允许开发者对 ListBox 进行深度定制。通过本文的详细介绍，我们全面了解了 C# WPF 中 ListBox 控件的基础使用、实战开发经验、性能优化方法和高级用法。
wpf listbox 如何删除单个元素_如何利用一个支持元素删除的布隆过滤器，来解决缓存穿透问题？...
weixin_29830833的博客
01-15 441
前言在我们日常开发中，Redis使用场景最多的就是作为缓存和分布式锁等功能来使用，而其用作缓存最大的目的就是为了降低数据库访问。但是假如我们某些数据并不存在于Redis当中，那么请求还是会直接到达数据库，而一旦在同一时间大量缓存失效或者一个不存在缓存的请求被恶意访问，这些都会导致数据库压力骤增，这就是本文要讲述的缓存穿透，缓存击穿和缓存雪崩的问题，而布隆过滤器正是缓存穿透的一种解决方案。缓存雪崩缓...
WPF中的自定义ListBox（一）
weixin_33735077的博客
12-07 337
上周侯捷大师来京做了一次讲座，有幸和他聊聊。当别人排队，而我也在排队。有意思的是当别人在找侯捷大师签名时，而我确有幸为侯捷大师签了一次名，当然是在我的《葵花宝典——WPF自学手册》上签下了自己难看的名字。这不是重点，重点是他提到他的人生中几件关键的事情。其中一件，如果我的记忆没有错的话，应该是Windows 3.0来的时候的冲击，他当时还在一个台湾的研究所里工作，在考虑窗口，控件如何“Messag...
WPF之ListBox
最新发布
Major_S的博客
06-13 752
通过。
WPF 自定义ListBox
weixin_33878457的博客
08-17 451
如题，要实现一个如下的列表，该如何实现？ 在设计过程中，会遇到如下问题： 1、ListBox中ListBoxItem的模板设计 2、ListBox中ListBoxItem的模板容器设计 3、ListBox本身的模板设计 4、ListBox本身的焦点样式 下面我们依次来解决这些问题： 1、子模板 <ListBox.ItemTemplate&g...
WPF自定义ListBox（二）
weixin_34072857的博客
12-09 212
Helloj2ee的自定义ListBox（一），虽然很用心，但看出来反响不强烈。只能这一篇再给力一点。虽然评论很少，但是也看出一些讯息。 讯息之一，就是Helloj2ee的WPF看不懂。的确在这里写的不是基本的东西，而是对其WPF的相关基础概念掌握了之后，才能看的一个系列。自定义控件在《葵花宝典——WPF自学手册》一书中，是放到第六卷——华山之巅，足见其高阶。因此Helloj2ee在后面列出的参...
WPF开发为按钮提供添加，删除和重新排列ListBox内容的功能
weixin_30950887的博客
03-04 591
介绍 我有一种情况，我希望能够将项目添加到列表中，并在列表中移动项目，这似乎是使用a的最简单方法ListBox。我立刻想到了如何以通用的方式做到这一点，然后，也许，可以使用行为来做到这一点。这似乎是一个非常有用的想法。我决定以一种简单的方式为我正在开发的应用程序做这件事，但我想我会创建一个演示项目来探索这个想法。这是结果。 概观 该行为实际上有四个独立的部分，可以在一个类中执行不同的功能： ...
WPF之ListBox控件详解
05-09
在WPF中，ListBox控件被广泛用于实现列表的选择功能，它可以处理简单到复杂的界面需求。 2.ListBox控件的XAML声明方式：在WPF中，ListBox可以通过XAML进行声明，XAML代码可以详细描述ListBox控件的结构和样式。通常...
【WPF应用30】WPF中的ListBox控件详解
qq_35320456的博客
04-03 9646
WPF中的ListBox控件详解
自定义WPF ListBox，在代码中具有带状和着色
04-06
在Windows Presentation Foundation (WPF) 中，`ListBox`是一个常用控件，用于显示一系列可选择的项目。然而，为了满足特定的设计需求或视觉效果，有时我们需要对其进行自定义。本话题将深入探讨如何在代码中创建一...
WPF中ListBox控件的鼠标拖动实现多选功能
通过标题“ListBox 鼠标拖动多选”和描述“WPF ListBox控件拖动Demo，利用鼠标拖动ListBox实现多选”，我们可以推断出该Demo演示了如何通过鼠标操作实现ListBox中多个项目的选择功能。 在进一步详细说明该知识点...
如何在WPF中自定义ListBox的外观 4-4
10-31
Todd Miranda演示过如何使用模板来自定义ListBox中ListItem的外观，这次他演示了如何自定义ListBox本身的外观。体验一下横向ListItem的感觉吧。
如何在WPF中自定义ListBox的外观 4-1
10-31
Todd Miranda演示过如何使用模板来自定义ListBox中ListItem的外观，这次他演示了如何自定义ListBox本身的外观。体验一下横向ListItem的感觉吧。
如何在WPF中自定义ListBox的ListItem的外观 4-3
10-28
WPF引入了“无外观控件”的概念。现在开发人员可以基于功能而不是外观来选择控件。外观可以自定义以满足开发人员的需要。Todd Miranda演示了如何使用模板来自定义ListBox中ListItem的外观。
如何在WPF中自定义ListBox的ListItem的外观 4-4
10-28
WPF引入了“无外观控件”的概念。现在开发人员可以基于功能而不是外观来选择控件。外观可以自定义以满足开发人员的需要。Todd Miranda演示了如何使用模板来自定义ListBox中ListItem的外观。
WPF中ListBox的自定义模板
qq_37189288的博客
12-16 1392
<SolidColorBrush x:Key="ListBox.Static.Background" Color="#FFFFFFFF"/> <SolidColorBrush x:Key="ListBox.Static.Border" Color="#FFABADB3"/> <SolidColorBrush x:Key="ListBox.Disabled.Background" Color="#FFFFFFFF"/> &..
wpf 自定义ListBox
weixin_30421525的博客
12-15 179
ListBox的样式比较简单，包括两部分： ListBoxItem项的样式； ListBox的样式； 完整代码： <Style x:Key="DefaultListBoxItem" TargetType="{x:Type ListBoxItem}"> <Setter Property="Foreground" Value=...
WPF：自定义ListBox的选择样式
weixin_30782293的博客
01-14 182
首先介绍一种简单地方法：就是通过自定义SystemColors类的参数来自定义WPF ListBox选择颜色的， SystemColors的HighlightBrushKey和HighlightTextBrushKey分别代表ListBoxItem被选中时文字和背景颜色， 没有Highlight的BrushKey代表ListBox没有焦点时的选中项文字和背景颜色，如下示例代码： <Li...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值