WPF实现类似360安全卫士界面的程序源码分享

下面通过图文并茂的方式给大家介绍WPF实现类似360安全卫士界面的程序源码分享,点击此处下载源码哦。

以前学习Windows Form编程的时候,总感觉自己做的界面很丑,看到360安全卫士、迅雷等软件的UI设计都非常美观,心里总是憧憬着要是自己能实现这样的UI效果该多好!!!另一个困扰我的问题是,这个UI皮肤是如何用技术实现的呢?!虽然好多年过去了,但心里的憧憬和疑惑一直没有消失,而且越来越强烈。在日常的工作和学习中,自己在网上也经常留意类似的技术或者文章。最近在学习WPF的过程中,看到网上也有仿360和仿迅雷UI设计的资源,通过对资源的学习和自己的动手实践,终于实现了下面的仿360安全卫士界面:

由于项目文件比较多,这里罗列出核心的过程和代码:

1、VS解决方案结构:

WpfPageTransitions是一个WPF类库,实现UI页面切换动画效果,支持多种动画,可以通过TransitionType属性进行设置,其原理是定义了多个切换动画类型的Storyboard,程序根据配置的TransitionType去执行匹配的Storyboard动画(分出入动画,xxxxxxIn和xxxxxxOut)。360UI是一个WPF 桌面应用程序,styles文件夹下存放了定义的按钮样式、菜单项样式、页签样式等样式和需要的所有UI切图资源。pages文件夹下存放切换的详细子页面。

(备注:图片资源和部分文件来自互联网,特别感谢KXFang360项目提供的360整套配图和布局文件)

2、页面切换控件核心代码:

