Windows 10 从v1709开始引入的Fluent Design System非常漂亮,最新的v1809更是进一步完善了FDS,在开发者无需显示指定的情况下,许多UWP自带控件默认就有FDS效果。通常来说这是件好事,但这也会引起某些App的性能问题。我的《字符映射表UWP》就是受害App之一,我们来看看如何在UWP应用中移除默认的FDS效果以避免性能问题吧。
问题描述
问题具体表现是,《字符映射表UWP》同样的版本,同样的代码,在Windows 10 v1803上可以流畅运行,而升级到1809以后,稍微滚动一下页面,选几个字符操作一下,就立即卡到无法使用。
前几天收到了一位用户的邮件,说只要关闭Windows 10个性化设置里的透明效果,即关闭所有FDS,就能让App恢复响应。
主要影响性能的是GridViewItem以及ListViewItem上的Reveal效果,这是FDS的效果之一。即鼠标移动到元素上时,周围边框的高亮跟随效果。在我的《字符映射表UWP》中,主要因为GridView里显示的是几百甚至上万的字符,项太多了,因此影响了性能。
修复问题
在Windows 10 v1809 (十月更新)上,GridViewItem和ListViewItem的Reveal效果是默认开启的,不需要开发者做任何指定,也不要更新老应用的代码,会自动出现。然而想要关闭它就不那么直接了。
关闭默认Reveal效果的方法是复写系统预定义的几个Brush Key,针对我这个应用,我需要复写的是这些Key:
代码语言:javascript复制<SolidColorBrush x:Key="SystemControlTransparentRevealBackgroundBrush" Color="Transparent" />
<SolidColorBrush x:Key="SystemControlTransparentRevealBorderBrush" Color="Transparent" />
<SolidColorBrush x:Key="GridViewItemRevealBorderBrush" Color="Transparent" />
<Thickness x:Key="ListViewItemRevealBorderThemeThickness">0</Thickness>
<Thickness x:Key="GridViewItemRevealBorderThemeThickness">0</Thickness>
<SolidColorBrush x:Key="ListViewItemRevealBackgroundSelectedPressed" Color="Transparent" />
<SolidColorBrush x:Key="ListViewItemRevealPlaceholderBackground" Color="Transparent" />
<SolidColorBrush x:Key="GridViewItemRevealBackground" Color="Transparent" />
<SolidColorBrush x:Key="GridViewItemRevealBackgroundPointerOver" Color="Transparent" />
<SolidColorBrush x:Key="GridViewItemRevealBackgroundPressed" Color="Transparent" />
<SolidColorBrush x:Key="GridViewItemRevealBackgroundSelected" Color="Transparent" />
<SolidColorBrush x:Key="GridViewItemRevealBackgroundSelectedPointerOver" Color="Transparent" />
<SolidColorBrush x:Key="GridViewItemRevealBackgroundSelectedPressed" Color="Transparent" />
<SolidColorBrush x:Key="GridViewItemRevealPlaceholderBackground" Color="Transparent" />
现在再运行应用,可以发现Reveal效果已经没有了,整体体验也非常流畅。
我是怎么找这些Key的
至于这些Key是怎么找到的,其实很简单,在你安装完UWP SDK以后,所有系统自带控件的Brush等样式定义都在:
C:Program Files (x86)Windows Kits10DesignTimeCommonConfigurationNeutralUAP10.0.17763.0Genericgeneric.xaml
打开这个文件,搜索关键词“Reveal”,就能找到相关项啦: