【.Net码农】WPF界面—仿360安全卫士9.0界面

Biegral 2018/11/4 23:41:18 2892

http://blog.csdn.net/ljf5566/article/details/8758922


主要思路如下：

该界面主要有三大部分

第一部分：标题栏部分就是最上面那一行

第二部分：内容区域(也就是页标签部分)

第三部分：换肤部分(点击换肤小按钮弹出的内容部分)

根据分析我们可以使用一个有两行的网格(Grid)进行布局，第一行“标题栏”部分；第二行“页标签部分”,对于“换肤部分”是直接显示在当前界面之上的内容，使用"Popup"标签实现。

代码很长，我只粘贴部分代码，随后将上传至资源区


1、定义无边框窗体样式和Button样式

  1. <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"  
  2.                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">  
  3.     <!--无边框的窗体样式-->  
  4.     <Style x:Key="NoResize_window" TargetType="{x:Type Window}">  
  5.         <Setter Property="AllowsTransparency" Value="true"/>  
  6.         <Setter Property="Background" Value="Transparent"/>  
  7.         <!-- <Setter Property="ResizeMode" Value="CanResizeWithGrip"/>-->  
  8.         <Setter Property="WindowStyle" Value="None"/>  
  9.         <Setter Property="Template">  
  10.             <Setter.Value>  
  11.                 <ControlTemplate TargetType="{x:Type Window}">  
  12.                     <Grid Margin="5">  
  13.                         <Rectangle Fill="{DynamicResource {x:Static SystemColors.WindowBrushKey}}"    >  
  14.                             <Rectangle.Effect>  
  15.                                 <DropShadowEffect BlurRadius="5" ShadowDepth="0"/>  
  16.                             </Rectangle.Effect>  
  17.                         </Rectangle>  
  18.                         <Border Background="{TemplateBinding Background}"      
  19.                         BorderBrush="{TemplateBinding BorderBrush}"      
  20.                         BorderThickness="{TemplateBinding BorderThickness}"      
  21.                         Padding="{TemplateBinding Margin}"      
  22.                         SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}">  
  23.                             <ContentPresenter />  
  24.                         </Border>  
  25.                     </Grid>  
  26.                 </ControlTemplate>  
  27.             </Setter.Value>  
  28.         </Setter>  
  29.     </Style>  
  30.     <!--Button样式-->  
  31.     <Style x:Key="ButtonStyle1" TargetType="{x:Type Button}">  
  32.         <Setter Property="Template">  
  33.             <Setter.Value>  
  34.                 <ControlTemplate TargetType="{x:Type Button}">  
  35.                     <Grid>  
  36.                         <VisualStateManager.VisualStateGroups>  
  37.                             <VisualStateGroup x:Name="CommonStates">  
  38.                                 <VisualState x:Name="MouseOver"/>  
  39.                                 <VisualState x:Name="Pressed"/>  
  40.                                 <VisualState x:Name="Disabled"/>  
  41.                             </VisualStateGroup>  
  42.                             <VisualStateGroup x:Name="FocusStates">  
  43.                                 <VisualState x:Name="Focused"/>  
  44.                             </VisualStateGroup>  
  45.                             <VisualStateGroup x:Name="ValidationStates">  
  46.                                 <VisualState x:Name="InvalidFocused"/>  
  47.                                 <VisualState x:Name="InvalidUnfocused"/>  
  48.                             </VisualStateGroup>  
  49.                         </VisualStateManager.VisualStateGroups>  
  50.                         <Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Margin="5">  
  51.                             <Border.Effect>  
  52.                                 <DropShadowEffect ShadowDepth="0" Opacity="0.85"/>  
  53.                             </Border.Effect>  
  54.                         </Border>  
  55.                         <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Content="{TemplateBinding Content}"/>  
  56.                     </Grid>  
  57.                     <ControlTemplate.Triggers>  
  58.                         <Trigger Property="IsFocused" Value="True"/>  
  59.                         <Trigger Property="IsDefaulted" Value="True"/>  
  60.                         <Trigger Property="IsMouseOver" Value="True">  
  61.                             <Setter Property="Effect" TargetName="border">  
  62.                                 <Setter.Value>  
  63.                                     <DropShadowEffect Color="#FF00F3FF" Opacity="0.85" ShadowDepth="0"/>  
  64.                                 </Setter.Value>  
  65.                             </Setter>  
  66.                         </Trigger>  
  67.                         <Trigger Property="IsPressed" Value="True"/>  
  68.                         <Trigger Property="IsEnabled" Value="False"/>  
  69.                     </ControlTemplate.Triggers>  
  70.                 </ControlTemplate>  
  71.             </Setter.Value>  
  72.         </Setter>  
  73.     </Style>  
  74.     <!-- Resource dictionary entries should be defined here. -->  
  75. </ResourceDictionary>  


