WPF实现时间轴(仿Gitee)

 WPF开发者QQ群： 340500857  | 微信群 -> 进入公众号主页 加入组织

“ 前言，接着上一篇圆形菜单。”

欢迎转发、分享、点赞、在看，谢谢~。  

01

—

效果预览

效果预览（更多效果请下载源码体验）：

02

—

代码如下

一、TimeLineItemControl.cs 代码如下

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;namespace WpfTimeLineControl
{public class TimeLineItemControl : Control{public bool IsBottom{get { return (bool)GetValue(IsBottomProperty); }set { SetValue(IsBottomProperty, value); }}public static readonly DependencyProperty IsBottomProperty =DependencyProperty.Register("IsBottom", typeof(bool), typeof(TimeLineItemControl), new PropertyMetadata(false));public ItemTypeEnum ItemType{get { return (ItemTypeEnum)GetValue(ItemTypeProperty); }set { SetValue(ItemTypeProperty, value); }}public static readonly DependencyProperty ItemTypeProperty =DependencyProperty.Register("ItemType", typeof(ItemTypeEnum), typeof(TimeLineItemControl));public string Text{get { return (string)GetValue(TextProperty); }set { SetValue(TextProperty, value); }}public static readonly DependencyProperty TextProperty =DependencyProperty.Register("Text", typeof(string), typeof(TimeLineItemControl), new PropertyMetadata(string.Empty));public string Head{get { return (string)GetValue(HeadProperty); }set { SetValue(HeadProperty, value); }}public static readonly DependencyProperty HeadProperty =DependencyProperty.Register("Head", typeof(string), typeof(TimeLineItemControl), new PropertyMetadata(string.Empty));public DataTemplate CommonTemplate{get { return (DataTemplate)GetValue(CommonTemplateProperty); }set { SetValue(CommonTemplateProperty, value); }}public static readonly DependencyProperty CommonTemplateProperty =DependencyProperty.Register("CommonTemplate", typeof(DataTemplate), typeof(TimeLineItemControl));public DataTemplate TextTemplate{get { return (DataTemplate)GetValue(TextTemplateProperty); }set { SetValue(TextTemplateProperty, value); }}public static readonly DependencyProperty TextTemplateProperty =DependencyProperty.Register("TextTemplate", typeof(DataTemplate), typeof(TimeLineItemControl));public Brush BackgroundColor{get { return (Brush)GetValue(BackgroundColorProperty); }set { SetValue(BackgroundColorProperty, value); }}public static readonly DependencyProperty BackgroundColorProperty =DependencyProperty.Register("BackgroundColor", typeof(Brush), typeof(TimeLineItemControl), new PropertyMetadata(null));static TimeLineItemControl(){DefaultStyleKeyProperty.OverrideMetadata(typeof(TimeLineItemControl), new FrameworkPropertyMetadata(typeof(TimeLineItemControl)));}}public enum ItemTypeEnum{Time,Name,Fork,Star}
}

二、App.xaml代码如下

<Application x:Class="WpfTimeLineControl.App"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:local="clr-namespace:WpfTimeLineControl"StartupUri="MainWindow.xaml"><Application.Resources><PathGeometry x:Key="PathStar">M649.714 573.714l174.857-169.714-241.143-35.429-108-218.286-108 218.286-241.143 35.429 174.857 169.714-41.714 240.571 216-113.714 215.429 113.714zM950.857 369.714q0 12.571-14.857 27.429l-207.429 202.286 49.143 285.714q0.571 4 0.571 11.429 0 28.571-23.429 28.571-10.857 0-22.857-6.857l-256.571-134.857-256.571 134.857q-12.571 6.857-22.857 6.857-12 0-18-8.286t-6-20.286q0-3.429 1.143-11.429l49.143-285.714-208-202.286q-14.286-15.429-14.286-27.429 0-21.143 32-26.286l286.857-41.714 128.571-260q10.857-23.429 28-23.429t28 23.429l128.571 260 286.857 41.714q32 5.143 32 26.286z</PathGeometry><SolidColorBrush x:Key="BorderBrushItem">#fe7708</SolidColorBrush><DataTemplate x:Key="TimeContent"><Ellipse Stroke="{StaticResource BorderBrushItem}" Fill="White" VerticalAlignment="Top"StrokeThickness="2" Width="10" Height="10"/></DataTemplate><DataTemplate x:Key="NameContent"><Grid><Ellipse Fill="{Binding BackgroundColor, RelativeSource={RelativeSource AncestorType={x:Type local:TimeLineItemControl}}}" Width="30" Height="30"/><TextBlock Text="{Binding Head, RelativeSource={RelativeSource AncestorType={x:Type local:TimeLineItemControl}}}"FontSize="16"HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="White"/></Grid></DataTemplate><DataTemplate x:Key="TextTime"><TextBlock Margin="{Binding Padding, RelativeSource={RelativeSource AncestorType={x:Type local:TimeLineItemControl}}}" Text="{Binding Text, RelativeSource={RelativeSource AncestorType={x:Type local:TimeLineItemControl}}}"VerticalAlignment="Top"FontWeight="Black" Foreground="Black"FontSize="16"/></DataTemplate><DataTemplate x:Key="TextName"><TextBlock Margin="{Binding Padding, RelativeSource={RelativeSource AncestorType={x:Type local:TimeLineItemControl}}}" Text="{Binding Text, RelativeSource={RelativeSource AncestorType={x:Type local:TimeLineItemControl}}}"VerticalAlignment="Center"FontWeight="Black" Foreground="#005980"FontSize="16"/></DataTemplate><DataTemplate x:Key="TextStar"><WrapPanel Margin="{Binding Padding, RelativeSource={RelativeSource AncestorType={x:Type local:TimeLineItemControl}}}"><Path Data="{StaticResource PathStar}" Height="15" Width="15" Fill="Gray" Stretch="Fill"/><TextBlock Margin="4,0" Text="Star 了" FontSize="12" VerticalAlignment="Center"/><TextBlock Text="{Binding Text, RelativeSource={RelativeSource AncestorType={x:Type local:TimeLineItemControl}}}"VerticalAlignment="Center" Foreground="#005980"FontSize="12"/></WrapPanel></DataTemplate><Style TargetType="{x:Type local:TimeLineItemControl}"><Setter Property="Background" Value="Transparent" /><Setter Property="BorderBrush" Value="{Binding BorderBrush, RelativeSource={RelativeSource AncestorType={x:Type local:TimeLineControl}}}" /><Setter Property="BorderThickness" Value="0" /><Setter Property="Foreground" Value="{Binding Foreground, RelativeSource={RelativeSource AncestorType={x:Type local:TimeLineControl}}}" /><Setter Property="Padding" Value="15,0,15,0" /><Setter Property="MinHeight" Value="50" /><Setter Property="HorizontalContentAlignment" Value="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type local:TimeLineControl}}}" /><Setter Property="VerticalContentAlignment" Value="{Binding VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type local:TimeLineControl}}}" /><Setter Property="SnapsToDevicePixels" Value="True" /><Setter Property="UseLayoutRounding" Value="True" /><Setter Property="CommonTemplate" Value="{StaticResource TimeContent}"/><Setter Property="TextTemplate" Value="{StaticResource TextTime}"/><Setter Property="Template"><Setter.Value><ControlTemplate TargetType="{x:Type local:TimeLineItemControl}"><Grid><Grid.RowDefinitions><RowDefinition Height="auto" /><RowDefinition Height="*" /></Grid.RowDefinitions><Grid.ColumnDefinitions><ColumnDefinition Width="auto" /><ColumnDefinition Width="*" /></Grid.ColumnDefinitions><Rectangle x:Name="PART_Rectangle" Grid.RowSpan="2" Width="1"Fill="{TemplateBinding BorderBrush}"/><ContentPresenter x:Name="PART_ContentPresenter" ContentTemplate="{TemplateBinding CommonTemplate}"Content="{TemplateBinding Head}" Width="30" Height="30"/><ContentPresenter x:Name="PART_ContentPresenterText" ContentTemplate="{TemplateBinding TextTemplate}"Content="{TemplateBinding Text}" Grid.Row="0" Grid.Column="1"/></Grid><ControlTemplate.Triggers><Trigger Property="ItemType" Value="{x:Static local:ItemTypeEnum.Name}"><Setter Property="CommonTemplate" Value="{StaticResource NameContent}"/><Setter Property="TextTemplate" Value="{StaticResource TextName}"/></Trigger><Trigger Property="ItemType" Value="{x:Static local:ItemTypeEnum.Star}"><Setter Property="CommonTemplate" Value="{x:Null}"/><Setter Property="TextTemplate" Value="{StaticResource TextStar}"/></Trigger><Trigger Property="IsBottom" Value="true"><Setter Property="Visibility" TargetName="PART_Rectangle" Value="Collapsed"/></Trigger></ControlTemplate.Triggers></ControlTemplate></Setter.Value></Setter>
</Style><Style TargetType="{x:Type local:TimeLineControl}"><Setter Property="Background" Value="Transparent" /><Setter Property="BorderBrush" Value="Gray" /><Setter Property="BorderThickness" Value="0" /><Setter Property="Foreground" Value="Black" /><Setter Property="HorizontalContentAlignment" Value="Left" /><Setter Property="VerticalContentAlignment" Value="Top" /><Setter Property="SnapsToDevicePixels" Value="True" /><Setter Property="UseLayoutRounding" Value="True" /><Setter Property="Template"><Setter.Value><ControlTemplate TargetType="{x:Type local:TimeLineControl}"><Border Background="{TemplateBinding Background}"BorderBrush="{TemplateBinding BorderBrush}"BorderThickness="{TemplateBinding BorderThickness}"SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"UseLayoutRounding="{TemplateBinding UseLayoutRounding}"><ScrollViewer VerticalScrollBarVisibility="Auto"><ItemsPresenter /></ScrollViewer></Border></ControlTemplate></Setter.Value></Setter>
</Style></Application.Resources>
</Application>

