
UWP
文章平均质量分 93
dino.c
这个作者很懒,什么都没留下…
展开
-
[UWP] 模仿哔哩哔哩的一键三连
1. 一键三连什么是一键三连?哔哩哔哩弹幕网中用户可以通过长按点赞键同时完成点赞、投币、收藏对UP主表示支持,后UP主多用“一键三连”向视频浏览者请求对其作品同时进行点赞、投币、收藏。去年在云之幻大佬的 哔哩 项目里看到一键三连的 UWP 实现,觉得挺有趣的,这次参考它的代码重新实现一次,最终成果如下:下面这些是一键三连的核心功能:可以控制并显示进度有普通状态和完成状态可以点击或长按当切换到完成状态时弹出写泡泡点击切换状态长按 2 秒钟切换状态,期间有进度显示这篇文章将介绍如原创 2021-03-15 11:27:38 · 774 阅读 · 0 评论 -
使用 XAML 格式化工具:XAML Styler
1. XAML 的问题刚入门 WPF/UWP 之类的 XAML 平台,首先会接触到 XAML 这一新事物。初学 XAML 时对它的印象可以归纳为一个词:一坨。随着我在 XAML 平台上工作的时间越来越长,我对 XAML 的了解就越来越深入,从语法、约束、扩展性等方方面面,我明白到 XAML 是桌面开发平台的一个最佳解决方案。这时候我已经对 XAML 有了改观,我重新用一个词归纳了我对它的印象:一大坨。没错,这时候我已经是一个成熟的 XAML 工人了,经过我熟练的双手产生了一坨又一坨 XAML,它们成长原创 2021-03-15 11:26:21 · 1200 阅读 · 0 评论 -
WinUI 3 Preview 3 发布了,再一次试试它的性能
1. WinUI 3在微软 Build 2020 开发者大会上,WinUI 团队宣布可公开预览的 WinUI 3 Preview 1,它让开发人员可以在 Win32 中使用 WinUI。最终 XAML 的新功能不再和 Windows SDK 绑定,所有新的 XAML 功能都将作为 WinUI 的一部分发布。 作为 OS 的一部分发布的现有 UWP XAML API 将不会再收到新的功能更新。 但是,它们会在 Windows 10 支持生命周期内继续收到安全更新和关键修复程序。2. WinUI 3 第三.原创 2020-12-17 21:11:22 · 1833 阅读 · 0 评论 -
[Windows] 在 Microsoft Docs 网站中挖掘 MVVM 的各种学习资源
最近写了一些 MVVM 框架的文章,翻了一些 Microsoft Docs 的文档,顺便就对 MVVM 本身来了兴致,想看看更多当年相关的文档。在 MVVM 出现后十多年,我在不同的场合见到过多种 MVVM 的实现方式,也看到过各种 MVVM 框架的多次改进(这些框架通常包含多个用于实现解耦体系结构的服务,在一定程度上使 MVVM 的确切定义变得模糊),这些都让我对 MVVM 的理解变得多样化。这种情况下重温一下 MVVM 的文档也并不是毫无意义。在 Microsoft Docs 网站上搜 “MVVM”.原创 2020-12-17 21:10:33 · 160 阅读 · 0 评论 -
[UWP]使用离散式关键帧播放动画
这篇文章介绍离散式关键帧,并使用它做些有趣的动画。1. 什么是离散式关键帧以DoubleAnimationUsingKeyFrames为例,它支持四种Double的关键帧,其中EasingDoubleKeyFrame、LinearDoubleKeyFrame和SplineDoubleKeyFrame可以归类为连续式关键帧,而DiscreteDoubleKeyFrame则是离散式关键帧。DoubleAnimationUsingKeyFrames包含一个关键帧的集合,动画开始后,每当达到某个关键帧指定的T原创 2020-12-17 21:08:42 · 403 阅读 · 0 评论 -
WinUI 3 试玩报告
1. 什么是 WinUI 3在微软 Build 2020 开发者大会上,WinUI 团队宣布可公开预览的 WinUI 3 Preview 1,它让开发人员可以在 Win32 中使用 WinUI。WinUI 3 Preview 1 包含新的 VisualStudio 项目模板,可以创建面向 .NET 5 的 C# 和 C++/Win32 项目。从技术上讲,WinUI 3 将 UWP 的 XAML、Composition 和 Input 层分离,并通过NuGet将它们独立分发给针对Windows 10 版本.原创 2020-06-08 09:14:53 · 4669 阅读 · 5 评论 -
[UWP]使用AlphaMaskEffect提升故障艺术动画的性能(顺便介绍怎么使用性能探测器分析UWP程序)
前几天发布了抄抄《CSS 故障艺术》的动画这篇文章,在这篇文章里介绍了如何使用Win2D绘制文字然后配合BlendEffect制作故障艺术的动画。本来打算就这样收手不玩这个动画了,但后来又发现性能不符合理想。明明只是做做Resize动画和用BlendEffect混合,为什么性能会这么差呢?1. 分析原因其实不用分析都知道哪里出问题了,毕竟这个懒是自己偷的,不过这里顺便介绍介绍Visual St...原创 2020-03-31 09:43:13 · 257 阅读 · 0 评论 -
[UWP]抄抄《CSS 故障艺术》的动画
1. 前言什么是故障艺术(Glitch Art 风)?我们熟知的抖音的 LOGO 正是故障艺术其中一种表现形式。它有一种魔幻的感觉,看起来具有闪烁、震动的效果,很吸引人眼球。故障艺术它模拟了画面信号出现故障导致成像错误的感觉。青色色块与红色色块无法重合就是这种故障的体现。从胶片时代开始到今天的数码时代,这种故障一直是观众非常熟悉的现象。上个月看到CSS 故障艺术这篇文章,最近想转换心情于是...原创 2020-03-27 09:11:18 · 238 阅读 · 0 评论 -
[UWP]用画中画模式(CompactOverlay Mode)让用总在最前端显示
1. 什么是,以及怎么用画中画Windows 10 Creators Update以后UWP提供了一个新的视图模式CompactOverlay,中文翻译成 紧凑的覆盖层?反正大部分时间我们都会称它为画中画模式。上图中右上角即为进入画中画模式的微软“电影和电视”应用。可以调用ApplicationView.TryEnterViewModeAsync函数进入或退出CompactOverlaye...原创 2020-03-23 12:45:52 · 316 阅读 · 0 评论 -
[UWP]XAML中的响应式布局技术
响应式布局的概念是一个页面适配多个终端及不同分辨率。在针对特定屏幕宽度优化应用 UI 时,我们将此称为创建响应式设计。WPF设计之初响应式设计的概念并不流行,那时候大部分网页设计师都按着宽度960像素的标准设计。到了UWP诞生的时候响应式布局已经很流行了,所以UWP提供了很多响应式布局的技术,这篇文章简单总结了一些响应式布局常用的技术,更完整的内容请看文章最后给出的参考网站。1. 传统的XAML...原创 2020-03-23 12:44:56 · 275 阅读 · 0 评论 -
[UWP]在应用退出时弹出确认提示框
1. 需求在应用退出时(点击右上角的关闭按钮)弹出一个确认按钮可以说是一个最常见的操作了,例如记事本的“你是否保存”:但这个功能在UWP上居然有点小复杂。这篇文章将解释如何实现这个功能。2. CloseRequested为了监视应用退出事件,我本来使用了CoreApplication.Exiting,但好像并不起作用,后来我就没再研究它的触发机制了。在Windows 10 Creator...原创 2019-12-12 09:27:31 · 547 阅读 · 0 评论 -
[UWP]使用CompositionGeometricClip裁剪复杂图形及进行动画
1. UWP中的其它裁剪方案之前在 这篇文章 里,我介绍了如何使用UIElement.Clip裁剪UIElement的内容,使用代码如下:<Canvas> <Image Source="Images/Water_lilies.jpg" Width="200" Height="150"> <Image.Clip> ...原创 2019-12-12 09:26:56 · 131 阅读 · 0 评论 -
[UWP]UIElement.Clip虽然残废,但它还可以这样玩
1. 复习一下WPF的UIElement.Clip用了很久很久的WPF,但几乎没有主动用过它的Clip属性,我只记得它很灵活,可以裁剪出多种形状。在官方文档复习了一下,大致用法和效果如下:<Image Source="sampleImages\Waterlilies.jpg" Width="200" Height="150" HorizontalAlignment="Left...原创 2019-12-02 10:55:27 · 232 阅读 · 0 评论 -
[UWP]用Win2D实现镂空文字
1. 前言之前用PointLight做了一个番茄钟,效果还不错,具体可见这篇文章:[UWP]使用PointLight并实现动画效果后来试玩了Win2D,这次就用Win2D实现文字的镂空效果,配合PointLight做一个内敛不张扬的番茄钟。实现镂空文字的核心思想是使用CanvasGeometry.CreateText从TextLayout获取一个Geometry,然后使用DrawGeom...原创 2019-11-25 09:05:14 · 195 阅读 · 0 评论 -
[UWP]通过自定义XamlCompositionBrushBase实现图片平铺
1. 什么是XamlCompositionBrushBase我早就想试试自定义XamlCompositionBrushBase,但一直没机会。上一篇文章介绍到使用Win2D的BorderEffect实现图片的平铺功能,原理很简单,但每次都要写这些代码很繁琐,正好就用这个作为例子试试XamlCompositionBrushBase。CompositionBrush灵活多变,它的基本用法如下:...原创 2019-11-20 14:41:24 · 157 阅读 · 0 评论 -
[UWP]使用Win2D的BorderEffect实现图片的平铺功能
1. WPF有,而UWP没有的图片平铺功能在WPF中只要将ImageSource的TileMode属性设置为Tile即可实现图片的平铺,具体可见WPF的这些文档:ImageBrush 类 (System.Windows.Media) _ Microsoft DocsTileBrush 类 (System.Windows.Media) _ Microsoft DocsTileBrush.Ti...原创 2019-11-18 13:05:50 · 183 阅读 · 0 评论 -
[UWP]使用CompositionAPI的翻转动画
1. 运行效果在 使用GetAlphaMask和ContainerVisual制作长阴影(Long Shadow) 这篇文章里我介绍了一个包含长阴影的番茄钟,这个番茄钟在状态切换时用到了翻转动画,效果如上所示,还用到了弹簧动画,可以看到翻转后有点回弹。本来打算自己这个动画效果写的,但火火已经写好了这个FlipSide控件,Github地址在这里,这篇文章就介绍下这个控件的部分原理。2. Tr...原创 2019-11-14 09:03:43 · 281 阅读 · 0 评论 -
[UWP]为番茄钟应用设计一个平平无奇的状态按钮
1. 为什么需要设计一个状态按钮OnePomodoro应用里有个按钮用来控制计时器的启动/停止,本来这应该是一个包含“已启动”和“已停止”两种状态的按钮,但我以前在WPF和UWP上做过太多StateButton、ProgressButton之类的东西,已经厌倦了这种控件,所以我在OnePomodoro应用里只是简单地使用两个按钮来实现这个功能:<Button Content="&...原创 2019-11-13 09:48:56 · 204 阅读 · 0 评论 -
[UWP]使用SpringAnimation创建有趣的动画
1. 什么是自然动画最近用弹簧动画(SpringAnimation)做了两个番茄钟,关于弹簧动画官方文档已经介绍得够详细了,这篇文章就摘录一些官方文档核心内容。在传统UI中,关键帧动画(KeyFrameAnimation)是描述运动的主要方式。关键帧为设计人员和开发人员提供了尽可能多的用于定义开始、结束和内插的方式。虽然这在许多情况下非常有用,但关键帧动画动态性不够,其运动没有适应性,在任何情...原创 2019-11-11 09:27:21 · 279 阅读 · 0 评论 -
[UWP]使用GetAlphaMask和ContainerVisual制作长阴影(Long Shadow)
1. 什么是长阴影前几年扁平化设计(Flat Design)十分流行,后来在扁平化的基础上又流行起了长阴影(Long Shadow)。长阴影其实就是扩展了对象的投影,感觉是一种光线照射下的影子,通常采用角度为 45 度的投影,给对象添加了一份立体感。长阴影快速发展为流行的设计趋势,并经常被应用到扁平设计方案的对象。它很适合用在较小的元素上,一时之间几乎应用的图标都加上了长阴影。(不过现在又不流行...原创 2019-11-04 09:08:11 · 257 阅读 · 0 评论 -
[UWP]使用GetAlphaMask制作阴影
1. 前言最近常常接触到GetAlphaMask,所以想写这篇文章介绍下GetAlphaMask怎么使用。其实GetAlphaMask的使用场景十分有限,Github上能搜到的内容都是用来配合DropShadow的,所以这篇文章也以介绍DropShadow为主。2. 合成阴影先介绍一下合成阴影。Compositor.CreateDropShadow()可以创建一个DropShadow,将这个...原创 2019-10-30 09:33:36 · 190 阅读 · 0 评论 -
[UWP]CompositionLinearGradientBrush加BlendEffect,双倍的快乐
1. 什么是BlendEffect上一篇文章介绍了CompositionLinearGradientBrush的基本用法, 这篇文章再结合BlendEffec介绍一些更复杂的玩法。Microsoft.Graphics.Canvas.Effects命名空间下的BlendEffect 用于组合两张图片(分别是作为输入源的Background和Foreground),它包含多种模式,如下图所示:...原创 2019-10-30 09:32:42 · 113 阅读 · 0 评论 -
[UWP]使用CompositionLinearGradientBrush实现渐变画笔并制作动画
1. 什么是 CompositionBrushCompositionBrush(合成画笔)是操作可视化层时用于绘制 SpriteVisual 区域的画笔。使UWP 应用时可以选择使用 XAML 画笔或 CompositionBrush(合成画笔) 绘制 UIElement。很多时候XAML画笔和合成画笔都能实现同样的效果,在官方文档 使用 XAML 画笔 vs。CompositionBrush...原创 2019-10-23 08:55:49 · 398 阅读 · 1 评论 -
[UWP]依赖属性2:使用依赖属性
5. 完整的自定义依赖属性5.1 定义/// <summary>/// 标识 Title 依赖属性。/// </summary>public static readonly DependencyProperty TitleProperty = DependencyProperty.Register("Title", typeof(string)...原创 2018-03-18 22:14:29 · 235 阅读 · 0 评论 -
[UWP 自定义控件]了解模板化控件(2):模仿ContentControl
ContentControl是最简单的TemplatedControl,而且它在UWP出场频率很高。ContentControl和Panel是VisualTree的基础,可以说几乎所有VisualTree上的UI元素的父节点中总有一个ContentControl或Panel。因为ContentControl很简单,如果只实现ContentControl最基本功能的话很适合用来做Template...原创 2018-03-29 22:40:36 · 709 阅读 · 0 评论 -
[UWP]附加属性1:概述
1. 什么是附加属性(attached property )附加属性依赖属性的一种特殊形式,常见的Grid.Row,Canvas.Left都是附加属性。/// <summary>// 从指定元素获取 Left 依赖项属性的值。/// </summary>/// <param name="obj">The element from which ...原创 2018-03-20 22:16:53 · 456 阅读 · 0 评论 -
[UWP 自定义控件]了解模板化控件(2.1):理解ContentControl
UWP的UI主要由布局容器和内容控件(ContentControl)组成。布局容器是指Grid、StackPanel等继承自Panel,可以拥有多个子元素的类。与此相对,ContentControl则只能包含单个子元素。在UWP中,Button、CheckBox、ScrollViewer、Frame、ToolTip等都继承自ContentControl,其它控件则不是在ContentTempl...原创 2018-04-08 20:25:54 · 707 阅读 · 0 评论 -
[UWP]附加属性2:实现一个Canvas
5. 附加属性实践:自定义Canvas附加属性在UWP中是一个十分重要的组成部分,很多功能都依赖于附加属性实现,典型的例子是常用的Grid和Canvas。通常附加属性有三个使用场景:插入属性、触发行为、当做缓存。可以参考以下提供的MyCanvas示例理解这三点。5.1 插入属性这里实现的MyCanvas继承自Panel,是一个十分简单的类(作为示例并没有十分严格的验证等代码,所以只...原创 2018-03-22 11:33:31 · 292 阅读 · 0 评论 -
[UWP 自定义控件]了解模板化控件(3):实现HeaderedContentControl
1. 概述来看看这段XMAL:<StackPanel Width="300"> <TextBox Header="TextBox" /> <ComboBox Header="ComboBox" HorizontalAlignment="Stretch"/> <AutoSuggestBox Head原创 2018-04-10 06:30:56 · 498 阅读 · 0 评论 -
[UWP 自定义控件]了解模板化控件(1):基础知识
1.概述UWP允许开发者通过两种方式创建自定义的控件:UserControl和TemplatedControl(模板化控件)。这个主题主要讲述如何创建和理解模板化控件,目标是能理解模板化控件常见的知识点,并且可以创建扩展性良好的模板化控件。1.1 ControlTemplateUWP的控件有很多属性,使用这些属性可以为控件定制不同的外观,例如将Button的Border变粗,Bac...原创 2018-03-27 22:36:13 · 450 阅读 · 0 评论 -
[UWP 自定义控件]了解模板化控件(4):TemplatePart
1. TemplatePartTemplatePart(部件)是指ControlTemplate中的命名元素。控件逻辑预期这些部分存在于ControlTemplate中,并且使用protected DependencyObject GetTemplateChild(String childName)获取它们后进行操作。以AutoSuggestBox为例,它的ControlTemplate结...原创 2018-04-12 20:11:46 · 334 阅读 · 0 评论 -
[UWP]从头开始创建并发布一个番茄钟
1. 自己用的番茄钟自己做在PC上我一直使用“小番茄”作为我的番茄钟软件,我把它打开后放在副显示器最大化,这样不仅可以让它尽到本分,而且还可以告诉我的同事“我正在专心工作”。可是我总是嫌弃它的手感不够愉悦,总想自己写一个番茄钟软件,正好最近很久没写UWP应用了很手痒,于是就抽空写了个自用的番茄钟并发布到微软应用商店。结果手感也并不愉悦。另外,本来本来我也打算用Storyboard实现动画,但...原创 2019-07-04 09:22:28 · 455 阅读 · 2 评论 -
[UWP]占领标题栏
1. 前言每一个有理想的UWP应用都会打标题栏的注意,尤其当微软提供 将 Acrylic 扩展到标题栏 这个功能后,大部分Windows 10的原生应用都不乖了,纷纷占领了标题栏的一亩三分地。这篇博客将介绍在UWP中如何自定义标题栏。2.示例代码UWP的限制很多,标题栏的自定义几乎全部内容集中在 这篇文档 里面。但只参考这篇文章做起来还不够顺手,我参考了微软开源的计算器应用中的 TitleB...原创 2019-09-04 09:26:12 · 304 阅读 · 0 评论 -
[UWP]依赖属性1:概述
1. 概述依赖属性(DependencyProperty)是UWP的核心概念,它是有DependencyObject提供的一种特殊的属性。由于UWP的几乎所有UI元素都是集成于DependencyObject的FramewordElement,并且这些UI元素的几乎所有属性及它们出现在XAML中的几乎所有属性都是依赖属性,所以可以说依赖属性是专门为UI设计的属性系统。 依赖属性的定义:...原创 2018-03-17 15:31:15 · 821 阅读 · 0 评论