wpf模拟抖音很火的罗盘时钟，附源码，解压就能跑

    前端时间突然发现，抖音火了个壁纸，就是黑底蕾丝~~~ 错错错，黑底白字的罗盘时钟！

　　作为程序员的我，也觉得很新颖，所以想空了研究下，这不，空下来了就用wpf，写个属于.net自己的罗盘时钟，目前只实现了时分秒，农历日期等逻辑都是一样的，所以就略了，有兴趣的朋友，可以继续深入！

　　最开始想直接弄成成exe，方便拷贝，到处运行使用的，但是考虑到，万一有网友朋友们需要，所以我还是把封成一个dll，需要的地方添加引用即可！

　　为了弄这个，还恶补了下，高中还是初中的知识，sin30，cos60，呵呵，正弦，余弦，所以不明白的朋友们需要先了解清楚这个，因为罗盘是旋转，需要用到计算这个值！

　　不废话了，先上图看下效果！

    ok，整体效果就是这样了，中间是鄙人的名称缩写，抖音上是很潦草的，我就随便啦，占个位置，不然显得很空洞！

　　下面说说代码

  

  主要是，RomeClockControlLibrary，这个是对控件的封装，上面那个启动程序只是一个容器，或者说是调用者，当然，如果要达到我这个效果，实现圆形的窗口透明的朋友们，可以看下借鉴！

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

xmlns:local="clr-namespace:RomeClockControlLibrary"

mc:Ignorable="d"

d:DesignHeight="450"

d:DesignWidth="800"

>

Background="#000000"

>

上面是前端代码，有点基础的都应该看得懂，没什么可说的

usingSystem;

usingSystem.Collections.Generic;

usingSystem.Diagnostics;

usingSystem.Linq;

usingSystem.Text;

usingSystem.Threading;

usingSystem.Threading.Tasks;

usingSystem.Windows;

usingSystem.Windows.Controls;

usingSystem.Windows.Data;

usingSystem.Windows.Documents;

usingSystem.Windows.Input;

usingSystem.Windows.Media;

usingSystem.Windows.Media.Animation;

usingSystem.Windows.Media.Imaging;

usingSystem.Windows.Navigation;

usingSystem.Windows.Shapes;

namespaceRomeClockControlLibrary

