wpf 实现QQ分组效果 代码简单

最新推荐文章于 2024-10-04 14:29:22 发布
最新推荐文章于 2024-10-04 14:29:22 发布
阅读量887 收藏 1
点赞数
分类专栏： WPF 文章标签： QQ分组
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Vblegend_2013/article/details/86509502
版权

效果

wpf XMAL 重要的是样式

<Window x:Class="TestWPF.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:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:TestWPF"
        mc:Ignorable="d"
        Background="#d3dee8"
        Title="MainWindow" Height="450" Width="206">
    <Window.Resources>
        <Style x:Key="ExpanderDownHeaderStyle" TargetType="{x:Type ToggleButton}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type ToggleButton}">
                        <Border Padding="{TemplateBinding Padding}">
                            <Grid x:Name="bk" Background="Transparent" Height="35" SnapsToDevicePixels="False">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="35"/>
                                    <ColumnDefinition Width="*"/>
                                </Grid.ColumnDefinitions>
                                <Path x:Name="arrow" Data="M 3,3 L 8,8 L 3,13" 
                                      HorizontalAlignment="Center" SnapsToDevicePixels="false" Stroke="DarkGray" 
                                      StrokeThickness="2" VerticalAlignment="Center"/>
                                <ContentPresenter Grid.Column="1" HorizontalAlignment="Left" Margin="4,0,0,0" RecognizesAccessKey="True" SnapsToDevicePixels="True" VerticalAlignment="Center"/>
                            </Grid>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsChecked" Value="true">
                                <Setter Property="Data" TargetName="arrow" Value="M 3,3  L 8,8  L 13,3"/>
                            </Trigger>
                            <Trigger Property="IsMouseOver" Value="true">
                                <Setter Property="Background" TargetName="bk" Value="#20333333"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Style x:Key="ExpanderStyle1" TargetType="{x:Type Expander}">
            <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
            <Setter Property="Background" Value="Transparent"/>
            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
            <Setter Property="VerticalContentAlignment" Value="Stretch"/>
            <Setter Property="BorderBrush" Value="Transparent"/>
            <Setter Property="BorderThickness" Value="1"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Expander}">
                        <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" CornerRadius="3" SnapsToDevicePixels="true">
                            <DockPanel>
                                <ToggleButton x:Name="HeaderSite" ContentTemplate="{TemplateBinding HeaderTemplate}" 
                                              ContentTemplateSelector="{TemplateBinding HeaderTemplateSelector}" 
                                              DockPanel.Dock="Top" 
                                              Content="{TemplateBinding Header}" 
                                              Foreground="{TemplateBinding Foreground}" 
                                              FontWeight="{TemplateBinding FontWeight}" 
                                              FontStyle="{TemplateBinding FontStyle}" 
                                              FontStretch="{TemplateBinding FontStretch}" 
                                              FontSize="{TemplateBinding FontSize}" 
                                              FontFamily="{TemplateBinding FontFamily}" 
                                              HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" 
                                              IsChecked="{Binding IsExpanded, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" 
                                              Margin="1" MinWidth="0" MinHeight="0" Padding="{TemplateBinding Padding}" 
                                              Style="{StaticResource ExpanderDownHeaderStyle}" 
                                              VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
                                <ContentPresenter x:Name="ExpandSite" DockPanel.Dock="Bottom" Focusable="false" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" Visibility="Collapsed" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                            </DockPanel>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsExpanded" Value="true">
                                <Setter Property="Visibility" TargetName="ExpandSite" Value="Visible"/>
                            </Trigger>
                            <Trigger Property="IsEnabled" Value="false">
                                <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Style TargetType="{x:Type ScrollViewer}">
            <Setter Property="OverridesDefaultStyle" Value="True"/>
            <Setter Property="CanContentScroll" Value="True"></Setter>
            <Setter Property="HorizontalScrollBarVisibility" Value="Hidden"/>

            <Style.Resources>
                <SolidColorBrush x:Key="NormalBorderBrush" Color="#FFFF0000" />
                <SolidColorBrush x:Key="HorizontalNormalBrush" Color="#FFFF0000" />
                <SolidColorBrush x:Key="HorizontalNormalBorderBrush" Color="#FFFF0000" />
                <SolidColorBrush x:Key="DisabledForegroundBrush" Color="#FFFF0000" />
                <SolidColorBrush x:Key="NormalBrush" Color="Transparent" />
                <!--滚动条样式-->
                <Style x:Key="ScrollBarThumb" TargetType="{x:Type Thumb}">
                    <Setter Property="SnapsToDevicePixels" Value="True"/>
                    <Setter Property="OverridesDefaultStyle" Value="true"/>
                    <Setter Property="IsTabStop" Value="false"/>
                    <Setter Property="Width" Value="8"/>
                    <Setter Property="Focusable" Value="false"/>
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type Thumb}">
                                <!-- 滑块正常颜色  FF428BCA  FF00FFFF -->
                                <Border x:Name="border"  Background="#FF428BCA" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="0" />
                                <ControlTemplate.Triggers>
                                    <Trigger Property="IsMouseOver" Value="True">
                                        <!-- 滑块鼠标移上去颜色80FFFFFF  -->
                                        <Setter Property="Background" TargetName="border" Value="#FF1F7AC9"></Setter>
                                    </Trigger>
                                </ControlTemplate.Triggers>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>


                <ControlTemplate x:Key="VerticalScrollBar" TargetType="{x:Type ScrollBar}">
                    <Grid >
                        <!-- 滑块背景颜色-->
                        <Border CornerRadius="2"  Background="Transparent"  BorderThickness="0" BorderBrush="#D6D4D4" />
                        <Track Name="PART_Track" IsDirectionReversed="true">
                            <Track.Thumb>
                                <Thumb Style="{StaticResource ScrollBarThumb}" 
                                   Margin="1,0,1,0" Background="{StaticResource HorizontalNormalBrush}" 
                                   BorderBrush="{StaticResource HorizontalNormalBorderBrush}" />
                            </Track.Thumb>
                        </Track>

                    </Grid>
                </ControlTemplate>

                <Style x:Key="HScrollBarThumb" TargetType="{x:Type Thumb}">
                    <Setter Property="SnapsToDevicePixels" Value="True"/>
                    <Setter Property="OverridesDefaultStyle" Value="true"/>
                    <Setter Property="IsTabStop" Value="false"/>
                    <Setter Property="Height" Value="9"/>
                    <Setter Property="HorizontalAlignment" Value="Stretch"/>
                    <Setter Property="Focusable" Value="false"/>
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type Thumb}">
                                <!-- 滑块正常颜色-->
                                <Border  x:Name="border" CornerRadius="0" Background="#FF428BCA" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="0" />
                                <ControlTemplate.Triggers>
                                    <Trigger Property="IsMouseOver" Value="True">
                                        <!-- 滑块鼠标移上去颜色-->
                                        <Setter Property="Background" TargetName="border" Value="#FF1F7AC9"></Setter>
                                    </Trigger>
                                </ControlTemplate.Triggers>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>

                <ControlTemplate x:Key="HorizontalScrollBar" TargetType="{x:Type ScrollBar}">
                    <Grid >
                        <!-- 滑块背景颜色-->
                        <Border  Grid.ColumnSpan="3"  CornerRadius="2" Background="Transparent"  BorderThickness="0" BorderBrush="#D6D4D4" />
                        <Track Name="PART_Track" IsDirectionReversed="False">
                            <Track.Thumb>
                                <Thumb Style="{StaticResource HScrollBarThumb}" Margin="0,1,0,1" Background="{StaticResource NormalBrush}" BorderBrush="{StaticResource NormalBorderBrush}" />
                            </Track.Thumb>
                        </Track>
                    </Grid>
                </ControlTemplate>

                <!--滚动条整体样式-->
                <Style x:Key="{x:Type ScrollBar}" TargetType="{x:Type ScrollBar}">
                    <Setter Property="SnapsToDevicePixels" Value="True"/>
                    <Setter Property="Background" Value="Transparent"/>
                    <Setter Property="OverridesDefaultStyle" Value="true"/>
                    <Style.Triggers>
                        <Trigger Property="Orientation" Value="Horizontal">
                            <Setter Property="Width" Value="Auto"/>
                            <Setter Property="Height" Value="8" />
                            <Setter Property="Template" Value="{StaticResource HorizontalScrollBar}" />
                        </Trigger>
                        <Trigger Property="Orientation" Value="Vertical">
                            <Setter Property="Width" Value="8"/>
                            <Setter Property="Height" Value="Auto" />
                            <Setter Property="Template" Value="{StaticResource VerticalScrollBar}" />
                        </Trigger>
                    </Style.Triggers>
                </Style>
            </Style.Resources>
        </Style>
    </Window.Resources>
    <Grid>
        <ScrollViewer VerticalScrollBarVisibility="Visible">
            <ItemsControl ItemsSource="{Binding friendGroups}">
                <ItemsControl.ItemsPanel>
                    <ItemsPanelTemplate>
                        <StackPanel></StackPanel>
                    </ItemsPanelTemplate>
                </ItemsControl.ItemsPanel>
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <Expander Header="{Binding Name, UpdateSourceTrigger=PropertyChanged}"
                                  Style="{StaticResource ExpanderStyle1}"
                                  HorizontalAlignment="Stretch"  VerticalAlignment="Top" >
                            <Grid Background="#00000000">
                                <ItemsControl ItemsSource="{Binding Friends}">
                                    <ItemsControl.ItemsPanel>
                                        <ItemsPanelTemplate>
                                            <StackPanel></StackPanel>
                                        </ItemsPanelTemplate>
                                    </ItemsControl.ItemsPanel>
                                    <ItemsControl.ItemTemplate>
                                        <DataTemplate>
                                            <Grid x:Name="bk" Height="60" HorizontalAlignment="Stretch" Margin="5,5,5,5">
                                                <Grid.ColumnDefinitions>
                                                    <ColumnDefinition Width="68"/>
                                                    <ColumnDefinition Width="80*"/>
                                                </Grid.ColumnDefinitions>
                                                <Rectangle Fill="Chocolate" HorizontalAlignment="Center" 
                                                           VerticalAlignment="Center" Width="40" Height="40" Grid.Column="0"></Rectangle>
                                                <Label Content="{Binding Name}" Margin="0,5,0,0" Grid.Column="1" />
                                            </Grid>
                                            <DataTemplate.Triggers>
                                                <Trigger Property="IsMouseOver" Value="true">
                                                    <Setter Property="Background" TargetName="bk" Value="#15333333"/>
                                                </Trigger>
                                            </DataTemplate.Triggers>
                                        </DataTemplate>
                                    </ItemsControl.ItemTemplate>
                                </ItemsControl>
                            </Grid>
                        </Expander>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>
        </ScrollViewer>
    </Grid>