三、MainWindow.xaml.cs代码如下

using System;
using System.Collections;
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;namespace WpfTimeLineControl
{/// <summary>/// MainWindow.xaml 的交互逻辑/// </summary>public partial class MainWindow : Window{public MainWindow(){InitializeComponent();}int num = 0;private void AddButton_Click(object sender, RoutedEventArgs e){num++;switch (num){case 1:this.TimeLineControl.Items.Add(new TimeLineItemControl() { Text = DateTime.Now.ToString("yyyy-MM-dd"), ItemType = ItemTypeEnum.Time });this.TimeLineControl.Items.Add(new TimeLineItemControl() { Text = "我是骗人布010", Head = "我", ItemType = ItemTypeEnum.Name, BackgroundColor = new SolidColorBrush(GetRandomColor()) });this.TimeLineControl.Items.Add(new TimeLineItemControl() { Text = "闫驚鏵/WPFDevelopers", ItemType = ItemTypeEnum.Star });break;case 2:this.TimeLineControl.Items.Add(new TimeLineItemControl() { Text = DateTime.Now.AddDays(-1).ToString("yyyy-MM-dd"), ItemType = ItemTypeEnum.Time });this.TimeLineControl.Items.Add(new TimeLineItemControl() { Text = "风云大陆", Head = "风", ItemType = ItemTypeEnum.Name, BackgroundColor = new SolidColorBrush(GetRandomColor()) });break;case 3:this.TimeLineControl.Items.Add(new TimeLineItemControl() { Text = DateTime.Now.AddDays(-2).ToString("yyyy-MM-dd"), ItemType = ItemTypeEnum.Time });this.TimeLineControl.Items.Add(new TimeLineItemControl() { Text = "王羲之", Head = "王", ItemType = ItemTypeEnum.Name, BackgroundColor = new SolidColorBrush(GetRandomColor())});this.TimeLineControl.Items.Add(new TimeLineItemControl() { Text = "闫驚鏵/WPFDevelopers", ItemType = ItemTypeEnum.Star });break;case 4:this.TimeLineControl.Items.Add(new TimeLineItemControl() { Text = DateTime.Now.AddDays(-3).ToString("yyyy-MM-dd"), ItemType = ItemTypeEnum.Time });this.TimeLineControl.Items.Add(new TimeLineItemControl() { Text = "花雨", Head = "花", ItemType = ItemTypeEnum.Name, BackgroundColor = new SolidColorBrush(GetRandomColor()) });this.TimeLineControl.Items.Add(new TimeLineItemControl() { Text = "闫驚鏵/WPFDevelopers", ItemType = ItemTypeEnum.Star });break;case 5:this.TimeLineControl.Items.Add(new TimeLineItemControl() { Text = DateTime.Now.AddDays(-6).ToString("yyyy-MM-dd"), ItemType = ItemTypeEnum.Time });this.TimeLineControl.Items.Add(new TimeLineItemControl() { Text = "纪春庆", Head = "纪", ItemType = ItemTypeEnum.Name, BackgroundColor = new SolidColorBrush(GetRandomColor()) });this.TimeLineControl.Items.Add(new TimeLineItemControl() { Text = "闫驚鏵/WPFDevelopers", ItemType = ItemTypeEnum.Star });break;default:break;}}Color GetRandomColor(){var random = new Random();return Color.FromRgb((byte)random.Next(0, 255), (byte)random.Next(0, 255), (byte)random.Next(0, 255));}}
}

