圖像庫(kù)

---

立即下載DevExpress WinForms

DevExpress WinForms控件支持傳統(tǒng)的Raster圖像和矢量(SVG)圖像。Raster圖像更常用，但在高DPI屏幕上變得模糊。矢量圖像可以在沒有質(zhì)量損失的情況下調(diào)整大小。

這兩種類型的圖像通常都是從ImageOptions屬性組中設(shè)置的。

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

在設(shè)計(jì)時(shí)，使用像Image Gallery或Image Picker這樣的工具來(lái)快速將所需的圖像分配給控件。

Raster圖像庫(kù)

當(dāng)您在設(shè)計(jì)時(shí)為DevExpress UI元素指定圖標(biāo)時(shí)，將出現(xiàn)“Image Picker”對(duì)話框。切換到“DX Raster Images”選項(xiàng)卡，從DevExpress瀏覽Raster圖標(biāo)。

類別

圖像庫(kù)中的圖標(biāo)按類別分組:arrows, mail, navigation, zoom等等，您可以取消選中類別并將它們從庫(kù)中排除。

尺寸

圖像庫(kù)圖標(biāo)有兩種尺寸——16x16和32x32像素。

Collection

此組中的復(fù)選框處您可以按配色方案選擇圖像。

• Colored -包含volumetric multi-color圖像(默認(rèn))。
• Grayscale-與monochrome UIs相匹配的平面深灰色圖標(biāo)。
• DevAV -平面Hybrid UI圖標(biāo)。
• Office 2013—Office 20132013-inspired圖標(biāo)。

添加到項(xiàng)目/表單資源

可以將選定的圖標(biāo)添加到窗體或項(xiàng)目資源中。如果您在項(xiàng)目資源中添加了DevExpress圖標(biāo)，可以在標(biāo)準(zhǔn)的Visual Studio“Select Resource”對(duì)話框中將這個(gè)圖標(biāo)分配給非DevExpress控件。

搜索Panel

您可以通過(guò)名稱查找圖標(biāo)(例如，“Save”)。

SVG 圖像庫(kù)

當(dāng)您指定矢量圖像時(shí)可以調(diào)用SVG 圖像庫(kù)。（例如：BarItemImageOptions.SvgImage 屬性）

此圖庫(kù)中您不能按大小和顏色過(guò)濾矢量圖標(biāo)，因?yàn)樗鼈兪歉鶕?jù)SvgImageSize或其他控件設(shè)置縮放的，并根據(jù)應(yīng)用的skin/palette自動(dòng)更改其顏色。有關(guān)更多信息，請(qǐng)參閱:如何繪制和使用SVG圖像。

圖像選擇器

單擊表單的智能標(biāo)記并選擇“Image Picker”選項(xiàng)，一次為多個(gè)UI元素設(shè)置圖標(biāo)。Image Picker是一個(gè)非模態(tài)面板，可以停靠在Visual Studio中的任何地方。您可以將該面板中的圖標(biāo)拖放到UI元素上，圖像選擇器可以讀取選定元素的標(biāo)題，并建議與該名稱匹配的圖標(biāo)。

圖像選擇器使您能夠分配矢量圖像和 raster圖像。

使用Browse選項(xiàng)卡從磁盤去加載影像(在v21.1及更高版本中可用)。

您可以將選定的Image Picker圖像復(fù)制到項(xiàng)目資源中。要做到這一點(diǎn)，請(qǐng)使用panel右上角的按鈕。

下面的代碼說(shuō)明了如何在代碼中檢索資源圖像。

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特性使您能夠使用傳統(tǒng)的raster圖像，根據(jù)應(yīng)用的skin和控件的size自動(dòng)調(diào)整其大小和配色方案。下面的截圖演示了工具欄按鈕的Context-Dependent Images如何出現(xiàn)在不同的skins中:

支持Context-Dependent Images的DevExpress控件和組件顯示了DxImageUri類型的ImageUri屬性，DxImageUri. Uri屬性使您可以按名稱訪問(wèn)DX Image Gallery中的圖像。例如，在上面的圖片中，工具欄按鈕的ImageUri屬性使用“Open”, “Save”, “SaveAll”, “Undo” 以及“Redo” 的名稱，指定圖像名稱后，控件將自動(dòng)顯示與應(yīng)用的skin/image size相對(duì)應(yīng)的圖像。

 在設(shè)計(jì)時(shí)，要為控件/組件指定context-dependent image，請(qǐng)選擇control/component并單擊ImageUri屬性旁邊的省略號(hào)按鈕。單擊省略號(hào)按鈕調(diào)用Image Picker，選擇一個(gè)圖像并單擊OK。

在代碼中，您可以指定ImageUri屬性，如下所示。圖像名稱可以在 Image Picker對(duì)話框中找到，將鼠標(biāo)懸停在圖像上，以工具提示的形式顯示其通用名稱。

C#

barButtonItem1.ImageUri.Uri = "SaveAll";

VB.NET

barButtonItem1.ImageUri.Uri = "SaveAll"

顯示圖像的大小(以及它的配色方案)是自動(dòng)確定的。例如，Ribbon Control中的按鈕可以顯示大圖標(biāo)或小圖標(biāo)，Ribbon控件可以在控件寬度減小時(shí)自動(dòng)顯示較小的按鈕圖像。當(dāng)您使用ImageUri屬性將圖像分配給Ribbon按鈕時(shí)，Ribbon會(huì)自動(dòng)指定圖標(biāo)大小。

請(qǐng)注意

在使用URI名稱分配圖像時(shí)，應(yīng)該調(diào)用DevExpress.Images.v22.2庫(kù)。

Image Collections

Image Gallery不包含從代碼訪問(wèn)其圖像的公共API。作為一種變通方法，您可以用Gallery圖標(biāo)填充任何DevExpress圖像集合(ImageCollection, SvgImageCollection)，并使用該集合在代碼中分配圖像。

C#

myButton.Image = imageCollection1.Images[2];

VB.NET

myButton.Image = imageCollection1.Images[2]

還可以用存儲(chǔ)在引用程序集中的圖像填充這些集合。為此，請(qǐng)調(diào)用以程序集名稱作為參數(shù)的Add方法重載，或者在設(shè)計(jì)時(shí)單擊相應(yīng)的智能標(biāo)記菜單項(xiàng)。