</Window>

wpf cs后台

using System;
using System.Collections.ObjectModel;
using System.ComponentModel;
using System.Windows;

namespace TestWPF
{
    /// <summary>
    /// MainWindow.xaml 的交互逻辑
    /// </summary>
    public partial class MainWindow : Window, INotifyPropertyChanged
    {
        public MainWindow()
        {
            InitializeComponent();
            this.DataContext = this;
            friendGroups = new ObservableCollection<FriendGroup>();
            friendGroups.Add(new FriendGroup() { Name = "不认识的" });
            friendGroups.Add(new FriendGroup() { Name = "同学" });
            friendGroups.Add(new FriendGroup() { Name = "同事" });
            friendGroups.Add(new FriendGroup() { Name = "室友" });
            friendGroups.Add(new FriendGroup() { Name = "老外" });
            friendGroups.Add(new FriendGroup() { Name = "陌生人" });
        }

        public ObservableCollection<FriendGroup> friendGroups
        {
            get
            {
                return _friends;
            }
            set
            {
                _friends = value;
                RaisePropertyChanged("FriendGroup");
            }
        }
        private ObservableCollection<FriendGroup> _friends { get; set; }
        #region INotifyPropertyChanged Members

        public event PropertyChangedEventHandler PropertyChanged;

        #endregion
        #region Methods
        private void RaisePropertyChanged(string propertyName)
        {
            // take a copy to prevent thread issues
            PropertyChangedEventHandler handler = PropertyChanged;
            if (handler != null)
            {
                handler(this, new PropertyChangedEventArgs(propertyName));
            }
        }
        #endregion
    }


