zoukankan      html  css  js  c++  java
  • C# WPF仿360安全卫士11

    首先上效果图:

    这是我的第一篇随笔,最近因为写一个播放器,开始学习WPF相关技术,随着不断入坑,播放器倒是做出来了,掉坑里了... 本着闲着也是闲着的精神,拿360开刀了;

    主界面主要使用DMSkin for WPF 的无边框解决方案;

    通过提取360自带的素材,绘制自定义控件;如下:

    1.导航栏(TabControl-TabItem)

     1 <Style x:Key="TopTabItem" TargetType="TabItem" >
     2         <Setter Property="Width" Value="100"></Setter>
     3         <Setter Property="FontSize" Value="16"></Setter>
     4         <Setter Property="Height" Value="100"></Setter>
     5         <Setter Property="Foreground" Value="#FF888888"></Setter>
     6         <Setter Property="Template" >
     7             <Setter.Value>
     8                 <ControlTemplate  TargetType="{x:Type TabItem}">
     9                     <Grid>
    10                        
    11                         <Border x:Name="back" CornerRadius="0" Background="Transparent">
    12                             <StackPanel HorizontalAlignment="Center" VerticalAlignment="Center" 
    13                                         >
    14                                 <Image Source="{TemplateBinding Tag}" HorizontalAlignment="Center" VerticalAlignment="Center" Width="40" Height="40"/>
    15                                 <TextBlock x:Name="Content" Text="{TemplateBinding Header}"  Foreground="White" FontSize="14" FontFamily="{StaticResource FontFamily}"
    16                             HorizontalAlignment="Center"  Margin="0,5,0,0"
    17                             VerticalAlignment="Center" ></TextBlock>
    18                             </StackPanel>
    19                         </Border>
    20                     </Grid>
    21                     <ControlTemplate.Triggers>
    22                         <Trigger Property="IsSelected" Value="true">
    23                             <Setter Property="Background" TargetName="back">
    24                                 <Setter.Value>
    25                                     <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
    26                                         <GradientStopCollection>
    27                                             <GradientStop Offset="0" Color="Transparent"  />
    28                                             <GradientStop Offset="1" Color="#33000000"  />
    29                                         </GradientStopCollection>
    30                                     </LinearGradientBrush>
    31                                 </Setter.Value>
    32                             </Setter>
    33                         </Trigger>
    34                     </ControlTemplate.Triggers>
    35                 </ControlTemplate>
    36             </Setter.Value>
    37         </Setter>
    38         <Setter Property="ContentTemplate">
    39             <Setter.Value>
    40                 <DataTemplate>
    41                     <ContentPresenter  Margin="0,0,0,0"  Content="{TemplateBinding Content}"  >
    42                     </ContentPresenter>
    43                 </DataTemplate>
    44             </Setter.Value>
    45         </Setter>
    46     </Style>
    View Code

    2.按钮(自定义Button)

     1  <Style x:Key="Button360" TargetType="Button">
     2         <Setter Property="Width" Value="200"></Setter>
     3         <Setter Property="FontSize" Value="25"></Setter>
     4         <Setter Property="Height" Value="60"></Setter>
     5         <Setter Property="Foreground" Value="White"></Setter>
     6         <Setter Property="Template" >
     7             <Setter.Value>
     8                 <ControlTemplate TargetType="Button">
     9                     <Border Background="{StaticResource MainColor}" x:Name="back" CornerRadius="30">
    10                         <Border x:Name="for"  CornerRadius="30">
    11                             <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"></ContentPresenter>
    12                         </Border>
    13                     </Border>
    14                     <ControlTemplate.Triggers>
    15                         <Trigger Property="IsMouseOver" Value="true">
    16                             <Setter Property="Background" TargetName="for" Value="#33000000"></Setter>
    17                         </Trigger>
    18                         <Trigger Property="IsPressed" Value="True">
    19                             <Setter Property="Width" TargetName="back" Value="199"></Setter>
    20                             <Setter Property="Height" TargetName="back" Value="59"></Setter>
    21                         </Trigger>
    22                     </ControlTemplate.Triggers>
    23                 </ControlTemplate>
    24             </Setter.Value>
    25         </Setter>
    26     </Style>    
    View Code

    3.图片按钮(自定义Button)

     1 <Style x:Key="ImageButton" TargetType="Button">
     2         <Setter Property="Width" Value="60"></Setter>
     3         <Setter Property="FontSize" Value="12"></Setter>
     4         <Setter Property="Height" Value="60"></Setter>
     5         <Setter Property="Foreground" Value="#FF888888"></Setter>
     6         <Setter Property="Template" >
     7             <Setter.Value>
     8                 <ControlTemplate TargetType="Button">
     9                     <Border x:Name="back" CornerRadius="0" Background="Transparent">
    10                         <StackPanel HorizontalAlignment="Center" VerticalAlignment="Center" >
    11                             <Image Source="{TemplateBinding Tag}" x:Name="icon" HorizontalAlignment="Center" VerticalAlignment="Center" Width="35" Height="35"/>
    12                             <ContentPresenter></ContentPresenter>
    13                         </StackPanel>
    14                     </Border>
    15                     <ControlTemplate.Triggers>
    16                         <Trigger Property="IsMouseOver" Value="true">
    17                             <Setter Property="Background" TargetName="back" Value="#33000000"></Setter>
    18                         </Trigger>
    19                         <Trigger Property="IsPressed" Value="True">
    20                             <Setter Property="Width" TargetName="icon" Value="34"></Setter>
    21                             <Setter Property="Height" TargetName="icon" Value="34"></Setter>
    22                         </Trigger>
    23                     </ControlTemplate.Triggers>
    24                 </ControlTemplate>
    25             </Setter.Value>
    26         </Setter>
    27     </Style>
    View Code

    以上就是界面核心控件的样式了

    另外,球的水波动态是真做不来,求指教。。。

    源码:

    https://pan.baidu.com/s/1yBNYuZTSTLiAm7ObEb1_ig

    密码: sizk

  • 相关阅读:
    loj 1257 (求树上每一个点到树上另一个点的最长距离)
    loj 1032 数位dp
    loj 1030概率dp
    loj1011 状态压缩
    java大数取模
    求阶乘的位数
    loj 1426(dfs + bfs)
    携程greenlet模块使用
    如何让socket编程非阻塞?
    分别用request和socket给百多发送请求
  • 原文地址:https://www.cnblogs.com/xytx/p/9239312.html
Copyright © 2011-2022 走看看