2、逻辑处理代码

  1. using System;  
  2. using System.Windows;  
  3. using System.Windows.Controls;  
  4. using System.Windows.Media;  
  5. using System.Xml;  
  6.   
  7. namespace _360UI9  
  8. {  
  9.     /// <summary>  
  10.     /// MainWindow.xaml 的交互逻辑  
  11.     /// </summary>  
  12.     public partial class MainWindow : Window  
  13.     {  
  14.         public MainWindow()  
  15.         {  
  16.             InitializeComponent();  
  17.             this.Loaded += MainWindow_Loaded;  
  18.         }  
  19.   
  20.         void MainWindow_Loaded(object sender, RoutedEventArgs e)  
  21.         {  
  22.             //窗体加载的时候获取保存的皮肤  
  23.             XmlDocument doc = new XmlDocument();  
  24.             string xmlpath = AppDomain.CurrentDomain.SetupInformation.ApplicationBase + "skin.xml";  
  25.             doc.Load(xmlpath);  
  26.             XmlNode xnode = doc.SelectSingleNode("bd");  
  27.             XmlElement xe = (XmlElement)xnode["skin"];  
  28.             skinbrush.Background = App.Current.FindResource(xe.GetAttribute("name")) as Brush;  
  29.         }  
  30.         //换肤  
  31.         private void btnChangeSkin_Click(object sender, RoutedEventArgs e)  
  32.         {  
  33.             //显示换肤界面  
  34.             skinui.IsOpen = true;  
  35.         }  
  36.         //反馈  
  37.         private void btnFeedback_Click(object sender, RoutedEventArgs e)  
  38.         {  
  39.   
  40.         }  
  41.         //最小化  
  42.         private void btnMin_Click(object sender, RoutedEventArgs e)  
  43.         {  
  44.             this.WindowState = System.Windows.WindowState.Minimized;  
  45.         }  
  46.         //主菜单  
  47.         private void btnMainMenu_Click(object sender, RoutedEventArgs e)  
  48.         {  
  49.   
  50.         }  
  51.         //最大化  
  52.         private void btnMax_Click(object sender, RoutedEventArgs e)  
  53.         {  
  54.             if (this.WindowState != System.Windows.WindowState.Maximized)  
  55.             {  
  56.                 this.WindowState = System.Windows.WindowState.Maximized;  
  57.             }  
  58.             else  
  59.             {  
  60.                 this.WindowState = System.Windows.WindowState.Normal;  
  61.             }  
  62.         }  
  63.         //关闭  
  64.         private void btnClose_Click(object sender, RoutedEventArgs e)  
  65.         {  
  66.             this.Close();  
  67.         }  
  68.         //实现换肤  
  69.         private void ChangeSkin(object sender, RoutedEventArgs e)  
  70.         {  
  71.             Button bt = (Button)sender;  
  72.             skinbrush.Background = App.Current.FindResource(bt.Name) as Brush;  
  73.             //将选择的皮肤保存到XML文件  
  74.             XmlDocument doc = new XmlDocument();  
  75.             string xmlpath = AppDomain.CurrentDomain.SetupInformation.ApplicationBase + "skin.xml";  
  76.             doc.Load(xmlpath);  
  77.             XmlNode xnode = doc.SelectSingleNode("bd");  
  78.             XmlElement xe = (XmlElement)xnode["skin"];  
  79.             xe.SetAttribute("name", bt.Name);  
  80.             doc.Save(AppDomain.CurrentDomain.SetupInformation.ApplicationBase + "skin.xml");  
  81.         }  
  82.     }  
  83. }  

效果如下:



源代码下载：点击打开链接


本文转载:CSDN博客

阅读排行

分类

归档