    public class FriendEntity : INotifyPropertyChanged
    {
        public String Name { get; set; }
        public String Nick { get; set; }


        #region INotifyPropertyChanged Members
        public event PropertyChangedEventHandler PropertyChanged;

        #endregion
        #region Methods
        private void RaisePropertyChanged(string propertyName)
        {
            // take a copy to prevent thread issues
            PropertyChangedEventHandler handler = PropertyChanged;
            if (handler != null)
            {
                handler(this, new PropertyChangedEventArgs(propertyName));
            }
        }
        #endregion
    }




    public class FriendGroup : INotifyPropertyChanged
    {
        public String Name
        {
            get
            {
                return _name;
            }
            set
            {
                _name = value;
                RaisePropertyChanged("Name");
            }
        }
        private String _name { get; set; }

        public FriendGroup()
        {
            Friends = new ObservableCollection<FriendEntity>();
            Friends.Add(new FriendEntity() { Name = "小明" });
            Friends.Add(new FriendEntity() { Name = "小红" });
            Friends.Add(new FriendEntity() { Name = "小兰" });
            Friends.Add(new FriendEntity() { Name = "柱子" });

        }


        public ObservableCollection<FriendEntity> Friends
        {
            get
            {
                return _friends;
            }
            set
            {
                _friends = value;
                RaisePropertyChanged("Friends");
            }
        }
        private ObservableCollection<FriendEntity> _friends { get; set; }