源码地址

github：https://github.com/yanjinhuagood/WPFDevelopers.git

gitee：https://gitee.com/yanjinhua/WPFDevelopers.git

WPF开发者QQ群： 340500857 

blogs： https://www.cnblogs.com/yanjinhua

Github：https://github.com/yanjinhuagood

出处：https://www.cnblogs.com/yanjinhua

版权：本作品采用「署名-非商业性使用-相同方式共享 4.0 国际」许可协议进行许可。

转载请著名作者 出处 https://github.com/yanjinhuagood

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/news/301184.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

java如何用键盘输入_java中如何从键盘输入（附代码）

java如何用键盘输入_java中如何从键盘输入（附代码）

一、java不像C中拥有scanf这样功能强大的函数&#xff0c;大多是通过定义输入输出流对象。常用的类有BufferedReader&#xff0c;Scanner。相关java视频教程推荐&#xff1a;java实例程序&#xff1a;视频教程1、利用 Scanner 实现从键盘读入integer或float 型数据//import jav…
阅读更多...
.text 0.958之间居的中文汉化下载

.text 0.958之间居的中文汉化下载

.text 0.958之间居的中文汉化下载 http://218.19.140.219/uploadfile/040426192172.rar posted on 2004-06-14 20:19 浙林龙哥 阅读(...) 评论(...) 编辑 收藏 转载于:https://www.cnblogs.com/huqingyu/archive/2004/06/14/15666.html
阅读更多...
JS partial-application

JS partial-application

为什么80%的码农都做不了架构师&#xff1f;>>> /* Title: Partial applicationDescription: the process of fixing a number of arguments to a function, producing another function of smaller arity */var partialAny (function(aps) {// This function wil…
阅读更多...
每日一笑 | 我写了一段代码，为什么不能运行呢？

每日一笑 | 我写了一段代码，为什么不能运行呢？

全世界只有3.14 % 的人关注了数据与算法之美&#xff08;图源网络&#xff0c;侵权删&#xff09;
阅读更多...
使用IQueryable扩展方法实现复杂查询条件

使用IQueryable扩展方法实现复杂查询条件

问题在业务开发中&#xff0c;经常要处理比较复杂的查询条件&#xff0c;如下图&#xff1a;如果任一输入有值&#xff0c;则必须作为查询条件之一。示例代码如下&#xff1a;IQueryable<User> query repository.GetAll();if(name!null) {query query.Where(p>p.Name…
阅读更多...
java字符串拼接例子_Java详解【String】+【StringBuilder vs StringBuffer】+【字符串拼接】...

java字符串拼接例子_Java详解【String】+【StringBuilder vs StringBuffer】+【字符串拼接】...

String详解注意区分对象和对象的引用首先来看一下我在jdk中找到的String源代码&#xff0c;这里只截取开头的小小一部分public final class Stringimplements java.io.Serializable, Comparable, CharSequence {/** The value is used for character storage. */private final …
阅读更多...
阿里日均纳税超1.4亿；AI换脸骗过美侦查；日本民众哄抢令和报纸；辟谣教学楼发现大量金矿；上海拨通首个5G通话；这就是今日大新闻...

阿里日均纳税超1.4亿；AI换脸骗过美侦查；日本民众哄抢令和报纸；辟谣教学楼发现大量金矿；上海拨通首个5G通话；这就是今日大新闻...

今天是4月2日农历二月廿七今天星期二下面是今天的大新闻阿里巴巴日均纳税超1.4亿&#xff08;IT168&#xff09;4月1日&#xff0c;阿里巴巴在“2020财年首日”发布消息称&#xff1a;2018全年&#xff0c;阿里巴巴集团和蚂蚁金服集团总计向国家纳税516亿元&#xff0c;同比增长…
阅读更多...
大家好!

大家好!

在博客园申请帐号已经有好长时间了&#xff0c;可是一直也没有写点什么&#xff0c;可能是太忙了吧&#xff08;其实是懒&#xff09;&#xff01;以后我会多写些文字&#xff0c;毕竟这是一件好事。转载于:https://www.cnblogs.com/hubin/archive/2004/08/16/33928.html
阅读更多...
腾讯大湘网某处csrf(city.hn.qq.com)可投诉刷留言

腾讯大湘网某处csrf(city.hn.qq.com)可投诉刷留言

触发点&#xff1a; http://city.hn.qq.com http://city.hn.qq.com/auto/cshop&mbbs&id668 POST /msgboard/message.php HTTP/1.1 Host: c1.city.qq.com Connection: keep-alive Content-Length: 201 Cache-Control: max-age0 Accept: text/html,application/xhtmlxml,…
阅读更多...
c#：细说时区、DateTime和DateTimeOffset在国际化中的应用

c#：细说时区、DateTime和DateTimeOffset在国际化中的应用

先说下结论&#xff1a;如果系统不考虑全球化的话&#xff0c;那么我们不用考虑时区的问题&#xff0c;因为我们可以认为中国境内的计算机全部用的是北京时间。1. 时区的来源和划分地球自转一圈是360度&#xff0c;共24小时&#xff0c;所以1小时15度&#xff0c;即&#xff1a…
阅读更多...
java注解 sql_mybatis中注解映射SQL示例代码

java注解 sql_mybatis中注解映射SQL示例代码

前言本文主要给大家介绍了关于mybatis注解映射sql的相关内容&#xff0c;分享出来供大家参考学习&#xff0c;下面话不多说了&#xff0c;来一起看看详细的介绍&#xff1a;结果集分页有时我们需要处理海量数据&#xff0c;由于数据量太大&#xff0c;所以不能一次取出所有的数…
阅读更多...
超赞的“数据与算法之美”资料分享！

超赞的“数据与算法之美”资料分享！