{

///

///罗马时钟

///

publicpartialclassRomeClockControl:UserControl,IDisposable

{

publicRomeClockControl()

{

InitializeComponent();

}

///

///x轴的中心位置

///

privatedoubleCenterPixToX=>this.ActualWidth/2;

///

///y轴的中心位置

///

privatedoubleCenterPixToY=>this.ActualHeight/2;

///

///秒

///

privateCanvasCanvasHour=null;

///

///分

///

privateCanvasCanvasMinute=null;

///

///时

///

privateCanvasCanvasSecond=null;

///

///UI更新线程

///

privateThreadthread=null;

///

///缓存时的显示控件

///

privateTextBlockBlockHour=null;

///

///缓存分的显示控件

///

privateTextBlockBlockMinute=null;

///

///缓存秒的显示控件

///

privateTextBlockBlockSecond=null;

///

///添加控件

///

privatevoidAdd(AddTypetype)

{

varoffset=0;//偏移量

varcount=0;//总量

varstr=string.Empty;

vartime=0;

doubleAngleTime=0;

Canvascanvas=newCanvas();

canvas.Tag=type;

switch(type)

{

caseAddType.Hour:

offset=95;

count=24;

str="时";

CanvasHour=canvas;

time=DateTime.Now.Hour;

break;

caseAddType.Minute:

offset=60;

count=60;

str="分";

CanvasMinute=canvas;

time=DateTime.Now.Minute;

break;

caseAddType.Second:

offset=30;

count=60;

str="秒";

CanvasSecond=canvas;

time=DateTime.Now.Second;

break;

default:

return;

}

varangle=360/count;//角度

varx=CenterPixToX-offset;//起始位置

vary=CenterPixToY-offset;

for(inti=0;i

{

TextBlockt=newTextBlock();

if(i<=9)

{

t.Text=$"0{i}{str}";

}

else

{

t.Text=$"{i}{str}";

}

t.Tag=i;

t.Foreground=newSolidColorBrush((Color)ColorConverter.ConvertFromString("#7d7d7d"));

canvas.Children.Add(t);

varsinv=Math.Sin((90-angle*i)*(Math.PI/180));

varcosv=Math.Cos((90-angle*i)*(Math.PI/180));

vara=CenterPixToY-y*sinv;

varb=CenterPixToX+y*cosv;

Canvas.SetLeft(t,b);

Canvas.SetTop(t,a);

//设置角度

RotateTransformr=newRotateTransform();

r.Angle=angle*i-90;

t.RenderTransform=r;

if(i==time)

{

AngleTime=360-r.Angle;

//更新样式

t.Foreground=newSolidColorBrush(Colors.White);

switch(type)

{

caseAddType.Hour:

BlockHour=t;

break;

caseAddType.Minute:

BlockMinute=t;

break;

caseAddType.Second:

BlockSecond=t;

break;

}

}

}

grid.Children.Add(canvas);

//获取当前时间，旋转对应的角度

RotateTransformrtf=newRotateTransform();

rtf.CenterX=CenterPixToX;

rtf.CenterY=CenterPixToY;

rtf.Angle=AngleTime;

canvas.RenderTransform=rtf;

}

///

///渲染时钟

///

publicvoidShow()

{

Dispose();

//设置圆角

bor.CornerRadius=newCornerRadius(this.ActualWidth/2);

Add(AddType.Hour);

Add(AddType.Minute);

Add(AddType.Second);

AddName();

thread=newThread(newThreadStart(threadMethod));

thread.IsBackground=true;

thread.Start();

}

///

///生成名称

///

privatevoidAddName()

{

TextBlocktb=newTextBlock();

tb.Text="XL";

tb.Foreground=newSolidColorBrush(Colors.White);

tb.FontSize=60;

tb.FontFamily=newFontFamily("华文琥珀");

tb.HorizontalAlignment=HorizontalAlignment.Center;

tb.VerticalAlignment=VerticalAlignment.Center;

grid.Children.Add(tb);

}

///

///UI更新线程

///

privatevoidthreadMethod()

{

while(true)

{

Dispatcher.Invoke(()=>

{

vars=DateTime.Now.Second;

varm=DateTime.Now.Minute;

varh=DateTime.Now.Hour;

//处理时

if(m==0&&(int)BlockHour.Tag!=h)

{

SetUI(CanvasHour,h);

}

//处理分

if(s==0&&(int)BlockMinute.Tag!=m)

{

SetUI(CanvasMinute,m);

}

//处理秒

SetUI(CanvasSecond,s);

});

Thread.Sleep(1000);

}

}

///

///更新UI

///

///

///

///

privatevoidSetUI(Canvascan,inttag)

{

vartype=(AddType)can.Tag;

foreach(TextBlockitemincan.Children)

{

if((int)item.Tag==tag)

{

Debug.WriteLine(item.Text);

varfr=item.RenderTransformasRotateTransform;

varangle=360-fr.Angle;

varrtf=can.RenderTransformasRotateTransform;

DoubleAnimationdb=null;

if(type==AddType.Minute)

{

angle-=360;

db=newDoubleAnimation(angle,newDuration(TimeSpan.FromSeconds(1)));

db.Completed+=DbMinute_Completed;

BlockMinute=item;

}

elseif(type==AddType.Hour)

{

angle+=360;

db=newDoubleAnimation(angle,newDuration(TimeSpan.FromSeconds(1.5)));

db.Completed+=DbHour_Completed;

BlockHour=item;

}

else

{

db=newDoubleAnimation(angle,newDuration(TimeSpan.FromSeconds(0.25)));

db.Completed+=DbSecond_Completed;

BlockSecond=item;

}

rtf.BeginAnimation(RotateTransform.AngleProperty,db);

}

else

{

item.Foreground=newSolidColorBrush((Color)ColorConverter.ConvertFromString("#7d7d7d"));

}

}

}

///

///秒动画完成时

///

///

///

privatevoidDbSecond_Completed(objectsender,EventArgse)

{

BlockSecond.Foreground=newSolidColorBrush(Colors.White);

}

///

///时动画完成时

///

///

///

privatevoidDbHour_Completed(objectsender,EventArgse)

{

varfr=CanvasHour.RenderTransformasRotateTransform;

varangle=fr.Angle-360;

fr=null;

RotateTransformrtf=newRotateTransform();

rtf.CenterX=CenterPixToX;

rtf.CenterY=CenterPixToY;

rtf.Angle=angle;

CanvasHour.RenderTransform=rtf;

Debug.WriteLine(rtf.Angle);

BlockHour.Foreground=newSolidColorBrush(Colors.White);

}

///

///分动画完成时

///

///

///

privatevoidDbMinute_Completed(objectsender,EventArgse)

{

varfr=CanvasMinute.RenderTransformasRotateTransform;

varangle=fr.Angle+360;

fr=null;

RotateTransformrtf=newRotateTransform();

rtf.CenterX=CenterPixToX;

rtf.CenterY=CenterPixToY;

rtf.Angle=angle;

CanvasMinute.RenderTransform=rtf;

Debug.WriteLine(rtf.Angle);

BlockMinute.Foreground=newSolidColorBrush(Colors.White);

}

///

///释放

///

publicvoidDispose()

{

thread?.Abort();

grid.Children.Clear();

}

}

///

///添加类型

///

publicenumAddType

{

Hour,

Minute,

Second

}

}

 上面是后端逻辑，这才是重点，调用者通过show，调用显示的；在show里面会开启一个后台处理线程，来实现获取当前时间，并计算需要旋转的角度，最后采用动画更新到UI！

　　整个流程就是这样，有疑问的朋友，欢迎留言！

下载地址，附源码==》 点我前往

支持原创，转载请标明出处，谢谢！

 

 

乐意黎最近在某音上看到Wordclock屏保非常的火爆，看上去非常有意思。

哪么Wordclock屏保怎么弄的？如何设置呢？

 

电脑怎么设置动态时钟屏保

实现这样的动态时间屏保的效果主要是使用了一款叫做wordclock的第三方插件，《WordClock》时钟是一个纯文字排版的屏幕保护程序，可以在MacOSX和Windows上使用。它显示一个固定的名单，包括时钟显示所需要的数字和文字，足以表达任何可能的日期和时间。 

请自行搜索并下载  wordclock，并下载 软件。

参考网址:  https://www.simonheys.com/wordclock/ (需付费)

wordclock怎么设置

下载后解压安装

安装之后，找到Windows的屏保设置

选择Wordclock，并点击设置

字体和样式设置，一共有直线、旋转、随机三种样式

字体排版设置，小编为大家整出了直译，方便大家选择

显示设置，样式的调整

设置完成，即可出现抖音上的效果

 

 

乐意黎 

2019-04-05