你的位置:首页 > 软件开发 > ASP.net > WPF钟表效果实现

WPF钟表效果实现

发布时间:2015-09-08 19:00:15
WPF在样式定义和UI动画上面相对于以前的技术有了不少的提升,下面给出WPF技术实现钟表的效果:1、Visual Studio新建一个WPF应用程序,命名为WpfClock,新建一个images文件夹,并准备一个钟表的背景图片和程序图标素材。2、编辑MainWindow.xaml ...

WPF在样式定义和UI动画上面相对于以前的技术有了不少的提升,下面给出WPF技术实现钟表的效果:

1、Visual Studio新建一个WPF应用程序,命名为WpfClock,新建一个images文件夹,并准备一个钟表的背景图片和程序图标素材。

WPF钟表效果实现

2、编辑MainWindow.xaml文件,对UI进行定制,代码如下(指针都是用Rectangle实现的,当然可以用图片代替):

 1 <Window x:Class="WpfClock.MainWindow" 2     ="http://schemas.microsoft.com/get='_blank'>winfx/2006/xaml/presentation" 3     ="http://schemas.microsoft.com/winfx/2006/xaml" 4     Title="MainWindow" Margin="2" Height="327" Width="311" AllowsTransparency="True"  5     WindowStyle="None" Background="Transparent" WindowStartupLocation="CenterScreen"  6     Icon="images/clock.ico"  7     ResizeMode="NoResize" Topmost="False" Opacity="1"> 8     <Grid Width="300" Height="300" MouseLeftButtonDown="Grid_MouseLeftButtonDown"> 9     <Image Source="images/backGround.png"></Image>10 11     <Label Name="lab商标" Foreground="White" Margin="0,0,0,211" HorizontalAlignment="Center" VerticalAlignment="Bottom" Height="Auto" Width="Auto" FontSize="13" >JackMoon</Label>12     <Label Name="lab创建时间" Foreground="White" Margin="0,91,0,0" HorizontalAlignment="Center" VerticalAlignment="Top" Height="Auto" Width="Auto">1987</Label>13 14     <!-- 秒针定义 -->15     <Rectangle Margin="150,0,149,150" Name="rectangleSecond" Stroke="White" Height="120" VerticalAlignment="Bottom" Width="1">16       <Rectangle.RenderTransform>17         <RotateTransform x:Name="secondPointer" CenterX="0" CenterY="120" Angle="0" />18       </Rectangle.RenderTransform>19     </Rectangle>20     <!-- -->21 22     <!-- 分钟定义 -->23     <Rectangle Margin="150,49,149,151" Name="rectangleMinute" Stroke="LightGreen" Width="1">24       <Rectangle.RenderTransform>25         <RotateTransform x:Name="minutePointer" CenterX="0" CenterY="100" Angle="45" />26       </Rectangle.RenderTransform>27     </Rectangle>28     <!-- -->29 30     <!-- 时针定义 -->31     <Rectangle Margin="150,80,149,150" Name="rectangleHour" Stroke="LightYellow" Width="1">32       <Rectangle.RenderTransform>33         <RotateTransform x:Name="hourPointer" CenterX="0" CenterY="70" Angle="90" />34       </Rectangle.RenderTransform>35     </Rectangle>36     <!---->37     <Label Content="08:08:08" FontSize="16" Foreground="White" Height="Auto" HorizontalAlignment="Center" Margin="114,0,113,86" Name="labTime" VerticalAlignment="Bottom" Width="Auto" />38 39   </Grid>40 </Window>

原标题:WPF钟表效果实现

关键词:wpf

wpf
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。