BarItem.Glyph Property

Gets or sets the item’s small image. This is a dependency property.

Namespace: DevExpress.Xpf.Bars

Assembly: DevExpress.Xpf.Core.v18.2.dll

Declaration

C#

public ImageSource Glyph { get; set; }

VB.NET

Public Property Glyph As ImageSource

Property Value

Type	Description
ImageSource	An ImageSource object that specifies the item’s small image.

Remarks

You can assign a small and large image to a bar item via the BarItem.Glyph and BarItem.LargeGlyph properties, respectively. If both large and small images are assigned, the bar item’s links will display either image, according to the settings provided by bar objects (a bar item, bar, menu and bar manager). By default, if a bar item link is displayed within a toolbar, the large image will be displayed. If a bar item link is displayed within sub-menus, small images will be used.

Use the BarManager.ToolbarGlyphSize and BarManager.MenuGlyphSize properties to specify the size of images for bar item links displayed in bars and menus, respectively. You can override this setting for individual bars, popup menus, submenus and link containers via the Bar.GlyphSize, PopupMenu.GlyphSize, BarSubItem.SubItemsGlyphSize and BarLinkContainerItem.SubItemsGlyphSize properties, respectively. It’s also possible to override this setting for individual bar items via the BarItem.GlyphSize property.

If the GlyphSize setting is set to Small, but a small image is not assigned to the Glyph property, no image is displayed. This is also the case when the GlyphSize setting is set to Large, but no large image is assigned to the BarItem.LargeGlyph property.

Control images can be automatically substituted for other images based on the app context (the system DPI setting, the application UI culture, paint theme and touch mode availability). See the following topic to learn more:Automatically Choosing Images Based on App Context.

Example

This example shows how to create bar items and associate them with a custom Format category.

The following image shows the result:

Note

A complete sample project is available at https://github.com/DevExpress-Examples/how-to-create-bar-items-and-associate-them-with-categories-e1543.

Application.xaml.vb

Imports System
Imports System.Collections.Generic
Imports System.Configuration
Imports System.Data
Imports System.Linq
Imports System.Windows

Namespace WpfApplication3
    ''' <summary>
    ''' Interaction logic for App.xaml
    ''' </summary>
    Partial Public Class App
        Inherits Application

        Private Sub OnAppStartup_UpdateThemeName(ByVal sender As Object, ByVal e As StartupEventArgs)

            DevExpress.Xpf.Core.ApplicationThemeHelper.UpdateApplicationThemeName()
        End Sub
    End Class
End Namespace

Window1.xaml (VB.NET)

<Window x:Class="WpfApplication3.Window1" 
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:dx="http://schemas.devexpress.com/winfx/2008/xaml/core" 
        xmlns:dxb="http://schemas.devexpress.com/winfx/2008/xaml/bars"
        Title="Window1" Height="300" Width="300" >
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <dxb:BarContainerControl Grid.Row="0">
            <dxb:ToolBarControl Caption="Main Toolbar">
                <dxb:BarCheckItem Content="Bold" Glyph="{dx:DXImage Image=Bold_16x16.png}" CategoryName="Format" 
                                  CheckedChanged="checkBtnBold_CheckChanged"/>
                <dxb:BarCheckItem Content="Italic" Glyph="{dx:DXImage Image=Italic_16x16.png}" CategoryName="Format" 
                                  CheckedChanged="checkBtnItalic_CheckChanged"/>
            </dxb:ToolBarControl>
        </dxb:BarContainerControl>
    </Grid>
</Window>

Application.xaml

<Application x:Class="WpfApplication3.App" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" StartupUri="Window1.xaml" Startup="OnAppStartup_UpdateThemeName">
    <Application.Resources>

    </Application.Resources>
</Application>

Window1.xaml.vb

Imports System
Imports System.Collections.Generic
Imports System.Linq
Imports System.Text
Imports System.Windows
Imports System.Windows.Controls
Imports System.Windows.Data
Imports System.Windows.Documents
Imports System.Windows.Input
Imports System.Windows.Media
Imports System.Windows.Media.Imaging
Imports System.Windows.Navigation
Imports System.Windows.Shapes
Imports DevExpress.Xpf.Bars

Namespace WpfApplication3
    ''' <summary>
    ''' Interaction logic for Window1.xaml
    ''' </summary>
    Partial Public Class Window1
        Inherits Window

        Public Sub New()
            InitializeComponent()
        End Sub

        Private Sub checkBtnItalic_CheckChanged(ByVal sender As Object, ByVal e As ItemClickEventArgs)
            '...
        End Sub

        Private Sub checkBtnBold_CheckChanged(ByVal sender As Object, ByVal e As DevExpress.Xpf.Bars.ItemClickEventArgs)
            '...
        End Sub
    End Class
End Namespace

Window1.xaml.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using DevExpress.Xpf.Bars;

namespace WpfApplication3 {
    /// <summary>
    /// Interaction logic for Window1.xaml
    /// </summary>
    public partial class Window1 : Window {
        public Window1() {
            InitializeComponent();
        }

