Office2019主题
灵感来自于著名的微软Office套件及其最新版本Office2019
主题是来帮助重建和交付,新鲜和光滑的外观和感觉你的WPF应用程序。探索光
,灰色的
和黑暗
内置Office2019主题的颜色变化和得到良好的开端与WPF应用程序。
与R3 2021版本中,我们扩展了用一种全新的理念——内置的颜色变化
HighContrast
。此外,我们延长了主题与几个笔刷面板。阅读更多的默认主题颜色的话题。
跳转到下列主题学习主题的调色板和功能的细节。
默认主题颜色
的Office2019
主题被设计成可轻易通过暴露出主题颜色调色板修改。默认值的刷子下面列出的主题。
颜色名称 | 光 | 灰色的 | 黑暗 | HighContrast | ||||
---|---|---|---|---|---|---|---|---|
AccentBackgroundColor | # 106电子束曝光 | # 106电子束曝光 | # 106电子束曝光 | # 1 aebff | ||||
AccentBorderColor | # 106电子束曝光 | # 106电子束曝光 | # 106电子束曝光 | # 1 aebff | ||||
AccentMouseOverBackgroundColor | # D4E8F8 | # D4E8F8 | # D4E8F8 | # FFFF00 | ||||
AccentMouseOverBorderColor | # 2 f96ed | # 2 f96ed | # 2 f96ed | # 1 aebff | ||||
AccentPressedBackgroundColor | # A1CDED | # A1CDED | # A1CDED | # 1 aebff | ||||
AlternativeBackgroundColor | # F1F1F1 | # CBCBCB | # 3 c3c3c | # 000000 | ||||
BaseBackgroundColor | # DFDFDF | # 767272 | # 151515 | # 000000 | ||||
ButtonBackgroundColor | # E5E5E5 | # BFBFBF | # 3 d3d3d | # 000000 | ||||
CheckedForegroundColor | # FFFFFF | # FFFFFF | # FFFFFF | # 000000 | ||||
DisabledBackgroundColor | # F1F1F1 | # CBCBCB | # 3 f3e3c | # 808080 | ||||
DisabledBorderColor | # D6D6D6 | # BEBEBE | # 4 f4f4f | # FFFFFF | ||||
HeaderBackgroundColor | # 106电子束曝光 | # 106电子束曝光 | # 106电子束曝光 | # 37006 e | ||||
HeaderForegroundColor | # FFFFFF | # FFFFFF | # FFFFFF | # FFFFFF | ||||
HighlightedForegroundColor | # 2 f2f2f | # 2 f2f2f | # 2 f2f2f | # 000000 | ||||
IconColor | # 606060 | # 333333 | # A6A6A6 | # FFFFFF | ||||
MainBackgroundColor | # FFFFFF | # E2E2E2 | # 2 f2f2f | # 000000 | ||||
MainBorderColor | # ACACAC | # A6A6A6 | # 606060 | # FFFFFF | ||||
MainForegroundColor | # 000000 | # 000000 | # F1F1F1 | # FFFFFF | ||||
MouseOverBackgroundColor | # C8C7C4 | # ACACAC | # B3AFAD | # 1 aebff | ||||
PressedBackgroundColor | # B3AFAD | # 918 e8d | # 767676 | # 1 aebff | ||||
ReadOnlyBackgroundColor | # FFFFFF | # E2E2E2 | # 2 f2f2f | # 008000 | ||||
ReadOnlyBorderColor | # ACACAC | # A6A6A6 | # 606060 | # FFFFFF | ||||
SecondaryBackgroundColor | # D6D5D5 | # B6B3B1 | # 2 b2b2b | # 37006 e | ||||
SecondaryForegroundColor | # 000000 | # FFFFFF | # F1F1F1 | # FFFFFF | ||||
ValidationColor | # E43E00 | # E43E00 | # E43E00 | # EB0300 |
另外介绍了画笔,后是可用的R3 2021。
颜色名称 | 光 | 灰色的 | 黑暗 | HighContrast | ||||
---|---|---|---|---|---|---|---|---|
DisabledCheckedForegroundColor | # FFFFFF | # FFFFFF | # FFFFFF | # 808080 | ||||
DisabledForegroundColor | # 000000 | # 000000 | # F1F1F1 | # 00 ff00 | ||||
DisabledIconColor | # 606060 | # 333333 | # A6A6A6 | # 00 ff00 | ||||
IconWrapperColor | 透明的 | 透明的 | 透明的 | # 000000 | ||||
SelectedUnfocusedBackgroundColor | # E5E5E5 | # BFBFBF | # 3 d3d3d | # 808080 | ||||
TertiaryBackgroundColor | # F1F1F1 | # CBCBCB | # 3 c3c3c | # 37006 e |
更多的信息关于每个颜色和各自的刷从此前创建的下一个话题。
主题颜色用RadOutlookBar表示
默认主题刷
口音刷
AccentBackgroundBrush
曾经的背景元素,应该有口音,例如开关按钮的背景检查状态。AccentBorderBrush
曾经的边框颜色的元素应该有口音,例如开关按钮的边框颜色的检查状态。AccentMouseOverBackgroundBrush
曾经对口音的背景元素在鼠标状态(例如,所有按钮RadRibbonView的除外)。AccentMouseOverBorderBrush
曾经的边框颜色口音元素在鼠标状态(例如,所有按钮RadRibbonView的除外)。AccentPressedBackgroundBrush
曾经的口音的背景元素按状态(例如,所有按钮RadRibbonView的除外)。也用于按钮、下拉菜单切换(打开状态)。
前台刷
MainForegroundBrush
这是默认主题的前景。SecondaryForegroundBrush
曾经的前景元素,放置在一个背景,否则需要恢复默认前景——例如BaseBackgroundBrush。它可以作为一个默认前景女士复选框等控件,RadioButton, GroupBox在这样的场景。也可以考虑与IsBackgroundVisible =“False”按钮。HighlightedForegroundBrush
曾经的前景元素当父母强调/徘徊,或选择/检查,徘徊在一次。CheckedForegroundBrush
曾经的前景元素当父母的选择/检查状态。HeaderForegroundBrush
曾经为标题的前景元素在一个窗口控件(例如RadWindow, RadTabbedWindow filedialog,等等)。IconBrush
曾经的违约前景RadGlyph图标。
基地刷
BaseBackgroundBrush
这是推荐的背景作为应用背景,这一主题。也用作背景的RadRichTextBox RadSpreadsheet和RadPdfViewer控制。MainBackgroundBrush
曾经为背景的输入和其他可编辑元素,比如RadAutocompleteBox下拉/弹出菜单的内容,和一些孩子控制元素像RadTaskBoard卡,RadTileList瓷砖等。MainBorderBrush
这是默认的所有控件的边框颜色。SecondaryBackgroundBrush
曾经为不可编辑的背景下,次要元素——例如RadCalculator交替的按钮。也用于默认背景RadProgressBar的跟踪和RadSlider。AlternativeBackgroundBrush
曾经的背景RadMenu、RadOutlookBar RadSpreadsheet特定的子控件和页脚对话框的背景,RadRibbonView标签的背景,RadGridView的面板背景(GroupPanel SearchPanel),交替行背景,等等。ButtonBackgroundBrush
这是所有按钮的默认背景。HeaderBackgroundBrush
曾经为标题的背景元素在一个窗口控件(例如RadWindow, RadTabbedWindow filedialog,等等)。MouseOverBackgroundBrush
曾经的背景non-accent元素在鼠标状态——例如RadRibbonView背景的按钮。PressedBackgroundBrush
曾经的背景non-accent元素按状态——例如RadRibbonView背景的按钮。TertiaryBackgroundBrush
曾经聊天的背景控制TextMessageControl和甘特控制SpecialSlots的观点。
的
TertiaryBackgroundBrush
与之前版本不可用R3 2021WPF的UI套件。
国家重点刷
DisabledBackgroundBrush
曾经为禁用状态控制的背景。DisabledBorderBrush
曾经的边框颜色控制在禁用状态。DisabledCheckedForegroundBrush
曾经 前景的元素在他们的残疾和检查状态(包括RadGlyph图标)。DisabledForegroundBrush
曾经的前景元素禁用状态。DisabledIconBrush
曾经的前景RadGlyph禁用状态图标。IconWrapperBrush
曾经作为包装器的图像背景/图标颜色/前景与背景相冲突时他们的父母在其鼠标状态。这个笔刷介绍主要用于HighContrast颜色变化。它的颜色是透明颜色的变化。ReadOnlyBackgroundBrush
曾经的背景在只读状态控制。ReadOnlyBorderBrush
曾经的边框颜色控制在只读状态。SelectedUnfocusedBackgroundBrush
曾经为背景的元素在他们的选择,而不是集中状态(例如,GridViewRow, TreeListViewRow和节点)。ValidationBrush
曾经的背景/边框颜色控制显示验证错误——前景的无效的控制,或作为错误提示的边界,边界为无效行和单元格。
的
DisabledCheckedForegroundBrush
,DisabledForegroundBrush
,DisabledIconBrush
,IconWrapperBrush
和SelectedUnfocusedBackgroundBrush
与之前版本不可用R3 2021WPF的UI套件。
控制特定的刷子
ComparativeMeasureBrush
曾经在BulletGraph控制ComparativeMeasureBrush属性的值。QualityGoodBrush
曾经在BulletGraph控制QualityGoodBrush属性的值。QualityPoorBrush
曾经在BulletGraph控制QualityPoorBrush属性的值。QualitySatisfactoryBrush
曾经在BulletGraph控制QualitySatisfactoryBrush属性的值。TimeBarSelectionBorderBrush
曾经的边框颜色SelectionThumbHandle TimeBar SelectionRange元素控制。TimelineInstantItemBrush
曾经的背景TimelineInstantItem (TimelineInstantItemControlStyle)。TimelineItemBrush
曾经的背景TimelineItem (TimelineItemControlStyle)。
上面的刷子都是之前没有可用的版本R3 2021WPF的UI套件。
其他属性
DisabledOpacity
曾经在他们的控制禁用状态。HeaderBorderThickness
曾经为包装头元素的边界。介绍主要用于HighContrast颜色变化的值1。对于所有其他颜色变化其默认值是0。还用于选项卡控件的项目在鼠标状态。ReadOnlyOpacity
曾经在他们的控制只读状态。FocusThickness
曾经为焦点的厚度边界的按钮。它的类型是厚度
和它的默认值2、2、2、2。
的
HeaderBorderThickness
与之前版本不可用R3 2021WPF的UI套件。
改变调色板颜色
Office2019主题提供了动态变化的调色板颜色负责刷用于我们的控制。他们的违约是上面说。这种机制是用来修改主题的颜色变化。
通用命名约定:Office2019Palette.Palette[名字]。颜色
负责[名字]刷
——如。Office2019Palette.Palette.AccentBackgroundColor
设置颜色telerik: Office2019Resource ResourceKey = AccentBackgroundBrush
改变背后的颜色可以在代码中实现。
设置面板的颜色
Office2019Palette.Palette.AccentBackgroundColor= Color.FromRgb(255, 0, 0);
改变主题的变化
Office2019主题有三个颜色变化,灵感来自MS Office中使用的颜色。光线变化对应于微软的彩色办公主题,灰色,深灰色Office2019主题和黑暗,黑Office2019主题。下面的例子演示了支持能力之间切换光
,灰色的
,黑暗
和HighContrast
颜色调色板通过调用LoadPreset ()
方法如下所示:
改变主题的颜色变化
/ /默认颜色变异Office2019Palette.LoadPreset (Office2019Palette.ColorVariation.Light);/ /灰色颜色变异Office2019Palette.LoadPreset (Office2019Palette.ColorVariation.Gray);/ /深色变异Office2019Palette.LoadPreset (Office2019Palette.ColorVariation.Dark);/ / HighContrast色差Office2019Palette.LoadPreset (Office2019Palette.ColorVariation.HighContrast);
所有变化的主题是设计时考虑到一个特定的背景和推荐使用这样一个背景在您的应用程序在处理它——它是由主题调色板的
BaseBackgroundBrush
。
改变字体属性
当使用Office2019
你可以动态地改变主题字形大小
和FontFamily
应用程序中的所有组件的属性一样你在所有其他可用的主题支持ThemePalette。
字形大小和FontFamily属性都是公开的,可以很容易地修改单点。最常用的字体大小的主题是与价值12并且可以通过修改Office2019Palette.Palette.FontSize
财产以同样的方式在另一个主题,支持主题面板。
中使用的默认字体的主题Segoe UI
。
对于复杂场景强烈推荐设置字形大小属性只有在应用程序初始化。
下面的例子显示了默认的字体大小和家庭。
默认的字形大小
Office2019Palette.Palette.FontSize= 12; Office2019Palette.Palette.FontSizeS = 13; Office2019Palette.Palette.FontSizeM = 14; Office2019Palette.Palette.FontSizeL = 16;
改变主题的字形大小和FontFamily
私人空间OnButtonChangeFontSizeClick(对象发送方,RoutedEventArgs e) {Office2019Palette.Palette。字形大小= 18;Office2019Palette.Palette。FontFamily= new FontFamily("Calibri Italic"); }
使用符号
的Office2019
主题也使用Telerik Web UI
字体字形默认情况下。的RadGlyph
提供了一个轻量级的,灵活的和design-time-friendly实现我们的字形字体。
你可以阅读更多关于RadGlyphRadGlyph概述文章和字体字形的范围字体字形概述文章。
使用主题助手
的ThemeHelper类是用于Office2019主题。它公开了一组附加属性,可以用来直接修改一个特定的外观基本控制而不需要改变其控制模板。
这个例子显示了一个RadToggleButton
控制修改不同的州通过画笔ThemeHelper
类:
通过ThemeHelper RadToggleButton的视觉外观类
< telerik: RadToggleButton内容=“RadToggleButton”保证金= " 10 " xmlns:助手= " = Telerik.Windows clr-namespace: Telerik.Windows.Controls.Theming.Helpers;装配。助手:ThemeHelper控制”。MouseOverBrush = " {telerik: Office2019Resource ResourceKey = AccentMouseOverBrush}”助手:ThemeHelper。PressedBrush = " {telerik: Office2019Resource ResourceKey = ValidationBrush}”助手:ThemeHelper。CheckedBrush = " {telerik: Office2019Resource ResourceKey = AccentMainBrush} " / >
设置白色变化
有一些内置的主题颜色的变化——光、灰色和黑色。您可以自定义光线变化,让它看起来像微软的白色办公室主题通过改变几个颜色的属性主题面板。
为了实现这一点,首先确保光变异应用。这是默认的,所以不需要显式的行动。然后,设置以下颜色属性:
应用面板颜色
Office2019Palette.Palette。ButtonBackgroundColor= (Color)ColorConverter.ConvertFromString("#FFFFFF"); Office2019Palette.Palette.BaseBackgroundColor = (Color)ColorConverter.ConvertFromString("#FFFFFF"); Office2019Palette.Palette.AlternativeBackgroundColor = (Color)ColorConverter.ConvertFromString("#FAFAFA"); Office2019Palette.Palette.SecondaryBackgroundColor = (Color)ColorConverter.ConvertFromString("#F1F1F1");
改变不透明度
如果你需要改变残疾人的不透明度和只读的元素,您可以轻松地通过使用DisabledOpacity
和ReadOnlyOpacity
Office2019Palette的属性。默认值是0.3和0.6分别。
改变不透明度
Office2019Palette.Palette。DisabledOpacity = 0.5;Office2019Palette.Palette。ReadOnlyOpacity = 0.5;
合并修改面板资源StyleManager主题的方法
当修改字体、颜色或其他资源Office2019Palette
和StyleManager
作为主题化机制、主题的ResourceDictionary
需要合并App.xaml文件以应用更改。
合并的主题ResourceDictionary App.xaml
<应用程序。> < ResourceDictionary > < ResourceDictionary资源。MergedDictionaries > < telerik: Office2019ResourceDictionary / > < / ResourceDictionary。MergedDictionaries > < / ResourceDictionary > < / Application.Resources >