相信&#xff0c;一直关注着我们的同学们都知道&#xff0c;小思妹分享了好多好多的资料给大家。为了方便新来的同学自取&#xff0c;小思妹又重新整理了一遍&#xff0c;直接点以下标题即可跳转&#xff01;这是我见过的最全的训练数据集&#xff0c;没有之一&#xff01;送你…
阅读更多...
mysql服务的启动和停止 net stop mysql net start mysql

mysql服务的启动和停止 net stop mysql net start mysql

第一招、mysql服务的启动和停止 net stop mysql net start mysql 第二招、登陆mysql 语法如下&#xff1a; mysql -u用户名-p用户密码 键入命令mysql -uroot -p&#xff0c;回车后提示你输入密码&#xff0c;输入12345&#xff0c;然后回车即可进入到mysql中了&#xff0c;mysq…
阅读更多...
在ASP.NET Core微服务架构下使用数据库切分和扩展， 并用JMeter进行负载测试

在ASP.NET Core微服务架构下使用数据库切分和扩展， 并用JMeter进行负载测试

原文链接&#xff1a;https://itnext.io/how-to-scale-an-asp-net-core-microservice-and-sharded-database-load-test-with-jmeter-1a8c7292e7e3现在&#xff0c;您将扩展应用程序并运行多个微服务和数据库的容器实例。您将使用Docker Compose和HAProxy负载均衡器&#xff1a;…
阅读更多...
mysql5.5 mysqli_php5.5.38增加mysqli扩展

mysql5.5 mysqli_php5.5.38增加mysqli扩展

php5.5.38增加mysqli扩展发布时间&#xff1a;2020-08-28 03:43:17来源&#xff1a;51CTO阅读&#xff1a;1148作者&#xff1a;xingyun2010编译的时候正常&#xff1a;./configure --prefix/usr/local/mysqli --with-php-config/usr/local/php/bin/php-config --with-mysqli/u…
阅读更多...
每日一笑 | 周杰伦到底什么时候才发新专辑？

每日一笑 | 周杰伦到底什么时候才发新专辑？

全世界只有3.14 % 的人关注了数据与算法之美&#xff08;图源网络&#xff0c;侵权删&#xff09;
阅读更多...
GARFIELD@10-18-2004

GARFIELD@10-18-2004

子非猫转载于:https://www.cnblogs.com/rexhost/archive/2004/10/18/53799.html
阅读更多...
【荐】牛逼的WPF动画库：XamlFlair

【荐】牛逼的WPF动画库：XamlFlair

【荐】牛逼的WPF动画库&#xff1a;XamlFlair原文链接&#xff1a;https://github.com/XamlFlair/XamlFlair翻译&#xff1a;沙漠尽头的狼(本文未全文翻译&#xff0c;建议阅读原文了解更多)XamlFlairXamlFlair库的目标是简化常见动画的实现&#xff0c;并允许开发人员使用几行…
阅读更多...
Python编程系列教程第13讲——隐藏数据和封装

Python编程系列教程第13讲——隐藏数据和封装

视频地址&#xff1a;http://www.56.com/u88/v_OTM5NjU0MjE.html#fromoutpvidOTM5NjU0MjE 普及网络安全知识&#xff0c;推动信息技术发展。 为祖国的网络安全撑起一片蓝天&#xff0c;为网络安全爱好者构建一方家园。 欢迎来到灰帽程序员论坛&#xff0c;我们的网址是&#xf…
阅读更多...
HijackThis日志细解【简明教程增强版】（五）

HijackThis日志细解【简明教程增强版】（五）

&#xff08;九&#xff09;组别——O51. 项目说明O5项与控制面板中被屏蔽的一些IE选项相关&#xff0c;一些恶意程序会隐藏控制面板中关于IE的一些选项&#xff0c;这可以通过在control.ini文件中添加相关命令实现。2. 举例O5 - control.ini: inetcpl.cplno 这里隐藏了控制面板…
阅读更多...
最新文章

Copyright @ 2022~2023