windows10UWP:Segoe MDL2 图标指南
windows10 UWP 开发中,图标的使用非常广泛。为此,微软建议大家使用 Segoe MDL2 Assets 字体来获取图标。Segoe MDL2 Assets 包括了哪里图标,微软在
https://msdn.microsoft.com/zh-cn/library/windows/apps/jj841126.aspx
作出了详情的说明。本文复制记录了这个说明。
Segoe MDL2 图标指南
重要的 API
本文列出并提供了随附 Segoe MDL2 资源字体的字形使用指南。若要获取该字体,必须安装 Windows 10。
建议
- 仅当你能够显式指定 Segoe MDL2 Assets 字体时,才使用这些字形。
其他使用指南
Windows 8/8.1 Segoe UI Symbol 图标字体已替换为适用于 Windows 10 版本的 Segoe MDL2 Assets 字体。可采用与较旧的字体大致相同的方式来使用该字体,但许多字形已根据字体指标集在 Windows 10 图标样式中进行了重绘,以便图标能与字体的 Em 方形内的方格(而非版式基线)对齐。
Segoe UI Symbol 仍作为“传统”资源进行提供。但建议所有应用程序均更新为使用新 Segoe MDL2 Assets。
Segoe MDL2 Assets 字体中随附的大部分图标和 UI 控件均将映射至 Unicode 专用区 (PUA)。PUA 允许字体开发人员将专用 Unicode 值分配给未映射到现有代码点的字形。在创建符号字体时这非常有用,但也会带来互操作性问题。如果字体不可用,则字形将不显示。仅在你能够指定 Segoe MDL2 Assets 字体时才使用这些字形。
如果你使用磁贴,则无法使用这些字形,因为你无法指定磁贴字体而 PUA 字形不会通过字体回滚提供。
与 Segoe UI Symbol 不同,Segoe MDL2 Assets 字体中的图标的设计初衷并非是与文本一同内联使用。这意味着某些较旧的“技巧”(如渐进式展开箭头)将不再适用。同样,由于所有新图标的大小和位置均相同,因此无需将其设置为零宽度;只需确保它们成组工作即可。理想情况下,你可以覆盖已设计为成组工作的两个图标,以使其按次序出现。我们可能会因需允许在代码中进行着色而执行此操作。例如,U+EA3A 和 U+EA3B 是为“开始”磁贴锁屏提醒状态而创建的。由于它们已居中对齐,从而使得圆圈中的填充色会随状态的变化而变化。
Segoe UI Symbol 还依赖于“零宽度”字形以便进行分层和着色,正如本示例中所示,可将黑色边框 (U+E006) 绘制在零宽度红色心形 (U+E00B) 上面。
Segoe MDL2 Assets 中的所有字形的固定宽度均相同,且高度和左原点均保持一致,从而可通过直接在其上绘制字形来实现分层和着色效果。
大部分图标还具有镜像样式,以供在使用从右到左文本方向的语言(如阿拉伯语、波斯语和希伯来语)中使用。
如果你使用 C#/VB/C++ 和 XAML 开发应用,则可以选择使用 Symbol enumeration(而不是 Unicode ID)从 Segoe MDL2 Assets 字体指定字形。如果你使用 JavaScript 和 HTML 开发应用,则可以选择使用 AppBarIcon enumeration (而不是 Unicode ID)从 Segoe MDL2 Assets 字体指定字形。
还须记住,Segoe MDL2 Assets 字体中包含的图标远不止此处显示的这些。其中许多图标都是专为实现某种特殊目的而设计的,通常不作它用。
红心大战
代码 | 符号 | 枚举 | 描述 |
---|---|---|---|
U+E006 |
HeartLegacy |
带边框的心形 |
|
U+E0A5 |
HeartFillLegacy |
实心心形 |
|
U+E007 |
HeartBrokenLegacy |
断裂的心形 |
|
U+E00B |
HeartFillZeroWidthLegacy |
实心心形(零宽度) |
|
U+E00C |
HeartBrokenZeroWidthLegacy |
断裂的心形(零宽度) |
星形评级
代码 | 符号 | 枚举 | 描述 |
---|---|---|---|
U+E224 | RatingStarLegacy | 带边框的星形 | |
U+E0B4 | RatingStarFillLegacy | 实心星形 | |
U+E00A | RatingStarFillZeroWidthLegacy | 实心星形(零宽度) | |
U+E082 | RatingStarFillReducedPaddingHTMLLegacy | 实心星形(填充色较浅,适合在 HTML 中使用) | |
U+E0B5 | RatingStarFillSmallLegacy | 较小的星形 | |
U+E7C6 | HalfStarLeft | 一半 星形,左侧 | |
U+E7C7 |
HalfStarRight | 半星形, 右半侧 |
复选框组件
代码 | 符号 | 枚举 | 描述 |
U+E001 | CheckMarkLegacy | 对勾标志 | |
U+E002 | CheckboxFillLegacy | 已勾选的复选框 | |
U+E003 | CheckboxLegacy | 复选框 | |
U+E004 | CheckboxIndeterminateLegacy | 不确定状态 | |
U+E005 | CheckboxCompositeReversedLegacy | 已反转 | |
U+E008 | CheckMarkZeroWidthLegacy | 对勾标志(零宽度) | |
U+E009 | CheckboxFillZeroWidthLegacy | 已勾选(零宽度) | |
U+E0A2 | CheckboxCompositeLegacy | 复合 | |
U+E739 | 复选框 | 复选框 | |
U+E73A | CheckboxComposite | 复合复选框 | |
U+E73B | CheckboxFill | 已勾选的复选框 | |
U+E73C | CheckboxIndeterminate | 不确定状态 | |
U+E73D | CheckboxCompositeReversed | 反转复合 | |
U+E73E | CheckMark | 对勾标志 |
杂项
代码 | 符号 | 枚举 | 描述 |
---|---|---|---|
U+E134 |
CommentLegacy | 备注 | |
U+E113 |
FavoriteLegacy | ||
U+E195 |
UnfavoriteLegacy | ||
U+E734 |
FavoriteStar | 带边框的收藏夹 | |
U+E735 |
FavoriteStarFill | ||
U+E8D9 |
Unfavorite | ||
U+E19F |
LikeLegacy | ||
U+E19E |
DislikeLegacy | ||
U+E19D |
LikeDislikeLegacy | ||
U+E116 |
VideoLegacy | ||
U+E714 |
Video | ||
U+E20B |
MailMessageLegacy | 传统的邮件 | |
U+E248 |
ReplyLegacy | 答复 | |
U+E249 |
Favorite2Legacy | 已填充的收藏夹 | |
U+E24E |
Unfavorite2Legacy | 取消收藏 | |
U+E25A |
MobileContactLegacy | 手机联系人 | |
U+E25B |
BlockedLegacy | 阻止的联系人 | |
U+E25C |
TypingIndicatorLegacy | 正在键入指示器 | |
U+E25D |
PresenceChickletVideoLegacy | 视频在线状态 | |
U+E25E |
PresenceChickletLegacy | 在线状态 |
滚动条箭头
代码 | 符号 | 枚举 |
---|---|---|
U+E00E | ScrollChevronLeftLegacy | |
U+E00F | ScrollChevronRightLegacy | |
U+E010 | ScrollChevronUpLegacy | |
U+E011 | ScrollChevronDownLegacy | |
U+E016 | ScrollChevronLeftBoldLegacy | |
U+E017 | ScrollChevronRightBoldLegacy | |
U+E018 | ScrollChevronUpBoldLegacy | |
U+E019 | ScrollChevronDownBoldLegacy |
后退按钮
后退按钮的旧版字形提供了 2 种不同大小,以便外环的权重在为 20pt 和 42pt 时保持一致。还提供两个新的比例镶边后退按钮。这些字形设计用于支持分层。
代码 | 符号 | 枚举 | 描述 |
---|---|---|---|
U+E0C4 | BackBttnArrow20Legacy | 后退按钮箭头, 20pt | |
U+E0A6 | BackBttnArrow42Legacy | 后退按钮箭头, 42pt | |
U+E0AD | BackBttnMirroredArrow20Legacy | 后退按钮镜像箭头反转, 20pt | |
U+E0AB | BackBttnMirroredArrow42Legacy | 后退按钮镜像箭头反转, 42pt | |
U+E830 | ChromeBack | Chrome 后退按钮 | |
U+EA47 | ChromeBackMirrored | Chrome 后退镜像按钮 |
HTML 的后退箭头
添加其他代码以创建环绕这些字形的圆环。
代码 | 符号 | 枚举 | 描述 |
---|---|---|---|
U+E0D5 | ArrowHTMLLegacy | 适用于 HTML 的箭头 | |
U+E0AE | ArrowHTMLMirroredLegacy | U+E0D5 镜像版 |
应用栏字形
针对 AppBar 使用以下列表中的字形。依照约定,这些字形通过其枚举名称进行引用。并且它们均设计为 20x20px 的图标,且其周围未环绕圆环。
代码 | 符号 | 枚举 | 描述 |
---|---|---|---|
U+E8FB | Accept | ||
U+E910 | Accounts | ||
U+E710 | Add | ||
U+E8FA | AddFriend | ||
U+E7EF | Admin | ||
U+E8E3 | AlignCenter | ||
U+E8E4 | AlignLeft | ||
U+E8E2 | Alignright | ||
U+E71D | AllApps | ||
U+E723 | Attach | ||
U+E8A2 | AttachCamera | ||
U+E8D6 | Audio | ||
U+E72B | Back | ||
U+E73F | BackToWindow | ||
U+E8F8 | BlockContact | ||
U+E8DD | Bold | ||
U+E8A4 | Bookmarks | ||
U+E7C5 | BrowsePhotos | ||
U+E8FD | BulletedList | ||
U+E8EF | Calculator | ||
U+E787 | Calendar | ||
U+E8BF | CalendarDay | ||
U+E8F5 | CalendarReply | ||
U+E8C0 | CalendarWeek | ||
U+E722 | Camera | ||
U+E711 | Cancel | ||
U+E8BA | Caption | ||
U+E7F0 | CC | ||
U+E8EA | Cellphone | ||
U+E8C1 | Characters | ||
U+E894 | Clear | ||
U+E8E6 | ClearSelection | ||
U+E89F | ClosePane | ||
U+E753 | Cloud | ||
U+E90A | Comment | ||
U+E77B | Contact | ||
U+E8D4 | Contact2 | ||
U+E779 | ContactInfo | ||
U+E8CF | ContactPresence | ||
U+E8C8 | Copy | ||
U+E7A8 | Crop | ||
U+E8C6 | Cut | ||
U+E74D | Delete | ||
U+E8F0 | Directions | ||
U+E8D8 | DisableUpdates | ||
U+E8CD | DisconnectDrive | ||
U+E8E0 | Dislike | ||
U+E90E | DockBottom | ||
U+E90C | DockLeft | ||
U+E90D | DockRight | ||
U+E8A5 | Document | ||
U+E896 | Download | ||
U+E70F | Edit | ||
U+E899 | Emoji | ||
U+E76E | Emoji2 | ||
U+E728 | FavoriteList | ||
U+E734 | FavoriteStar | ||
U+E735 | FavoriteStarFill | ||
U+E71C | Filter | ||
U+E11A | FindLegacy | ||
U+E7C1 | Flag | ||
U+E8B7 | Folder | ||
U+E8D2 | Font | ||
U+E8D3 | Fontcolor | ||
U+E8E7 | FontDecrease | ||
U+E8E8 | FontIncrease | ||
U+E8E9 | FontSize | ||
U+E72A | Forward | ||
U+E908 | FourBars | ||
U+E740 | FullScreen | ||
U+E774 | Globe | ||
U+E8AD | Go | ||
U+E8FC | GoToStart | ||
U+E8D1 | GoToToday | ||
U+E778 | Hangup | ||
U+E897 | Help | ||
U+E8C5 | HideBCC | ||
U+E7E6 | Highlight | ||
U+E80F | Home | ||
U+E8B5 | Import | ||
U+E8B6 | ImportAll | ||
U+E8C9 | Important | ||
U+E8DB | Italic | ||
U+E765 | KeyboardClassic | ||
U+E89B | LeaveChat | ||
U+E8F1 | Library | ||
U+E8E1 | Like | ||
U+E8DF | LikeDislike | ||
U+E71B | Link | ||
U+EA37 | List | ||
U+E81D | Location | ||
U+E715 | |||
U+E8A8 | MailFill | ||
U+E89C | MailForward | ||
U+E8CA | MailReply | ||
U+E8C2 | MailReplyAll | ||
U+E912 | Manage | ||
U+E8CE | MapDrive | ||
U+E707 | Mappin | ||
U+E77C | Memo | ||
U+E8BD | Message | ||
U+E720 | Microphone | ||
U+E712 | More | ||
U+E8DE | MoveToFolder | ||
U+E90B | MusicInfo | ||
U+E74F | Mute | ||
U+E8F4 | NewFolder | ||
U+E78B | NewWindow | ||
U+E893 | Next | ||
U+E905 | OneBar | ||
U+E8E5 | OpenFile | ||
U+E8DA | OpenLocal | ||
U+E8A0 | OpenPane | ||
U+E7AC | OpenWith | ||
U+E8B4 | Orientation | ||
U+E7EE | OtherUser | ||
U+E1CE | OutlineStarLegacy | ||
U+E7C3 | Page | ||
U+E77F | Paste | ||
U+E769 | Pause | ||
U+E716 | People | ||
U+E8D7 | Permissions | ||
U+E717 | Phone | ||
U+E780 | PhoneBook | ||
U+E718 | Pin | ||
U+E768 | Play | ||
U+E8F3 | PostUpdate | ||
U+E8FF | Preview | ||
U+E8A1 | PreviewLink | ||
U+E892 | Previous | ||
U+E8D0 | Priority | ||
U+E8A6 | ProtectedDocument | ||
U+E8C3 | Read | ||
U+E7A6 | Redo | ||
U+E72C | Refresh | ||
U+E8AF | Remote | ||
U+E738 | Remove | ||
U+E8AC | Rename | ||
U+E90F | Repair | ||
U+E8EE | RepeatAll | ||
U+E8ED | RepeatOne | ||
U+E730 | ReportHacked | ||
U+E8EB | Reshare | ||
U+E7AD | Rotate | ||
U+E89E | RotateCamera | ||
U+E74E | Save | ||
U+E78C | SaveLocal | ||
U+E8FE | Scan | ||
U+E8B3 | SelectAll | ||
U+E724 | Send | ||
U+E7B5 | SetLockScreen | ||
U+E97B | SetTile | ||
U+E713 | Settings | ||
U+E72D | Share | ||
U+E719 | Shop | ||
U+E8C4 | ShowBCC | ||
U+E8BC | ShowResults | ||
U+E8B1 | Shuffle | ||
U+E786 | Slideshow | ||
U+E1CF | SolidStarLegacy | ||
U+E8CB | Sort | ||
U+E71A | Stop | ||
U+E913 | Street | ||
U+E8AB | Switch | ||
U+E8F9 | SwitchApps | ||
U+E895 | Sync | ||
U+E8F7 | SyncFolder | ||
U+E8EC | Tag | ||
U+E907 | ThreeBars | ||
U+E7C9 | TouchPointer | ||
U+E78A | Trim | ||
U+E906 | TwoBars | ||
U+E89A | TwoPage | ||
U+E8DC | Underline | ||
U+E7A7 | Undo | ||
U+E8D9 | UnFavorite | ||
U+E77A | UnPin | ||
U+E8F6 | UnSyncFolder | ||
U+E74A | Up | ||
U+E898 | Upload | ||
U+E8AA | VideoChat | ||
U+E890 | View | ||
U+E8A9 | ViewAll | ||
U+E767 | Volume | ||
U+E8B8 | Webcam | ||
U+E909 | World | ||
U+E904 | ZeroBars | ||
U+E71E | Zoom | ||
U+E8A3 | ZoomIn | ||
U+E71F | ZoomOut |
电池图标
代码 | 符号 | 枚举 | 代码 | 符号 | 枚举 |
---|---|---|---|---|---|
E996 | BatteryUnknown | EC02 | MobBatteryUnknown | ||
E850 | Battery0 | EBA0 | MobBattery0 | ||
E851 | Battery1 | EBA1 | MobBattery1 | ||
E852 | Battery2 | EBA2 | MobBattery2 | ||
E853 | Battery3 | EBA3 | MobBattery3 | ||
E854 | Battery4 | EBA4 | MobBattery4 | ||
E855 | Battery5 | EBA5 | MobBattery5 | ||
E856 | Battery6 | EBA6 | MobBattery6 | ||
E857 | Battery7 | EBA7 | MobBattery7 | ||
E858 | Battery8 | EBA8 | MobBattery8 | ||
E859 | Battery9 | EBA9 | MobBattery9 | ||
E83F | Battery10 | EBA0 | MobBatter10 | ||
E85A | BatteryCharging0 | EBAB | MobBatteryCharging0 | ||
E85B | BatteryCharging1 | EBAC | MobBatteryCharging1 | ||
E85C | BatteryCharging2 | EBAD | MobBatteryCharging2 | ||
E85D | BatteryCharging3 | EBAE | MobBatteryCharging3 | ||
E85E | BatteryCharging4 | EBAF | MobBatteryCharging4 | ||
E85F | BatteryCharging5 | EBB0 | MobBatteryCharging5 | ||
E860 | BatteryCharging6 | EBB1 | MobBatteryCharging6 | ||
E861 | BatteryCharging7 | EBB2 | MobBatteryCharging7 | ||
E862 | BatteryCharging8 | EBB3 | MobBatteryCharging8 | ||
E83E | BatteryCharging9 | EBB4 | MobBatteryCharging9 | ||
ea93 | BatteryCharging10 | EBB5 | MobBatteryChargin10 | ||
E863 | BatterySaver0 | EBB6 | MobBatterySaver0 | ||
E864 | BatterySaver1 | EBB7 | MobBatterySaver1 | ||
E865 | BatterySaver2 | EBB8 | MobBatterySaver2 | ||
E866 | BatterySaver3 | EBB9 | MobBatterySaver3 | ||
E867 | BatterySaver4 | EBBA | MobBatterySaver4 | ||
E868 | BatterySaver5 | EBBB | MobBatterySaver5 | ||
E869 | BatterySaver6 | EBBC | MobBatterySaver6 | ||
E86A | BatterySaver7 | EBBD | MobBatterySaver7 | ||
E86B | BatterySaver8 | EBBE | MobBatterySaver8 | ||
EA94 | BatterySaver9 | EBBF | MobBatterySaver9 | ||
EA95 | BatterySaver10 | EBC0 | MobBatterySaver10 |
windows10UWP:Segoe MDL2 图标指南的更多相关文章
- 【Windows10】如何使用Segoe MDL2 Assets图标
众所周知,在Windows 10中,微软引入了汉堡菜单,方便Android和ios的开发者移植程序,而不需要单独为Windows设计一套UI.但有人可能发现在symbol icon里根本找不到所谓的汉 ...
- 【WIN10】Segoe MDL2 Assets
APP下載地址:https://www.microsoft.com/store/apps/9nblggh5k2hf 最近使用文本圖標Segoe MDL2 Assets時,使用字符映射表看,那個圖標真的 ...
- WPF 有用博客地址
增加智能感知的RichTextBox扩展控件(WPF) WPF自定义控件与样式(3)-TextBox & RichTextBox & PasswordBox样式.水印.Label标签. ...
- UWP tips (与wp8.1的不同)
一.异步调用之后,要更新UI时,代码如下 await Dispatcher.RunAsync(Windows.UI.Core.CoreDispatcherPriority.Normal, () =&g ...
- UWP-开发一个具有闹钟,天气预报,翻译,语音功能的Demo
UWP即Windows 10中的Universal Windows Platform简称.即Windows通用应用平台,在Windows 10 Mobile/Surface(Windows平板电脑)/ ...
- UWP 使用新版画中画 FontIcon —— 如何使用自定义字体 —— 简单分析Windows Calculator源代码
微软在新版UWP计算器中加入了一个“置顶”功能,它相当于我们之前看视频的“画中画”一样. 点击后窗体置顶,同时可以进行其他任务. 有的小伙伴说,不就是一个图标吗,去 Segoe MDL2 图标 把图标 ...
- 乘风破浪,Windows11设计和开发指导,全新图标字体和云母材质
Windows11全新的布局设计 Windows 11全新的布局设计已设计为支持现代应用体验.渐进的圆角.嵌套元素和一致的排水沟相结合,营造出柔和.平静.平易近人的效果,强调目的的统一和易用性. ht ...
- 背水一战 Windows 10 (45) - 控件(图标类): IconElement, SymbolIcon, FontIcon, PathIcon, BitmapIcon
[源码下载] 背水一战 Windows 10 (45) - 控件(图标类): IconElement, SymbolIcon, FontIcon, PathIcon, BitmapIcon 作者:we ...
- [WPF] 用 Effect 实现线条光影效果
1. 前言 几个月前 ChokCoco 大佬发布了一篇文章: CSS 奇技淫巧 | 妙用 drop-shadow 实现线条光影效果 在文章里实现了一个发光的心形线条互相追逐的效果: 现在正好有空就试试 ...
随机推荐
- iOS:翻页效果
// // main.m // Hello // // Created by lishujun on 14-8-28. // Copyright (c) 2014年 lishujun. All rig ...
- wcf安全
http://www.cnblogs.com/artech/archive/2011/07/07/customauthorization01.html 安全 http://www.cnblogs.co ...
- Seven Steps to Success Machine Learning in Practice
Seven Steps to Success Machine Learning in Practice Project failures in IT are all too common. The r ...
- Javascript函数中传递带空格的参数
通常在页面中要让某些内容点击后产 生点击事件(非页面跳转)都会使用onclick,但是这样不适于需要传递参数的情况,于是写成直接调用Javascript函数的方式:<a href=javascr ...
- Keil工程文件的建立、设置与目标文件的获得
单片机开发中除必要的硬件外,同样离不开软件,我们写的汇编语言源程序要变为 CPU 可以执行的机器码有两种方法,一种是手工汇编,另一种是机器汇编,目前已极少使用手工 汇编的方法了.机器汇编是通过汇编软件 ...
- 内存管理(memory allocation内存分配)
Memory management is the act of managing computer memory. The essential requirement of memory manage ...
- 【HDOJ】1150 Machine Schedule
匈牙利算法. #include <stdio.h> #include <string.h> #define MAXNUM 1005 char map[MAXNUM][MAXNU ...
- 深入浅出Node.js (附录B) - 调试Node
B.1 Debugger B.2 Node Inspector B.2.1 安装Node Inspector B.2.2 错误堆栈
- 低压差稳压器AMS1585
(1)高效线性稳压. (2)输出高达4.6A,最高输入电压15V,推荐最低压差1.5V(最低1.35V),最大压差12V. (3)两种封装:TO220(直插式),TO230(贴片). 典型电路如下图所 ...
- Oracle LOB
Oracle LOB Oracle .NET Framework 数据提供程序包括 OracleLob 类,该类用于使用 Oracle LOB 数据类型. OracleLob 可能是下列 Oracle ...