Skip to content

Latest commit

 

History

History

DMSkin.Docs

Folders and files

NameName
Last commit message
Last commit date

parent directory

..
 
 

DMSkin-for-WPF

一个强大的WPF无边框窗体框架和控件库组合。

前言

DMSkin-for-WPF (简称 DFW) 是一个强大的WPF无边框窗体框架和控件库组合。支持窗体阴影、窗体过渡动画,自带优雅的控件库,旨在帮助开发者更加高效、迅速地创建出优美的WPF界面。

支持的 .NET Framework 3.5.NET Framework 3.5 4.7,并支持从Windows XP到Window 10的所有系统版本。

如果你的软件仅仅考虑兼容 Windows10 + ,.NET Framework 4.5+,可以考虑使用官网方案:WindowChrome,但是这些库在Windows7 上面不会产生阴影。(.NET Framework 3.5 可以使用System.Windows.Shell实现)

DFW为窗体无边框提供了两种方案:

1. 双层方案

使用Win 32 API重绘非客户区,然后创建一个单独的窗体去绘制阴影。

2. 单层方案

延迟Windows消息以防止由于设置窗体属性为AllowsTransparency=trueWindowStyle=None而导致的闪烁花屏Bug。

下面的表格可以很直观地说明双层方案和单层方案的区别:

方案 是否支持窗体透明 是否支持窗体动画 对系统的支持程度
DMSkinComplexWindow 不支持 支持 在Win7上会有Bug
DMSkinSimpleWindow 支持 不支持 支持Windows所有版本

注意

1. DFW基于VS 2017社区版开发,.NET 4.0开发环境,源码包括一些c# 6.0+语法,如果你在VS 2015甚至更低的VS版本上编译不通过的话,请自行修改中源码不兼容的部分。

2. 双层方案仍然有点缺陷,在Win7上非客户区的系统按钮会阻挡操作。

安装

你可以通过以下两种方式获取 DMSkin.WPF.dll

这种方式的缺点是你下载到的dll并不总是最新的。

2. 下载源码 然后自己编译

点击 DMSkin-for-WPF.sln 打开项目, 右击解决方案资源管理器上的DMSkin.WPF 然后点击生成按钮即可编译获得dll文件. 接着打开资源管理器,你会发现 bin\Debug目录下已经多了一个DMSkin.WPF.dll.

还有一些其它的方法可以获取到 DMSkin.WPF.dll和源码:

  • Nuget PM> Install-Package DMSkin.WPF -Version 2.5.0.4
  • Git git clone git@github.com:944095635/DMSkin-for-WPF.git

用法 & 配置

1. 创建一个WPF项目

3. 添加 App.xaml Resources

<Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <!--  样式分离 不用的可以不引用 减少内存暂用  -->
                <!--  DMSKin内置转换器 配色  -->
                <ResourceDictionary Source="pack://application:,,,/DMSkin.WPF;Component/Styles/DMSkin.xaml" />
                <!--  DMSKin内置滚动容器  -->
                <ResourceDictionary Source="pack://application:,,,/DMSkin.WPF;Component/Styles/DMScrollViewer.xaml" />
                <!--  DMSKin内置SVG图标  -->
                <ResourceDictionary Source="pack://application:,,,/DMSkin.WPF;component/Styles/DMIcon.xaml" />
                <!--  DMSKin内置按钮  -->
                <ResourceDictionary Source="pack://application:,,,/DMSkin.WPF;component/Styles/DMButton.xaml" />
                <!--  DMSKin内置选择框  -->
                <ResourceDictionary Source="pack://application:,,,/DMSkin.WPF;component/Styles/DMCheckBox.xaml" />
                <!--  DMSKin内置动画  -->
                <ResourceDictionary Source="pack://application:,,,/DMSkin.WPF;Component/Styles/Animation.xaml" />
                <!--  DMSKin内置输入框  -->
                <ResourceDictionary Source="pack://application:,,,/DMSkin.WPF;component/Styles/DMTextBox.xaml" />
                <!--  DMSKin内置滑动  -->
                <ResourceDictionary Source="pack://application:,,,/DMSkin.WPF;component/Styles/DMSlider.xaml" />
                <!--  DMSKin提示框  -->
                <ResourceDictionary Source="pack://application:,,,/DMSkin.WPF;component/Styles/DMToolTip.xaml" />
                <!--  DMSKin右键菜单  -->
                <ResourceDictionary Source="pack://application:,,,/DMSkin.WPF;component/Styles/DMContextMenu.xaml" />
                <!--  DMSKin其他样式  -->
                <ResourceDictionary Source="pack://application:,,,/DMSkin.WPF;component/Styles/DMTabControl.xaml" />
                <ResourceDictionary Source="pack://application:,,,/DMSkin.WPF;component/Styles/DMRadioButton.xaml" />
                <ResourceDictionary Source="pack://application:,,,/DMSkin.WPF;component/Styles/DMTreeView.xaml" />
                <ResourceDictionary Source="pack://application:,,,/DMSkin.WPF;component/Styles/DMDataGrid.xaml" />
                <ResourceDictionary Source="pack://application:,,,/DMSkin.WPF;component/Styles/DMListBox.xaml" />
		<ResourceDictionary Source="pack://application:,,,/DMSkin.WPF;component/Styles/DMResizeGrip.xaml" />
                <ResourceDictionary Source="pack://application:,,,/DMSkin.WPF;component/Styles/DMImage.xaml" />
                <!--  最后加载项目其他的样式  -->
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>

