图像库
DevExpress WinForms控件支持传统的Raster图像和矢量(SVG)图像。Raster图像更常用,但在高DPI屏幕上变得模糊。矢量图像可以在没有质量损失的情况下调整大小。
这两种类型的图像通常都是从ImageOptions属性组中设置的。
C#
simpleButton1.ImageOptions.SvgImage = SampleApp.Properties.Resources.security_high; simpleButton2.ImageOptions.Image = SampleApp.Properties.Resources.Apple;
VB.NET
simpleButton1.ImageOptions.SvgImage = SampleApp.Properties.Resources.security_high simpleButton2.ImageOptions.Image = SampleApp.Properties.Resources.Apple
在设计时,使用像Image Gallery或Image Picker这样的工具来快速将所需的图像分配给控件。
Raster图像库
当您在设计时为DevExpress UI元素指定图标时,将出现“Image Picker”对话框。切换到“DX Raster Images”选项卡,从DevExpress浏览Raster图标。
类别
图像库中的图标按类别分组:arrows, mail, navigation, zoom等等,您可以取消选中类别并将它们从库中排除。
尺寸
图像库图标有两种尺寸——16x16和32x32像素。
Collection
此组中的复选框处您可以按配色方案选择图像。
- Colored -包含volumetric multi-color图像(默认)。
- Grayscale-与monochrome UIs相匹配的平面深灰色图标。
- DevAV -平面Hybrid UI图标。
- Office 2013—Office 20132013-inspired图标。
添加到项目/表单资源
可以将选定的图标添加到窗体或项目资源中。如果您在项目资源中添加了DevExpress图标,可以在标准的Visual Studio“Select Resource”对话框中将这个图标分配给非DevExpress控件。
搜索Panel
您可以通过名称查找图标(例如,“Save”)。
SVG 图像库
当您指定矢量图像时可以调用SVG 图像库。(例如:BarItemImageOptions.SvgImage 属性)
此图库中您不能按大小和颜色过滤矢量图标,因为它们是根据SvgImageSize或其他控件设置缩放的,并根据应用的skin/palette自动更改其颜色。有关更多信息,请参阅:如何绘制和使用SVG图像。
图像选择器
单击表单的智能标记并选择“Image Picker”选项,一次为多个UI元素设置图标。Image Picker是一个非模态面板,可以停靠在Visual Studio中的任何地方。您可以将该面板中的图标拖放到UI元素上,图像选择器可以读取选定元素的标题,并建议与该名称匹配的图标。
图像选择器使您能够分配矢量图像和 raster图像。
使用Browse选项卡从磁盘去加载影像(在v21.1及更高版本中可用)。
您可以将选定的Image Picker图像复制到项目资源中。要做到这一点,请使用panel右上角的按钮。
下面的代码说明了如何在代码中检索资源图像。
C#
simpleButton1.ImageOptions.SvgImage = SampleApp.Properties.Resources.security_high;
VB.NET
simpleButton1.ImageOptions.SvgImage = SampleApp.Properties.Resources.security_high
Image URI (Context-Dependent Raster Images)
Image URI特性使您能够使用传统的raster图像,根据应用的skin和控件的size自动调整其大小和配色方案。下面的截图演示了工具栏按钮的Context-Dependent Images如何出现在不同的skins中:
支持Context-Dependent Images的DevExpress控件和组件显示了DxImageUri类型的ImageUri属性,DxImageUri. Uri属性使您可以按名称访问DX Image Gallery中的图像。例如,在上面的图片中,工具栏按钮的ImageUri属性使用“Open”, “Save”, “SaveAll”, “Undo” 以及“Redo” 的名称,指定图像名称后,控件将自动显示与应用的skin/image size相对应的图像。
在设计时,要为控件/组件指定context-dependent image,请选择control/component并单击ImageUri属性旁边的省略号按钮。单击省略号按钮调用Image Picker,选择一个图像并单击OK。
在代码中,您可以指定ImageUri属性,如下所示。图像名称可以在 Image Picker对话框中找到,将鼠标悬停在图像上,以工具提示的形式显示其通用名称。
C#
barButtonItem1.ImageUri.Uri = "SaveAll";
VB.NET
barButtonItem1.ImageUri.Uri = "SaveAll"
显示图像的大小(以及它的配色方案)是自动确定的。例如,Ribbon Control中的按钮可以显示大图标或小图标,Ribbon控件可以在控件宽度减小时自动显示较小的按钮图像。当您使用ImageUri属性将图像分配给Ribbon按钮时,Ribbon会自动指定图标大小。
请注意
在使用URI名称分配图像时,应该调用DevExpress.Images.v22.2库。
Image Collections
Image Gallery不包含从代码访问其图像的公共API。作为一种变通方法,您可以用Gallery图标填充任何DevExpress图像集合(ImageCollection, SvgImageCollection),并使用该集合在代码中分配图像。
C#
myButton.Image = imageCollection1.Images[2];
VB.NET
myButton.Image = imageCollection1.Images[2]
还可以用存储在引用程序集中的图像填充这些集合。为此,请调用以程序集名称作为参数的Add方法重载,或者在设计时单击相应的智能标记菜单项。