这个示例展示了如何在设计时刻和运行时刻创建一个 In-Ribbon Gallery，它将包含三个 gallery 项 (图像)。结果显示在下面的插图中：

假设窗体中已经包含一个 RibbonControl 和为 gallery 项提供图像的 ImageCollection 对象 ( imageCollection1 和 imageCollection2 )。 imageCollection1 包含 gallery 项的常规图像，而 imageCollection2 包含了这些图像的放大版本，在鼠标指标停留在特定 gallery 项上时将显示其大图像。

设计时刻示例

创建和定制 gallery
打开 RibbonControl 的设计器，并切换到 Gallery 页面：

单击 Add Inplace Gallery(添加内置 Gallery) 按钮。这样新建一个表示 In-Ribbon gallery 的 RibbonGalleryBarItem 对象。

要访问 gallery 的设置，则确保所创建的 RibbonGalleryBarItem 对象被选中，然后在属性网格中展开 RibbonGalleryBarItem.Gallery 属性。设置 gallery 的属性，如下所示：
- BaseGallery.AllowHoverImages 设置为 true
此属性启用悬浮图像功能。在这种模式下，当鼠标指针停留某个 gallery 项上时，该项的悬浮图像将弹出。在下列步骤中，存储在 imageCollection2 中的悬浮图像将被指派到 gallery 项中。
- BaseGallery.ColumnCount 设置为 3
BaseGallery.ColumnCount 属性指定水平显式在 gallery 中的 gallery 项的数目。
- BaseGallery.Images 设置为 imageCollection1
此属性为 gallery 项指定常规图像集合，当 gallery 项处于常规状态中时将显示这些图像。
- BaseGallery.HoverImages 设置为 imageCollection2
此属性为 gallery 项指定悬浮图像集合。当鼠标指针移上 gallery 项上时，悬浮图像自动出现在 gallery 项上。

在下面的插图中，已修改的属性被加上标记：
添加 gallery 项
在设计时刻创建 In-Ribbon gallery 时，它已经包含了一个 gallery 项的容器——组。选中所创建的组，并单击 Add Item(添加项) 按钮。这将把一个 gallery 项添加到该组中。添加两个以上的项：

通过 GalleryItem.ImageIndex 和 GalleryItem.HoverImageIndex 属性，为每个 gallery item 都指定常规图像和悬浮图像。这些属性分别引用了 BaseGallery.Images 和 BaseGallery.HoverImages 集合中的图像。
显示 RibbonControl 内的 gallery
要在 RibbonControl 内显示所创建的 gallery，则激活设计器的 Ribbon Items (Ribbon 项) 页面。

确保在“Categories(类别)”组合框中的“(All Items - 所有项)”选项已经被选中。然后查找到所创建的 In-Ribbon gallery 并把它拖放到所需的 Ribbon 页面组。

现在 In-Ribbon gallery 已经出现在 RibbonControl 内。

运行项目，并把鼠标指针移上 gallery 项来查看运转中的悬浮图像功能：

运行时刻示例

下列代码与上面的设计时刻示例等效。

C#	复制代码
using DevExpress.XtraBars; using DevExpress.XtraBars.Ribbon; // Create a bar item that represents an In-Ribbon gallery. RibbonGalleryBarItem galleryBarItem = new RibbonGalleryBarItem(ribbonControl1.Manager); // Bind the image collections, which contain regular and hover images, to the gallery. galleryBarItem.Gallery.Images = imageCollection1; galleryBarItem.Gallery.HoverImages = imageCollection2; // Enable the hover images feature. galleryBarItem.Gallery.AllowHoverImages = true; // Create a gallery item group and add it to the gallery. GalleryItemGroup itemGroup1 = new GalleryItemGroup(); galleryBarItem.Gallery.Groups.Add(itemGroup1); // Create gallery items and add them to the group. GalleryItem item1 = new GalleryItem(); item1.ImageIndex = item1.HoverImageIndex = 0; GalleryItem item2 = new GalleryItem(); item2.ImageIndex = item2.HoverImageIndex = 1; GalleryItem item3 = new GalleryItem(); item3.ImageIndex = item3.HoverImageIndex = 2; itemGroup1.Items.AddRange(new GalleryItem[] { item1, item2, item3 }); // Specify the number of items to display horizontally. galleryBarItem.Gallery.ColumnCount = 3; // Display the created In-Ribbon gallery within the first RibbonControl's page group. ribbonControl1.Pages[0].Groups[0].ItemLinks.Add(galleryBarItem);

