圖像庫
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方法重載,或者在設計時單擊相應的智能標記菜單項。