        void checkBtnItalic_CheckChanged(object sender, ItemClickEventArgs e) {
            //...
        }

        void checkBtnBold_CheckChanged(object sender, DevExpress.Xpf.Bars.ItemClickEventArgs e) {
            //...
        }
    }
}

Related GitHub Examples

The following code snippets (auto-collected from DevExpress Examples) contain references to the Glyph property.

Note

The algorithm used to collect these code examples remains a work in progress. Accordingly, the links and snippets below may produce inaccurate results. If you encounter an issue with code examples below, please use the feedback form on this page to report the issue.

C#

Reporting_how-to-remove-standard-bar-items-and-add-custom-ones-to-the-documentviewer-toolbar-e2974/CS/WpfApplication1/MainWindow.xaml#L48

<dxb:BarManager.Items>
    <dxb:BarButtonItem x:Name="biOpen" Content="{dxp:PrintingStringId StringId=Open}" Command="{Binding Model.OpenCommand, ElementName=documentViewer1, FallbackValue={StaticResource disabledCommand}}" Glyph="{dxp:PrintingResourceImage ResourceName=Images/BarItems/Open_16x16.png}" Hint="{dxp:PrintingStringId StringId=Open_Hint}" LargeGlyph="{dxp:PrintingResourceImage ResourceName=Images/BarItems/Open_32x32.png}"/>
    <dxb:BarButtonItem x:Name="biSave" Content="{dxp:PrintingStringId StringId=Save}" Command="{Binding Model.SaveCommand, ElementName=documentViewer1, FallbackValue={StaticResource disabledCommand}}" Glyph="{dxp:PrintingResourceImage ResourceName=Images/BarItems/Save_16x16.png}" Hint="{dxp:PrintingStringId StringId=Save_Hint}" LargeGlyph="{dxp:PrintingResourceImage ResourceName=Images/BarItems/Save_32x32.png}"/>

Reporting_how-to-show-a-ribbon-preview-window-for-link-e4407/CS/RibbonPrintPreviewDemo/MainWindow.xaml#L48

<dxb:BarManager.Items>
    <dxb:BarButtonItem x:Name="biOpen" Content="{dxp:PrintingStringId StringId=Open}" Command="{Binding Model.OpenCommand, ElementName=viewer, FallbackValue={StaticResource disabledCommand}}" Glyph="{dxp:PrintingResourceImage ResourceName=Images/BarItems/Open_16x16.png}" Hint="{dxp:PrintingStringId StringId=Open_Hint}" LargeGlyph="{dxp:PrintingResourceImage ResourceName=Images/BarItems/Open_32x32.png}" />
    <dxb:BarButtonItem x:Name="biSave" Content="{dxp:PrintingStringId StringId=Save}" Command="{Binding Model.SaveCommand, ElementName=viewer, FallbackValue={StaticResource disabledCommand}}" Glyph="{dxp:PrintingResourceImage ResourceName=Images/BarItems/Save_16x16.png}" Hint="{dxp:PrintingStringId StringId=Save_Hint}" LargeGlyph="{dxp:PrintingResourceImage ResourceName=Images/BarItems/Save_32x32.png}" />

wpf-docklayoutmanager-merge-ribbon-controls/CS/WpfApplication1/MainWindow.xaml#L13

<dxb:BarButtonItem x:Name="biNew" Content="New" LargeGlyph="{dx:DXImage Image=New_32x32.png}"/>
<dxb:BarButtonItem x:Name="biOpen" Content="Open" Glyph="{dx:DXImage Image=Open_16x16.png}"/>
<dxb:BarButtonItem x:Name="biSave" Content="Save" Glyph="{dx:DXImage Image=Save_16x16.png}"/>

Reporting_wpf-end-user-report-designer-how-to-customize-the-ribbon-toolbar-t281615/CS/ReportDesignerClassicViewTemplate.xaml#L38

<dxr:RibbonPageGroup Caption="Report">
    <dxb:BarButtonItem Content="New" RibbonStyle="Large" Glyph="{dx:DXImage Image=New_16x16.png}" LargeGlyph="{dx:DXImage Image=New_32x32.png}" Command="{Binding Path=(designer:ReportDesigner.Designer).Commands.NewDocument, RelativeSource={RelativeSource Self}}">
        <dxb:BarButtonItem.IsVisible>

wpf-create-a-ribboncontrol/CS/RibbonControl_Ex/MainWindow.xaml#L96

<dxb:BarButtonItem Name="bAbout" Content="About"
               Glyph="{dxc:DXImage Image=Info_16x16.png}"
               LargeGlyph="{dxc:DXImage Image=Info_32x32.png}"

VB.NET

dxrichedit-for-wpf-how-to-customize-the-hover-menu-e2753/VB/DXRichEdit_HoverMenu/MainWindow.xaml.vb#L48

item1.Command = cmd_toAdd
item1.Glyph = cmd_toAdd.Glyph
e.Menu.ItemLinks.Add(item1)