<UserControl x:Class="WpfPageTransitions.PageTransition"
    xmlns="http://schemas.microsoft.com/winfx//xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx//xaml"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/"
    xmlns:d="http://schemas.microsoft.com/expression/blend/"
    xmlns:local="clr-namespace:WpfPageTransitions"
    mc:Ignorable="d"
    d:DesignHeight="" d:DesignWidth="">
  <UserControl.Resources>
   <Style TargetType="{x:Type ContentPresenter}">
    <Setter Property="LayoutTransform">
     <Setter.Value>
      <ScaleTransform />
     </Setter.Value>
    </Setter>
   </Style>
   <local:CenterConverter x:Key="centerConverter"/>
   <!-- Slide and Fade -->
   <Storyboard x:Key="SlideAndFadeIn" >
    <ThicknessAnimation Duration="::." Storyboard.TargetProperty="Margin" From=",,-," To="" DecelerationRatio="." />
    <DoubleAnimation Duration="::." Storyboard.TargetProperty="Opacity" From="" To="" />
   </Storyboard>
   <Storyboard x:Key="SlideAndFadeOut">
    <ThicknessAnimation Duration="::." Storyboard.TargetProperty="Margin" To="-,,," AccelerationRatio="."/>
    <DoubleAnimation Duration="::." Storyboard.TargetProperty="Opacity" To="" />
   </Storyboard>
   <!-- Fade -->
   <Storyboard x:Key="FadeIn" >
    <DoubleAnimation Duration="::." Storyboard.TargetProperty="Opacity" From="" To="" />
   </Storyboard>
   <Storyboard x:Key="FadeOut">
    <DoubleAnimation Duration="::." Storyboard.TargetProperty="Opacity" To="" />
   </Storyboard>
   <!-- Slide -->
   <Storyboard x:Key="SlideIn" >
    <ThicknessAnimation Duration="::." Storyboard.TargetProperty="Margin" From=",,-," To="" DecelerationRatio="." />
   </Storyboard>
   <Storyboard x:Key="SlideOut">
    <ThicknessAnimation Duration="::." Storyboard.TargetProperty="Margin" To="-,,," AccelerationRatio="."/>
   </Storyboard>
   <!-- Grow -->
   <Storyboard x:Key="GrowIn" >
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(ScaleTransform.ScaleX)" From="" To="" Duration="::." DecelerationRatio="." />
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(ScaleTransform.ScaleY)" From="" To="" Duration="::." DecelerationRatio="." />
   </Storyboard>
   <Storyboard x:Key="GrowOut">
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(ScaleTransform.ScaleX)" To="" Duration="::." AccelerationRatio="." />
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(ScaleTransform.ScaleY)" To="" Duration="::." AccelerationRatio="." />
   </Storyboard>
   <!-- Grow and Fade -->
   <Storyboard x:Key="GrowAndFadeIn" >
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(ScaleTransform.ScaleX)" From="" To="" Duration="::." DecelerationRatio="." />
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(ScaleTransform.ScaleY)" From="" To="" Duration="::." DecelerationRatio="." />
    <DoubleAnimation Duration="::." Storyboard.TargetProperty="Opacity" From="" To="" />
   </Storyboard>
   <Storyboard x:Key="GrowAndFadeOut">
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(ScaleTransform.ScaleX)" To="" Duration="::." AccelerationRatio="." />
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(ScaleTransform.ScaleY)" To="" Duration="::." AccelerationRatio="." />
    <DoubleAnimation Duration="::." Storyboard.TargetProperty="Opacity" To="" />
   </Storyboard>
   <!-- Flip -->
   <Storyboard x:Key="FlipIn" >
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(SkewTransform.AngleX)" From="-" To="" Duration="::." DecelerationRatio="." />
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(SkewTransform.AngleY)" From="-" To="" Duration="::." DecelerationRatio="." />
   </Storyboard>
   <Storyboard x:Key="FlipOut">
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(SkewTransform.AngleX)" To="" Duration="::." AccelerationRatio="." />
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(SkewTransform.AngleY)" To="" Duration="::." AccelerationRatio="." />
   </Storyboard>
   <!-- Flip and Fade -->
   <Storyboard x:Key="FlipAndFadeIn" >
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(SkewTransform.AngleX)" From="-" To="" Duration="::." DecelerationRatio="." />
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(SkewTransform.AngleY)" From="-" To="" Duration="::." DecelerationRatio="." />
    <DoubleAnimation Duration="::." Storyboard.TargetProperty="Opacity" From="" To="" />
   </Storyboard>
   <Storyboard x:Key="FlipAndFadeOut">
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(SkewTransform.AngleX)" To="" Duration="::." AccelerationRatio="." />
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(SkewTransform.AngleY)" To="" Duration="::." AccelerationRatio="." />
    <DoubleAnimation Duration="::." Storyboard.TargetProperty="Opacity" To="" />
   </Storyboard>
   <!-- Spin -->
   <Storyboard x:Key="SpinIn" >
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(RotateTransform.Angle)" From="-" To="" Duration="::." DecelerationRatio="." />
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(ScaleTransform.ScaleX)" From="" To="" Duration="::." DecelerationRatio="." />
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(ScaleTransform.ScaleY)" From="" To="" Duration="::." DecelerationRatio="." />
   </Storyboard>
   <Storyboard x:Key="SpinOut">
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(RotateTransform.Angle)" To="" Duration="::." AccelerationRatio="." />
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(ScaleTransform.ScaleX)" To="" Duration="::." AccelerationRatio="." />
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(ScaleTransform.ScaleY)" To="" Duration="::." AccelerationRatio="." />
   </Storyboard>
   <!-- Spin and Fade -->
   <Storyboard x:Key="SpinAndFadeIn" >
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(RotateTransform.Angle)" From="-" To="" Duration="::." DecelerationRatio="." />
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(ScaleTransform.ScaleX)" From="" To="" Duration="::." DecelerationRatio="." />
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(ScaleTransform.ScaleY)" From="" To="" Duration="::." DecelerationRatio="." />
    <DoubleAnimation Duration="::." Storyboard.TargetProperty="Opacity" From="" To="" />
   </Storyboard>
   <Storyboard x:Key="SpinAndFadeOut">
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(RotateTransform.Angle)" To="" Duration="::." AccelerationRatio="." />
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(ScaleTransform.ScaleX)" To="" Duration="::." AccelerationRatio="." />
    <DoubleAnimation Storyboard.TargetProperty="(RenderTransform).(TransformGroup.Children)[].(ScaleTransform.ScaleY)" To="" Duration="::." AccelerationRatio="." />
    <DoubleAnimation Duration="::." Storyboard.TargetProperty="Opacity" To="" />
   </Storyboard>
  </UserControl.Resources>
  <Grid Name="page">
   <ContentControl Name="contentPresenter" >
    <ContentControl.RenderTransform>
     <TransformGroup>
      <ScaleTransform ScaleX="" ScaleY=""
          CenterX="{Binding RelativeSource={RelativeSource AncestorType=Grid, Mode=FindAncestor}, Path=ActualWidth, Converter={StaticResource centerConverter}}"
          CenterY="{Binding RelativeSource={RelativeSource AncestorType=Grid, Mode=FindAncestor}, Path=ActualHeight, Converter={StaticResource centerConverter}}" />
      <SkewTransform AngleX="" AngleY=""
         CenterX="{Binding RelativeSource={RelativeSource AncestorType=Grid, Mode=FindAncestor}, Path=ActualWidth, Converter={StaticResource centerConverter}}"
         CenterY="{Binding RelativeSource={RelativeSource AncestorType=Grid, Mode=FindAncestor}, Path=ActualHeight, Converter={StaticResource centerConverter}}" />
      <RotateTransform Angle=""
          CenterX="{Binding RelativeSource={RelativeSource AncestorType=Grid, Mode=FindAncestor}, Path=ActualWidth, Converter={StaticResource centerConverter}}"
          CenterY="{Binding RelativeSource={RelativeSource AncestorType=Grid, Mode=FindAncestor}, Path=ActualHeight, Converter={StaticResource centerConverter}}" />
      <TranslateTransform X="" Y="" />
     </TransformGroup>
    </ContentControl.RenderTransform>
   </ContentControl>
  </Grid>
 </UserControl>

 using System;
 using System.Collections.Generic;
 using System.Linq;
 using System.Text;
 using System.Windows;
 using System.Windows.Controls;
 using System.Windows.Data;
 using System.Windows.Documents;
 using System.Windows.Input;
 using System.Windows.Media;
 using System.Windows.Media.Imaging;
 using System.Windows.Navigation;
 using System.Windows.Shapes;
 using System.Threading.Tasks;
 using System.Windows.Media.Animation;
 namespace WpfPageTransitions
 {
  public partial class PageTransition : UserControl
  {
   Stack<UserControl> pages = new Stack<UserControl>();
   public UserControl CurrentPage { get; set; }
   public static readonly DependencyProperty TransitionTypeProperty = DependencyProperty.Register("TransitionType",
    typeof(PageTransitionType),
    typeof(PageTransition), new PropertyMetadata(PageTransitionType.SlideAndFade));
   public PageTransitionType TransitionType
   {
    get
    {
     return (PageTransitionType)GetValue(TransitionTypeProperty);
    }
    set
    {
     SetValue(TransitionTypeProperty, value);
    }
   }
   public PageTransition()
   {
    InitializeComponent();
   }
   public void ShowPage(UserControl newPage)
   {
    pages.Push(newPage);
    Task.Factory.StartNew(() => ShowNewPage());
   }
   void ShowNewPage()
   {
    Dispatcher.Invoke((Action)delegate
     {
      if (contentPresenter.Content != null)
      {
       UserControl oldPage = contentPresenter.Content as UserControl;
       if (oldPage != null)
       {
        oldPage.Loaded -= newPage_Loaded;
        UnloadPage(oldPage);
       }
      }
      else
      {
       ShowNextPage();
      }
     });
   }
   void ShowNextPage()
   {
    UserControl newPage = pages.Pop();
    newPage.Loaded += newPage_Loaded;
    contentPresenter.Content = newPage;
   }
   void UnloadPage(UserControl page)
   {
    Storyboard hidePage = (Resources[string.Format("{}Out", TransitionType.ToString())] as Storyboard).Clone();
    hidePage.Completed += hidePage_Completed;
    hidePage.Begin(contentPresenter);
   }
   void newPage_Loaded(object sender, RoutedEventArgs e)
   {
    Storyboard showNewPage = Resources[string.Format("{}In", TransitionType.ToString())] as Storyboard;
    showNewPage.Begin(contentPresenter);
    CurrentPage = sender as UserControl;
   }
   void hidePage_Completed(object sender, EventArgs e)
   {
    contentPresenter.Content = null;
    ShowNextPage();
   }
  }
 }