        #region INotifyPropertyChanged Members



        public event PropertyChangedEventHandler PropertyChanged;

        #endregion
        #region Methods
        private void RaisePropertyChanged(string propertyName)
        {
            // take a copy to prevent thread issues
            PropertyChangedEventHandler handler = PropertyChanged;
            if (handler != null)
            {
                handler(this, new PropertyChangedEventArgs(propertyName));
            }
        }
        #endregion
    }
}
C# WPF DataGrid 分组（Group）
博客已退休
02-15 8861
C# WPF DataGrid 分组（Group） 效果如图，每个列的名字可以自定义。我随便用了”File”和”Attachment Name”。 在Window的Resources里面设置Style, GroupHeaderStyle： <Style
WPF自定义TreeView控件样式实现QQ联系人列表效果
08-27
本文将详细介绍如何在WPF中自定义TreeView控件样式以实现类似QQ联系人列表的效果。 首先，我们要理解QQ联系人列表的特点，它通常包含多级数据，并且有明显的分组与个人标识。在WPF中，我们可以使用...
wpf实现仿qq消息提示框
huangli321456的专栏
01-15 9616
1、实现步骤 1.1 另起一个窗口作为消息提示的窗口，在主窗体中调用，先处理一下消息框的展示问题， AllowsTransparency="True"  WindowStyle="None" WindowStartupLocation="Manual"，实现允许透明，隐藏自带的工具条（关闭、最大/最小化），自定义窗口位置。 1.2 修改窗体的展示位置为右下角 1.3 通过渐入动画展示窗体，通
WPF打造高仿真QQ登录界面概念版教程
最新发布
weixin_29840475的博客
10-04 885
本文还有配套的精品资源，点击获取 简介：本文详细介绍了使用Windows Presentation Foundation (WPF) 创建一个外观和功能类似QQ的登录界面的过程。WPF是基于.NET Framework的用户界面框架，支持丰富的视觉效果和交互性。文章阐述了布局管理、控件使用、样式和模板自定义、数据绑定、事件处理、动画效果、资源管理、安全性、响应式设计等关键要...
【WPF】实现QQ中的分组面板
weixin_33881041的博客
02-12 190
要实现的面板的效果如下图所示： 一个面板打开了，其它的面板会自动收起。而且打开的面板会填充所有可用空间。那么这样的效果在WPF里应该如何实现呢？ 1. 多个面板，排成一排，感觉可以用ListBox。 2. 然后里面的东西，点一下打开，再点一下收起。感觉就是一个Expander嘛。 3. 一个打开，其它所有的收起。可以把Expander的IsExpanded与SelectedItem绑...
WPF 自定义范围分组
dxm809的博客
05-29 424
&lt;Window x:Class="ViewExam.MainWindow"        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"        Title="MainWindow...
WPF—QQ界面（五）：QQ好友分组列表的效果实现 及 截稿
weixin_34364135的博客
03-31 486
效果分析： 1、鼠标左键单击 分组 的组名，能够弹出一个下拉列表，并且左边的向右箭头转成向下； 2、弹出的下拉列表中包含好友的头像，好友的昵称，还有好友的个性签名或最新动态； 3、当鼠标移到好友这一行，能够将一行的背景色置蓝或置橙； 4、当鼠标移到好友的头像上，能够悬浮显示好友的个人信息。 除了这些基本的效果，还有很多效果蕴含其中。。。。感觉分组列表的效果最难做。 我大致做出了那样的效...
wpf 实现类似qq好友列表样式+酷炫动画效果
03-26
在本文中，我们将深入探讨如何使用WPF（Windows Presentation Foundation）技术来实现一个类似QQ好友列表的界面风格，并加入酷炫的动画效果。WPF是.NET Framework的一部分，它提供了丰富的图形用户界面（GUI）设计...
C#写的QQ分组效果
06-16
在本文中，我们将深入探讨如何使用C#编程语言来实现类似QQ分组的侧边栏效果，也称为Sidebar。QQ分组是一种用户界面设计元素，它允许用户将联系人或项目按照逻辑组别进行整理，使得信息管理和操作更加便捷。在C#中，...
C#类似于QQ分组
03-13
在C#中实现“类似于QQ分组”的功能，实际上是指创建一种组织和管理数据的方式，这通常涉及到用户界面（UI）设计和数据结构的运用。这个功能可以让用户更加高效地管理和查找相关信息，类似于QQ软件中将联系人分组以...
类似QQ好友分组的第三方控件SideBar及详细使用说明
08-01
SideBar是一款类似QQ好友分组的第三方控件，它提供了高效、灵活的界面管理功能，让用户可以方便地组织和分类各种元素，类似于QQ聊天软件中的好友分组方式。这款控件设计精巧，适用于多种应用场景，如聊天应用、信息...
WPF做出QQ界面
08-15
本项目利用DMSkin搭建无边界的页面，利用MVVM搭建框架，松耦合，帮助理解MVVM设计模式.
[WPF] WPF学习分组、对齐、排序、序列化和常用功能
07-29
[WPF] WPF学习分组、对齐、排序、序列化和常用功能
wpf DataGrid分组、排序、筛选
02-02
针对 DataGrid 控件，对数据进行分组、排序和筛选....
C#模仿QQ实现一些想要的功能
04-02
喜欢QQ的人可以拿去看看 对你的技术有所帮助 希望采纳
wpf仿QQ好友分组界面
03-20
采用Expander和ListView来实现，运用了DataTemplate，具体请下载了查看代码
刚刚体验了一把用WPF做的QQ概念版
weixin_34242819的博客
01-11 542
        腾讯刚刚发布了QQ概念版的操作视频，包括鼠标操作和触摸操作两部分，QQ概念版真是把Windows 7内置的触摸和WPF的特性发挥到了极致! 1. 登录界面, 一个字: 美(背景的云啊, 树叶啊都是动着的) 2. 主界面(借的别人QQ用的, 我没申请体验不好登录)(这个背景的树叶也是飘动着的)  3. 聊天窗口也有变化 4. 好...