复制代码

using DevExpress.XtraBars;
using DevExpress.XtraBars.Ribbon;

// Create a bar item that represents an In-Ribbon gallery.
RibbonGalleryBarItem galleryBarItem = new RibbonGalleryBarItem(ribbonControl1.Manager);
// Bind the image collections, which contain regular and hover images, to the gallery. 
galleryBarItem.Gallery.Images = imageCollection1;            
galleryBarItem.Gallery.HoverImages = imageCollection2;
// Enable the hover images feature.
galleryBarItem.Gallery.AllowHoverImages = true;

// Create a gallery item group and add it to the gallery.
GalleryItemGroup itemGroup1 = new GalleryItemGroup();
galleryBarItem.Gallery.Groups.Add(itemGroup1);
// Create gallery items and add them to the group.
GalleryItem item1 = new GalleryItem();
item1.ImageIndex = item1.HoverImageIndex = 0;
GalleryItem item2 = new GalleryItem();
item2.ImageIndex = item2.HoverImageIndex = 1;
GalleryItem item3 = new GalleryItem();
item3.ImageIndex = item3.HoverImageIndex = 2;
itemGroup1.Items.AddRange(new GalleryItem[] { item1, item2, item3 });
// Specify the number of items to display horizontally.
galleryBarItem.Gallery.ColumnCount = 3;

// Display the created In-Ribbon gallery within the first RibbonControl's page group.
ribbonControl1.Pages[0].Groups[0].ItemLinks.Add(galleryBarItem);

Visual Basic	复制代码
Imports DevExpress.XtraBars Imports DevExpress.XtraBars.Ribbon ' Create a bar item that represents an In-Ribbon gallery. Dim galleryBarItem As New RibbonGalleryBarItem(RibbonControl1.Manager) ' Bind the image collections, which contain regular and hover images, to the gallery. galleryBarItem.Gallery.Images = ImageCollection1 galleryBarItem.Gallery.HoverImages = ImageCollection2 ' Enable the hover images feature. galleryBarItem.Gallery.AllowHoverImages = True ' Create a gallery item group and add it to the gallery. Dim itemGroup1 As New GalleryItemGroup() galleryBarItem.Gallery.Groups.Add(itemGroup1) ' Create gallery items and add them to the group. Dim item1 As New GalleryItem() item1.ImageIndex = 0 item1.HoverImageIndex = 0 Dim item2 As New GalleryItem() item2.ImageIndex = 1 item2.HoverImageIndex = 1 Dim item3 As New GalleryItem() item3.ImageIndex = 2 item3.HoverImageIndex = 2 itemGroup1.Items.AddRange(New GalleryItem() {item1, item2, item3}) ' Specify the number of items to display horizontally. galleryBarItem.Gallery.ColumnCount = 3 ' Display the created In-Ribbon gallery within the first RibbonControl's page group. RibbonControl1.Pages(0).Groups(0).ItemLinks.Add(galleryBarItem)

Visual Basic

复制代码

Imports DevExpress.XtraBars
Imports DevExpress.XtraBars.Ribbon

' Create a bar item that represents an In-Ribbon gallery.
Dim galleryBarItem As New RibbonGalleryBarItem(RibbonControl1.Manager)
'  Bind the image collections, which contain regular and hover images, to the gallery. 
galleryBarItem.Gallery.Images = ImageCollection1
galleryBarItem.Gallery.HoverImages = ImageCollection2
' Enable the hover images feature.
galleryBarItem.Gallery.AllowHoverImages = True

' Create a gallery item group and add it to the gallery.
Dim itemGroup1 As New GalleryItemGroup()
galleryBarItem.Gallery.Groups.Add(itemGroup1)
' Create gallery items and add them to the group.
Dim item1 As New GalleryItem()
item1.ImageIndex = 0
item1.HoverImageIndex = 0
Dim item2 As New GalleryItem()
item2.ImageIndex = 1
item2.HoverImageIndex = 1
Dim item3 As New GalleryItem()
item3.ImageIndex = 2
item3.HoverImageIndex = 2
itemGroup1.Items.AddRange(New GalleryItem() {item1, item2, item3})
' Specify the number of items to display horizontally.
galleryBarItem.Gallery.ColumnCount = 3

' Display the created In-Ribbon gallery within the first RibbonControl's page group.
RibbonControl1.Pages(0).Groups(0).ItemLinks.Add(galleryBarItem)