WPF中绘制一个钟表

一个时钟的效果

画一个人钟表也挺简单的，就是对度数是要计算的，用到的方法，也就画圆和画路径以及画文本几个方法。

要在WPF中绘制一个钟表，您可以使用XAML和C#的组合来创建界面和实现逻辑。以下是一个简单示例：

1. 创建一个新的WPF项目，并在MainWindow.xaml文件中添加以下代码：

```xaml
<Window x:Class="ClockApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Clock" Height="300" Width="300" WindowStartupLocation="CenterScreen">
    <Grid>
        <Canvas Width="200" Height="200">
            <Ellipse Stroke="Black" StrokeThickness="2" Width="180" Height="180" />
            <Line X1="100" Y1="100" X2="100" Y2="40" Stroke="Black" StrokeThickness="3" RenderTransformOrigin="0.5,1">
                <Line.RenderTransform>
                    <RotateTransform x:Name="hourTransform" Angle="{Binding HourAngle}"/>
                </Line.RenderTransform>
            </Line>
            <Line X1="100" Y1="100" X2="100" Y2="20" Stroke="Black" StrokeThickness="2" RenderTransformOrigin="0.5,1">
                <Line.RenderTransform>
                    <RotateTransform x:Name="minuteTransform" Angle="{Binding MinuteAngle}"/>
                </Line.RenderTransform>
            </Line>
            <Line X1="100" Y1="100" X2="100" Y2="10" Stroke="Red" StrokeThickness="1" RenderTransformOrigin="0.5,1">
                <Line.RenderTransform>
                    <RotateTransform x:Name="secondTransform" Angle="{Binding SecondAngle}"/>
                </Line.RenderTransform>
            </Line>
            <Ellipse Fill="Black" Width="12" Height="12" Canvas.Left="94" Canvas.Top="94" />
        </Canvas>
    </Grid>
</Window>
```

这将创建一个窗口，其中包含一个Canvas元素，以绘制钟表的各个部分。

2. 在MainWindow.xaml.cs文件中添加以下代码：

```csharp
using System;
using System.ComponentModel;
using System.Windows;
using System.Windows.Threading;




namespace ClockApp
{
    public partial class MainWindow : Window, INotifyPropertyChanged
    {
        private const double AnglePerHour = 30.0;
        private const double AnglePerMinute = 6.0;
        private const double AnglePerSecond = 6.0;




        public event PropertyChangedEventHandler PropertyChanged;




        public double HourAngle { get; private set; }
        public double MinuteAngle { get; private set; }
        public double SecondAngle { get; private set; }




        public MainWindow()
        {
            InitializeComponent();




            // 使用定时器更新钟表的时间
            DispatcherTimer timer = new DispatcherTimer();
            timer.Interval = TimeSpan.FromSeconds(1);
            timer.Tick += Timer_Tick;
            timer.Start();




            DataContext = this;
        }




        private void Timer_Tick(object sender, EventArgs e)
        {
            DateTime currentTime = DateTime.Now;




            HourAngle = currentTime.Hour * AnglePerHour + currentTime.Minute * AnglePerMinute / 12;
            MinuteAngle = currentTime.Minute * AnglePerMinute + currentTime.Second * AnglePerSecond / 60;
            SecondAngle = currentTime.Second * AnglePerSecond;




            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(HourAngle)));
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(MinuteAngle)));
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(SecondAngle)));
        }
    }
}
```

在这段代码中，我们使用INotifyPropertyChanged接口实现了属性变化通知，通过定时器更新钟表的时间并计算每个指针的角度。

3. 运行应用程序，您将看到一个显示当前时间的钟表。

这只是一个简单的示例，您可以根据需求自定义钟表的外观和样式。希望这可以帮助您开始绘制一个钟表的WPF应用程序！

如果喜欢我的文章，那么

“在看”和转发是对我最大的支持！

-

技术群：添加小编微信并备注进群

小编微信：mm1552923   

公众号：dotNet编程大全