4. 修改 MainWindow.cs

这里以引入单层方案 DMSkinSimpleWindow 为例,使用双层方案将DMSkinSimpleWindow改成DMComplexWindow即可。

+ using DMSkin.WPF;
  using System.Windows;

  namespace DMSkinTest
  {
-      public partial class MainWindow : Window
+      public partial class MainWindow : DMSkinSimpleWindow
      {
          public MainWindow()
          {
              InitializeComponent();
          }
      }
  }

5. 修改 MainWindow.xaml

- <Window x:Class="DMSkinTest.MainWindow" 
+ <DMSkin:DMSkinSimpleWindow
+         x:Class="DMSkinTest.MainWindow" <!-- 这里你需要将 DMSkinTest 换成你自己的项目名 -->  
+         xmlns:DMSkin="clr-namespace:DMSkin.WPF;assembly=DMSkin.WPF" 
          xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
          xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
          xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
          xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
          mc:Ignorable="d">
      <Grid>

      </Grid>
- </Window>
+ </DMSkin:DMSkinSimpleWindow>

若想使用双层方案,需要将上方的DMSkinSimpleWindow改成DMComplexWindow

6. 添加系统按钮 (可选)

<!-- 将下面的代码添加进 MainWindow.xaml -->
<!-- 系统按钮属性:
  -- DMSystemButtonSize // 系统按钮大小
  -- DMSystemButtonForeground // 系统按钮前景色
  -- DMSystemButtonHoverColor // 光标悬浮在按钮上时系统按钮的背景色
  -- DMSystemButtonHoverForeground // 光标悬浮在按钮上时系统按钮的前景色
  -- DMSystemButtonCloseHoverColor // 系统关闭按钮的颜色
  -->
<WrapPanel Height="{Binding DMSystemButtonSize}" Orientation="Horizontal" 
            VerticalAlignment="Top" HorizontalAlignment="Right">
  <controls:DMSystemMinButton DMSystemButtonSize="50" 
            DMSystemButtonHoverForeground="#383838" DMSystemButtonForeground="#383838">
			</controls:DMSystemMinButton>
  <controls:DMSystemMaxButton DMSystemButtonSize="50" 
            DMSystemButtonHoverForeground="#FFFFFF" DMSystemButtonForeground="#383838">
			</controls:DMSystemMaxButton>
  <controls:DMSystemCloseButton DMSystemButtonSize="50" 
            DMSystemButtonHoverForeground="#FFFFFF" DMSystemButtonForeground="#383838">
			</controls:DMSystemCloseButton>
</WrapPanel>

7. 配置你的 DFW 窗体属性 (可选)

DMWindowShadowSize="10"               // 窗体阴影大小
DMWindowShadowColor="#FFC8C8C8"       // 窗体阴影颜色
DMWindowShadowOpacity="0.8"           // 窗体阴影透明度
DMWindowShadowDragVisibility="False"  // 当窗体被拖动时是否显示阴影
DMWindowShadowVisibility="False"      // 是否显示窗体阴影
DMWindowShadowBackColor="#FF323CAD"   // 阴影背景色 (只对双层方案有效)