WPF编程；上位机编程；C#编程；仿QQ基础实现（一）之界面预览
泥泥虎的博客
11-09 1737
软件简介一、摘要1.描述2.关键字二、什么是WPF三、为什么选择WPF四、仿QQ的登录界面五、仿QQ联系人界面六、源码下载七、其他八、参考 一、摘要 1.描述 本文主要描述的是如何通过使用WPF编写仿QQ软件，主要是记录一些实现方法，有的方法不代表是最优实现，请大家根据自己实际情况加以修改。 在网络上仿QQ的软件很多，也有很多把聊天功能也实现了，很多使用WinForm，但是效果差强人意 ，本人初次接触WPF也是在2021年初，之所以选择WPF是因为在实际的项目中，WPF能更好的实现用户所想，编程也极为简单
WPF 实现QQ抖动
weixin_33940102的博客
05-20 102
//wpf中实现类似于qq的抖动窗效果 //前段页面 <Window x:Class="WpfApplication4.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/20...
WPF实现的QQ登录窗口代码示例
在本篇WPF代码示例中，我们主要探讨了如何使用Windows Presentation Foundation (WPF)技术来实现一个基本的QQ登录窗口。WPF是Microsoft开发的一套用于创建桌面应用程序的框架，它结合了XAML（XML-based language）...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值