3、Like360Main核心代码为:

其中AllowsTransparency="True" WindowStyle="None" Background="{x:Null}"的目的是让WPF窗体隐藏默认的边框,这样可以允许用背景图片填充WPF定义窗体外观。在这区间可以自定义关闭、最小化和最大化按钮等。

MouseLeftButtonDown="Window_MouseLeftButtonDown" 目的是为了支持窗体拖动。FontFamily="SimSun"  TextOptions.TextFormattingMode="Display"的目的是为了解决WPF中文字体显示模糊的问题。

 <Window x:Class="_UI.LikeMain"
   xmlns="http://schemas.microsoft.com/winfx//xaml/presentation"
   xmlns:x="http://schemas.microsoft.com/winfx//xaml"
   Title="LikeMain" Height="" Width=""
   FontFamily="SimSun"
   AllowsTransparency="True" WindowStyle="None"
   xmlns:pageTransitions="clr-namespace:WpfPageTransitions;assembly=WpfPageTransitions"
   Background="{x:Null}" MouseLeftButtonDown="Window_MouseLeftButtonDown" TextOptions.TextFormattingMode="Display" >
  <Window.Resources>
   <LinearGradientBrush x:Key="MyBrush" EndPoint=".," StartPoint=".,">
    <GradientStop Color="#CFFFFFFF"/>
    <GradientStop Color="#FFEBDD" Offset=""/>
   </LinearGradientBrush>
  </Window.Resources>
  <Border BorderBrush="Black" BorderThickness="" CornerRadius="" Margin="">
   <Border.Effect>
    <DropShadowEffect ShadowDepth="" Opacity="."/>
   </Border.Effect>
   <Border.Background>
    <ImageBrush ImageSource="styles/skin/frame.jpg"/>
   </Border.Background>
   <Grid>
    <Grid.RowDefinitions>
     <RowDefinition Height="."/>
     <RowDefinition Height="."/>
     <RowDefinition/>
     <RowDefinition Height="."/>
    </Grid.RowDefinitions>
    <!--上标题栏-->
    <Label Content="安全卫士界面" HorizontalAlignment="Left" Width="." Foreground="#AEFF" FontWeight="Bold" TextOptions.TextFormattingMode="Display"/>
    <Rectangle Margin="" Stroke="Black" HorizontalAlignment="Right" Width="." Grid.Row="" StrokeThickness="">
     <Rectangle.Fill>
      <ImageBrush ImageSource="styles/skin/logo.png" Stretch="Uniform"/>
     </Rectangle.Fill>
    </Rectangle>
    <Button Content="x" HorizontalAlignment="Right" Margin=",,.," Style="{DynamicResource SysButtonStyle}" Width="." Name="closeButton" Click="closeButton_Click" />
    <Button Content="max" HorizontalAlignment="Right" Margin=",,.," Style="{DynamicResource MaxButtonStyle}" Width="." Name="maxButton" Click="maxButton_Click">
     <Button.Background>
      <ImageBrush ImageSource="styles/skin/Button/MAX.png" Stretch="Uniform"/>
     </Button.Background>
    </Button>
    <Button Content="mni" HorizontalAlignment="Right" Margin=",,.," Style="{DynamicResource MaxButtonStyle}" Width="." Name="mniButton" Click="mniButton_Click">
     <Button.Background>
      <ImageBrush ImageSource="styles/skin/Button/MNI.png" Stretch="Uniform"/>
     </Button.Background>
    </Button>
    <Button x:Name="menuButton" HorizontalAlignment="Right" Margin=",,.," Style="{DynamicResource MButtonStyle}" Width="." Click="menuButton_Click">
     <Button.Background>
      <ImageBrush ImageSource="styles/skin/Button/M.png" Stretch="Uniform"/>
     </Button.Background>
    </Button>
    <Popup x:Name="Menu" AllowsTransparency="True" Margin=",-,," PlacementTarget="{Binding ElementName=menuButton}" StaysOpen="False" PopupAnimation="Scroll">
     <Grid Height="." Width="" Margin="" HorizontalAlignment="Left">
      <Border BorderThickness="" CornerRadius="" Background="#FFEFEFEF" Margin="">
       <Border.Effect>
        <DropShadowEffect ShadowDepth="" Opacity="."/>
       </Border.Effect>
       <StackPanel Margin=",">
        <MenuItem Header="设 置" Style="{DynamicResource MenuItemStyle}"/>
        <MenuItem Header="更 新"/>
        <MenuItem Header="关 于"/>
        <MenuItem Header="退 出"/>
       </StackPanel>
      </Border>
     </Grid>
    </Popup>
    <Rectangle Stroke="Black" StrokeThickness="" Width="" Margin=",,.,." HorizontalAlignment="Right" Height="">
     <Rectangle.Fill>
      <LinearGradientBrush EndPoint=".," StartPoint=".,">
       <GradientStop Color="#"/>
       <GradientStop Offset="" Color="#ADDD"/>
      </LinearGradientBrush>
     </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black" StrokeThickness="" Width="" Margin=",,.,." HorizontalAlignment="Right" Height="">
     <Rectangle.Fill>
      <LinearGradientBrush EndPoint=".," StartPoint=".,">
       <GradientStop Color="#"/>
       <GradientStop Offset="" Color="#ADDD"/>
      </LinearGradientBrush>
     </Rectangle.Fill>
    </Rectangle>
    <Rectangle Stroke="Black" StrokeThickness="" Width="" Margin=",,.,." HorizontalAlignment="Right" Height="">
     <Rectangle.Fill>
      <LinearGradientBrush EndPoint=".," StartPoint=".,">
       <GradientStop Color="#"/>
       <GradientStop Offset="" Color="#ADDD"/>
      </LinearGradientBrush>
     </Rectangle.Fill>
    </Rectangle>
    <Rectangle Height="" Margin=",,.," Stroke="Black" StrokeThickness="" VerticalAlignment="Top">
     <Rectangle.Fill>
      <LinearGradientBrush EndPoint=".," StartPoint=".,">
       <GradientStop Color="#FFFFFF"/>
       <GradientStop Offset="" Color="#ADDD"/>
      </LinearGradientBrush>
     </Rectangle.Fill>
    </Rectangle>
    <!--上导航栏-->
    <TabControl Name="tab" Grid.RowSpan="" Margin="" Style="{DynamicResource TabControlStyle}" Grid.Row="" Background="{x:Null}" SelectionChanged="TabControl_SelectionChanged">
      <TabItem Header="电脑体验" Height="" Margin=",,," Width="" Style="{DynamicResource TabItemStyle}" TextOptions.TextFormattingMode="Display">
      <TabItem.Background>
       <ImageBrush ImageSource="styles/skin/ico/ico_Examine.png"/>
      </TabItem.Background>
      <Grid Margin="" Background="{DynamicResource MyBrush}">
       <Grid.ColumnDefinitions>
        <ColumnDefinition Width=".*"/>
        <ColumnDefinition Width=".*"/>
        <ColumnDefinition Width=".*"/>
       </Grid.ColumnDefinitions>
       <Grid.RowDefinitions>
        <RowDefinition Height="."/>
        <RowDefinition Height="."/>
        <RowDefinition Height="."/>
        <RowDefinition Height="."/>
       </Grid.RowDefinitions>
       <!--详细-->
       <Label Content="电脑体检" HorizontalAlignment="Left" Margin="" Width="." Height="" FontSize="." FontWeight="Bold" Grid.Column="" Grid.Row="" Grid.ColumnSpan="" />
       <pageTransitions:PageTransition Name="pTransitionControl_" Margin="" TransitionType="SlideAndFade" Grid.Column="" Grid.Row="" Grid.ColumnSpan="" Grid.RowSpan=""/>
      </Grid>
     </TabItem>
     <TabItem Header="查杀木马" Height="" Margin=",,," Width="" Style="{DynamicResource TabItemStyle}">
      <TabItem.Background>
       <ImageBrush ImageSource="styles/skin/ico/ico_dsmain.png"/>
      </TabItem.Background>
      <Grid Margin="" Background="{DynamicResource MyBrush}">
       <Grid.ColumnDefinitions>
        <ColumnDefinition Width=".*"/>
        <ColumnDefinition Width=".*"/>
        <ColumnDefinition Width=".*"/>
       </Grid.ColumnDefinitions>
       <Grid.RowDefinitions>
        <RowDefinition Height="."/>
        <RowDefinition Height="."/>
        <RowDefinition Height="."/>
        <RowDefinition Height="."/>
       </Grid.RowDefinitions>
       <!--详细-->
       <Label Content="查杀木马" HorizontalAlignment="Left" Margin="" Width="." Height="" FontSize="." FontWeight="Bold" Grid.Column="" Grid.Row="" Grid.ColumnSpan="" />
       <pageTransitions:PageTransition Name="pTransitionControl_" Margin="" TransitionType="SlideAndFade" Grid.Column="" Grid.Row="" Grid.ColumnSpan="" Grid.RowSpan=""/>
      </Grid>
     </TabItem>
     <TabItem Header="清理插件" Height="" Margin=",,," Width="" Style="{DynamicResource TabItemStyle}">
      <TabItem.Background>
       <ImageBrush ImageSource="styles/skin/ico/ico_PluginCleaner.png"/>
      </TabItem.Background>
      <Grid Margin="" Background="{DynamicResource MyBrush}">
       <Grid.ColumnDefinitions>
        <ColumnDefinition Width=".*"/>
        <ColumnDefinition Width=".*"/>
        <ColumnDefinition Width=".*"/>
       </Grid.ColumnDefinitions>
       <Grid.RowDefinitions>
        <RowDefinition Height="."/>
        <RowDefinition Height="."/>
        <RowDefinition Height="."/>
        <RowDefinition Height="."/>
       </Grid.RowDefinitions>
       <!--详细-->
       <Label Content="清理插件" HorizontalAlignment="Left" Margin="" Width="." Height="" FontSize="." FontWeight="Bold" Grid.Column="" Grid.Row="" Grid.ColumnSpan="" />
       <pageTransitions:PageTransition Name="pTransitionControl_" Margin="" TransitionType="SlideAndFade" Grid.Column="" Grid.Row="" Grid.ColumnSpan="" Grid.RowSpan=""/>
      </Grid>
     </TabItem>
     <TabItem Header="修复漏洞" Height="" Margin=",,," Width="" Style="{DynamicResource TabItemStyle}">
      <TabItem.Background>
       <ImageBrush ImageSource="styles/skin/ico/ico_VulRepair.png"/>
      </TabItem.Background>
      <Grid Background="{DynamicResource MyBrush}"/>
     </TabItem>
     <TabItem Header="清理垃圾" Height="" Margin=",,," Width="" Style="{DynamicResource TabItemStyle}">
      <TabItem.Background>
       <ImageBrush ImageSource="styles/skin/ico/ico_RubbishCleaner.png"/>
      </TabItem.Background>
      <Grid Background="{DynamicResource MyBrush}"/>
     </TabItem>
     <TabItem Header="清理痕迹" Height="" Margin=",,," Width="" Style="{DynamicResource TabItemStyle}">
      <TabItem.Background>
       <ImageBrush ImageSource="styles/skin/ico/ico_TraceCleaner.png"/>
      </TabItem.Background>
      <Grid Background="{DynamicResource MyBrush}"/>
     </TabItem>
     <TabItem Header="系统修复" Height="" Margin=",,," Width="" Style="{DynamicResource TabItemStyle}">
      <TabItem.Background>
       <ImageBrush ImageSource="styles/skin/ico/ico_SysRepair.png"/>
      </TabItem.Background>
      <Grid Background="{DynamicResource MyBrush}"/>
     </TabItem>
     <TabItem Header="功能大全" Height="" Margin=",,," Width="" Style="{DynamicResource TabItemStyle}">
      <TabItem.Background>
       <ImageBrush ImageSource="styles/skin/ico/ico_AdvTools.png"/>
      </TabItem.Background>
      <Grid Background="{DynamicResource MyBrush}"/>
     </TabItem>
     <TabItem Header="软件管家" Height="" Margin=",,," Width="" Style="{DynamicResource TabItemStyle}">
      <TabItem.Background>
       <ImageBrush ImageSource="styles/skin/ico/ico_softmgr.png"/>
      </TabItem.Background>
      <Grid Background="{DynamicResource MyBrush}"/>
     </TabItem>
    </TabControl>
    <!--导航详细-->
    <!--下状态栏-->
    <Label Content="欢迎使用仿系统" Margin="" Grid.Row="" Foreground="#AEFF" FontWeight="Bold" BorderThickness="" BorderBrush="White" HorizontalAlignment="Left" Width="." TextOptions.TextFormattingMode="Display" />
    <Label Content="已连接网络" Margin="" Grid.Row="" Foreground="#AEFF" FontWeight="Bold" BorderThickness="" BorderBrush="White" HorizontalAlignment="Right" Width="" TextOptions.TextFormattingMode="Display" />
   </Grid>
  </Border>
 </Window>

 using System;
 using System.Collections.Generic;
 using System.Linq;
 using System.Text;
 using System.Threading.Tasks;
 using System.Windows;
 using System.Windows.Controls;
 using System.Windows.Data;
 using System.Windows.Documents;
 using System.Windows.Input;
 using System.Windows.Media;
 using System.Windows.Media.Imaging;
 using System.Windows.Shapes;
 namespace _UI
 {
  /// <summary>
  /// LikeMain.xaml 的交互逻辑
  /// </summary>
  public partial class LikeMain : Window
  {
   public LikeMain()
   {
    InitializeComponent();
   }
   private void closeButton_Click(object sender, RoutedEventArgs e)
   {
    this.Close();
   }
   private void maxButton_Click(object sender, RoutedEventArgs e)
   {
    if (WindowState == WindowState.Normal)
     WindowState = WindowState.Maximized;
    else
     WindowState = WindowState.Normal;
   }
   private void mniButton_Click(object sender, RoutedEventArgs e)
   {
    this.WindowState = WindowState.Minimized;
   }
   private void menuButton_Click(object sender, RoutedEventArgs e)
   {
    Menu.IsOpen = true;
   }
   private void Window_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
   {
    //拖动
    this.DragMove();
   }
   private void TabControl_SelectionChanged(object sender, SelectionChangedEventArgs e)
   {
    int index = this.tab.SelectedIndex;
    if (index == )
    {
     //可以设置TransitionType WpfPage 来更改界面出入的动画效果
     //this.pTransitionControl_.TransitionType = WpfPageTransitions.PageTransitionType.SpinAndFade;
     pages.index newPage = new pages.index();
     this.pTransitionControl_.ShowPage(newPage);
    }
    else if (index == )
    {
     pages.scan newPage = new pages.scan();
     this.pTransitionControl_.ShowPage(newPage);
    }
    else if (index == )
    {
     pages.scan newPage = new pages.scan();
     this.pTransitionControl_.ShowPage(newPage);
    }
    else
    {
     pages.index newPage = new pages.index();
     this.pTransitionControl_.ShowPage(newPage);
    }
   }
  }
 }