8.制作圆角窗体 (可选)

<Border Background="White" CornerRadius="5"  BorderThickness="1">
        <Border.Effect>
            <DropShadowEffect BlurRadius="12" ShadowDepth="0" Color="#88000000"/>
        </Border.Effect>
        <Grid Margin="0,0,0,0">
            <Grid Background="Transparent">
                <Grid.RowDefinitions>
                    <RowDefinition Height="30"></RowDefinition>
                    <RowDefinition Height="*"></RowDefinition>
                    <RowDefinition Height="30"></RowDefinition>
                </Grid.RowDefinitions>
                <Grid Grid.Row="0" Name="DMTitle">
                </Grid>
            </Grid>
            <ResizeGrip VerticalContentAlignment="Bottom" HorizontalContentAlignment="Right" 
			HorizontalAlignment="Right" VerticalAlignment="Bottom"></ResizeGrip>
        </Grid>
</Border>

效果预览

联系

欢迎加入我们:

捐赠

如果你觉得这个框架真的对你很有帮助,欢迎给我捐赠,这将鼓励我做的更好!

更新日志

2.5.1.0 (2018-11-06)

1.优化代码(当前版本号) 2.新增网易云Resizegrip

2.5.0 (2018-06-07)

  1. 将2个项目合二为一。

  2. 添加一些WPF 常用的class 如ViewModelBase,UI调度器,转换器。

  3. 加入了水印输入框等,代码重构,准备发布到Nuget,以后可以通过Nuget安装 和 更新。

2.1.0 (2018-04-17)

  1. 修改逻辑,目前窗口支持MVVM。

  2. 修复一个启动时阴影分层的BUG。

  3. 系统按钮被分离出窗口模板,具体查看本文底部使用方法。

2.0.1 (2018-01-30)

  1. 新增一个窗口Demo。

2.0.0 (2017-10-15)

  1. 移除WindowMode。

  2. 目前WIN7有点小瑕疵。

1.3.0 (2017-09-21)

  1. Win7以及以下采用单层。

  2. Win8、Win10采用双层。

1.2.4 (2017-09-21)

  1. 窗口边缘拉伸(右,右下,下)。

  2. 阴影恢复速度调为200ms。

  3. 阴影可以完全关闭(高效率,配合窗口虚线使用)。

1.1.3 (2017-09-20)

  1. 修复ALT+TAB 出现2个窗体的BUG。

  2. 阴影层背景色,拉伸 拖拽时 出现的颜色。选择跟主窗体 接近的颜色 用户体验更好。

1.1.2 (2017-09-20)

  1. 修复多个窗口无法激活聚焦的BUG。

  2. 拖动窗口支持显示阴影层。

  3. 阴影层延迟显示的BUG修复。

1.1.1 (2017-09-19)

  1. 优化最小化恢复阴影顺序,不会像网易云音乐一样出现双层了。

  2. 去除窗口裁剪代码(之前的裁剪操作多此一举)。

  3. 拖动窗口位置时隐藏阴影提高效率。

1.0.0 (2017-09-13)

  1. 最小化动画终于解决,此方案可以移植到winform无边框中,这是我所知道的世界第一例WPF/winfrom无边框最小化动画方案。

备注:

【1.0版本】采用双层窗体+Win32实现无边框,1.0版本不支持圆角窗体,不支持窗体透明,但是拥有完美最小化的动画。如果采用虚线边框,则可以去除双层窗体。

【1.0版本之前】采用WindowStyle.None + 透明实现无边框,版本缺陷是无边框通病,窗体最小化 动画失效了。但是我用xaml实现了动画(动画流畅程度取决于显卡)。

0.8.0 (2017-08-26)

  1. 修复最小化动画以及恢复动画(尚可优化)。

0.7.0 (2017-08-25)

  1. 代码托管到GITHUB。

  2. 新增Demo:周杰伦音乐播放器。

  3. 新增Demo:默认模板窗体。

0.6.0 (2017-03-06)

  1. 新增DMSystemButtonHoverColor 系统按钮鼠标悬浮的背景色(圆角窗体请设为透明,效果更好)。

  2. 新增窗体模式:扁平化Metro+阴影Shadow 2种风格窗体。

MIT License

Copyright © 2018

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.