当用户单击Tab页签时(切换事件),程序 用pages.index newPage = new pages.index();先实例化一个page子页面(实际继承UserControl),然后调用 this.pTransitionControl_1.ShowPage(newPage);将子页面进行加载(本质上是pTransitionControl_1.Content=newpage)。

4、运行代码,界面如下:

下面是360安全卫士界面截图,可对比一下,还是比较相似的。

(0)

相关推荐

  • WPF的ListView控件自定义布局用法实例

    本文实例讲述了WPF的ListView控件自定义布局用法.分享给大家供大家参考,具体如下: 概要: 以源码的形式贴出,免得忘记后,再到网上查资料.在VS2008+SP1环境下调试通过 引用的GrayscaleEffect模块,可根据参考资料<Grayscale Effect...>中的位置下载. 正文: 如何布局是在App.xaml中定义源码如下 <Application x:Class="CWebsSynAssistant.App" xmlns="http

  • 仿vs实现WPF好看的进度条

    为了界面友好,一般的操作时间较长时,都需要增加进度条提示.由于WPF自带的进度条其实不怎么好看,而且没啥视觉效果.后来,装VS2012时,发现安装过程中进度条效果不错,于是上网查了资料.学习了ModernUI(开源的),地址:https://github.com/firstfloorsoftware/mui. 后来,做了尝试写了个Demo,效果不错.另外,专门录制了tif文件,方便大家看到效果.废话不多说,先展示效果: 一.效果展示 A.VS2012安装界面图: B.个人尝试Demo效果图: 二

  • WPF弹出自定义窗口的方法

    本文实例讲述了WPF弹出自定义窗口的方法.分享给大家供大家参考,具体如下: 测试环境: [1]VS2010SP1 [2]WPF(.NET Framework 4)项目 内容简介 WPF工程如何弹出自定义窗口 第一步:自定义个窗口 为当前项目新添个Window项,XAML部份的代码略,下面是C#部份的代码. namespace WorkflowBuilder.MyWindows { /// <summary> /// Interaction logic for InputStringWindow

  • 超炫酷的WPF实现Loading控件效果

    Win8系统的Loading效果还是很不错的,网上也有人用CSS3等技术实现,研究了一下,并打算用WPF自定义一个Loading控件实现类似的效果,并可以让用户对Loading的颗粒(Particle)背景颜色进行自定义,话不多说,直接上代码: 1.用VS2012新建一个WPF的用户控件库项目WpfControlLibraryDemo,VS自动生成如下结构: 2.删除UserControl1.xaml,并新建一个Loading的CustomControl(不是UserControl),如下图所示

  • WPF实现时钟特效

    WPF在样式定义和UI动画上面相对于以前的技术有了不少的提升,下面给出WPF技术实现钟表的效果: 1.Visual Studio新建一个WPF应用程序,命名为WpfClock,新建一个images文件夹,并准备一个钟表的背景图片和程序图标素材. 2.编辑MainWindow.xaml文件,对UI进行定制,代码如下(指针都是用Rectangle实现的,当然可以用图片代替): using System; using System.Collections.Generic; using System.L

  • wpf将表中数据显示到datagrid示例

    a.在.xaml文件中拖入一个datagrid,然后添加列名,使用Binding="{Binding 数据库中的列名称}",如下:  复制代码 代码如下: <DataGrid AutoGenerateColumns="False" Height="438"HorizontalAlignment="Left" Margin="23,278,0,0" Name="dataGrid1" 

  • WPF绑定实例详解

    本文详细讲述了WPF绑定的用法,分享给大家供大家参考.具体用法分析如下: 1.WPF绑定使用的源属性必须是依赖项属性,这是因为依赖项属性具有内置的更改通知支持,元素绑定表达式使用了Xaml扩展标记,WPF绑定一个控件是使用Binding.ElementName,绑定非控件对象时使用Source,RelativeSource,DataContext属性(WPF特有,而非XAML),只能绑定对象的共有字段. 下边是部分Binding 属性名,完整列表参考 :http://msdn.microsoft

  • WPF实现渐变淡入淡出的登陆窗口效果

    本文实例讲述了WPF实现渐变淡入淡出的登陆窗口效果的方法.分享给大家供大家参考.具体实现方法如下: 1.实现原理 ① 利用UIElement.OpacityMask属性,用于改变对象区域的不透明度的画笔.可以使元素的特定区域透明或部分透明,从而实现比较新颖的效果. ② OpacityMask属性接受任何画刷,可利用LinearGradientBrush线性渐变画刷,通过对渐变画刷中各颜色点加以动画处理即可. 2.渐变淡入实现 渐变淡入效果,可通过事件触发器触发Loaded事件实现,所以可以仅用前

  • 在WPF中动态加载XAML中的控件实例代码

    本文实例讲述了在WPF中动态加载XAML中的控件的方法.分享给大家供大家参考,具体如下: using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.Windows; using System.Windows.Controls; using System.Windows.Data; using System.Windows.Documents; using S

  • WPF实现类似360安全卫士界面的程序源码分享

    下面通过图文并茂的方式给大家介绍WPF实现类似360安全卫士界面的程序源码分享,点击此处下载源码哦. 以前学习Windows Form编程的时候,总感觉自己做的界面很丑,看到360安全卫士.迅雷等软件的UI设计都非常美观,心里总是憧憬着要是自己能实现这样的UI效果该多好!!!另一个困扰我的问题是,这个UI皮肤是如何用技术实现的呢?!虽然好多年过去了,但心里的憧憬和疑惑一直没有消失,而且越来越强烈.在日常的工作和学习中,自己在网上也经常留意类似的技术或者文章.最近在学习WPF的过程中,看到网上也有

  • 实时获取股票数据的android app应用程序源码分享

    最近学习Android应用开发,不知道写一个什么样的程序来练练手,正好最近股票很火,就一个App来实时获取股票数据,取名为Mystock.使用开发工具Android Studio,需要从Android官网下载,下载地址:http://developer.android.com/sdk/index.html.不幸的是Android是Google公司的,任何和Google公司相关的在国内都无法直接访问,只能通过VPN访问. 下图为Android Studio打开一个工程的截图: 下面按步介绍Myst

  • jQuery实现的产品自动360度旋转展示特效源码分享

    这是一款基于jQuery实现的产品自动360度旋转展示特效代码,可以对产品进行360度旋转展示,更好的让顾客了解产品的全部外观细节. jQuery产品360度旋转展示代码,支持预加载,能够快速全面的的预览产品的图片,主要原理是利用多张图片按顺序播放实现,本段代码兼容目前最新的各类主流浏览器,是一款非常优秀的特效源码. 运行效果图:---------------------------------效果查看 源码下载----------------------------------- 为大家分享的

  • java中使用双向链表实现贪吃蛇程序源码分享

    使用双向链表实现贪吃蛇程序 1.链表节点定义: package snake; public class SnakeNode { private int x; private int y; private SnakeNode next; private SnakeNode ahead; public SnakeNode() { } public SnakeNode(int x, int y) { super(); this.x = x; this.y = y; } public int getX(

  • jQuery+AJAX实现遮罩层登录验证界面(附源码)

    JQuery遮罩层登录界面效果的实现,AJAX实现登录验证,文章尾有完整示例源码下载,欢迎大家学习研究. 操作系统:Windwos7 Ultimate 开发工具:Visual Studio 2010 数据库:Sql Server 2005 测试浏览器:IE8.FF3.6.8.Google Chrome (IE8中弹出登录层后会出现竖拉条,其他两种没有出现,那个竖拉条可以在JS中通过修改数值让其不出现,但是下面会出现白边,越来越觉得IE有点那个了......) 1.预览 1)登录前 2)点击登录显

  • C#关机小程序源码

    下面是运行的效果图 核心代码: 复制代码 代码如下: using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; using System.Drawing; using System.Linq; using System.Text; using System.Windows.Forms; /* * * 整理:张晓天 * Q Q:977602650 * 日期:2012

  • ActionScript 3.0中用XMLSocket与服务器通讯程序(源码)

    复制代码 代码如下: // // CXMLSocket.as // // // Written by Leezhm, 20th Oct, 2008 // Contact : Leezhm@luxoom.cn // package { import flash.events.DataEvent; import flash.events.Event; import flash.events.IEventDispatcher; import flash.events.IOErrorEvent; imp

  • 微信小程序 Canvas增强组件实例详解及源码分享

    WeZRender是一个微信小程序Canvas增强组件,基于HTML5 Canvas类库ZRender. 使用 WXML: <canvas style="width: 375px; height: 600px;" canvas-id="line-canvas-1">canvas> JS: var wezrender = require('../../lib/wezrender'); zr = wezrender.zrender.init("

  • 一个模仿oso的php论坛程序源码(之三)第1/2页

    程序三:readforum.php  <HTML>  <HEAD>  <TITLE> 论坛信息 </TITLE>  <link rel="STYLESHEET" type="text/css" href="fp_zhangcg.css">  <meta http-equiv="Content-Type" content="text/html; char

  • 一个模仿oso的php论坛程序源码(之二)第1/3页

    程序二:addforum.php  <html>  <head>  <link rel="STYLESHEET" type="text/css" href="fp_zhangcg.css">  <meta http-equiv="Content-Type" content="text/html; charset=gb2312">  <meta name=

随机推荐