A good desktop application is more than just forms and input controls. Users expect intuitive navigation, quick access to common actions, visual feedback, and interactive controls.
WPF provides several built-in controls that help you create professional desktop applications with familiar user experiences.
In this article, you’ll learn about:
- Menu – Displays the application’s main menu.
- ContextMenu – Shows a menu when the user right-clicks.
- ToolBar – Provides quick access to frequently used commands.
- StatusBar – Displays application status and information.
- ProgressBar – Shows the progress of long-running operations.
- Slider – Allows users to select a numeric value by dragging a thumb.
In this article, you’ll learn:
- What each control is used for
- Key properties
- Common events
- XAML examples
- Best practices
- Real-world usage
1. Menu #
A Menu provides the primary navigation for an application. It typically appears at the top of the window and contains commands grouped into categories.
Common menu items include:
- File
- Edit
- View
- Tools
- Window
- Help
Basic Syntax #
<Menu>
<MenuItem Header="_File"/>
<MenuItem Header="_Edit"/>
<MenuItem Header="_Help"/>
</Menu>
Menu with Submenus #
<Menu>
<MenuItem Header="_File">
<MenuItem Header="New"/>
<MenuItem Header="Open"/>
<Separator/>
<MenuItem Header="Exit"/>
</MenuItem>
</Menu>
Menu Item with Shortcut Text #
<MenuItem Header="Save"
InputGestureText="Ctrl+S"/>
Important Properties #
| Property | Description |
|---|---|
| Header | Text displayed |
| Items | Child menu items |
| Icon | Displays an icon |
| IsEnabled | Enables or disables item |
| InputGestureText | Displays keyboard shortcut |
Common Event #
<MenuItem Header="Exit"
Click="Exit_Click"/>
Best Practice #
Group related commands together and keep the menu hierarchy simple and easy to navigate.
2. ContextMenu #
A ContextMenu appears when the user right-clicks on a control.
It displays actions related to the selected object.
Common uses include:
- Copy
- Paste
- Delete
- Rename
- Refresh
- Properties
Basic Syntax #
<TextBox>
<TextBox.ContextMenu>
<ContextMenu>
<MenuItem Header="Copy"/>
<MenuItem Header="Paste"/>
</ContextMenu>
</TextBox.ContextMenu>
</TextBox>
ContextMenu with Icons #
<MenuItem Header="Delete">
<MenuItem.Icon>
<TextBlock Text="🗑"/>
</MenuItem.Icon>
</MenuItem>
Important Properties #
| Property | Description |
|---|---|
| Items | Collection of menu items |
| PlacementTarget | Control that opened the menu |
| IsOpen | Indicates whether the menu is open |
Common Event #
<MenuItem Header="Delete"
Click="Delete_Click"/>
Best Practice #
Only include commands that are relevant to the selected item.
3. ToolBar #
What is a ToolBar? #
A ToolBar provides quick access to frequently used commands using buttons, drop-down lists, and other controls.
Examples include:
- New
- Save
- Undo
- Redo
- Search
Basic Syntax #
<ToolBar>
<Button Content="New"/>
<Button Content="Save"/>
<Button Content="Print"/>
</ToolBar>
ToolBar with Separator #
<ToolBar>
<Button Content="Cut"/>
<Button Content="Copy"/>
<Button Content="Paste"/>
<Separator/>
<Button Content="Print"/>
</ToolBar>
ToolBar with ComboBox #
<ToolBar>
<ComboBox Width="120">
<ComboBoxItem Content="100%"/>
<ComboBoxItem Content="150%"/>
</ComboBox>
</ToolBar>
Important Properties #
| Property | Description |
|---|---|
| Items | Controls inside toolbar |
| Orientation | Horizontal or Vertical |
| Background | Background color |
Common Event #
<Button Content="Save"
Click="Save_Click"/>
Best Practice #
Place only the most frequently used commands on the toolbar to avoid clutter.
4. StatusBar #
A StatusBar displays information about the current state of the application.
It usually appears at the bottom of the window.
Examples:
- Ready
- Saving…
- Connected
- Row Count
- Logged-in User
- Current Time
Basic Syntax #
<StatusBar>
<StatusBarItem>
<TextBlock Text="Ready"/>
</StatusBarItem>
</StatusBar>
Multiple Status Items #
<StatusBar>
<StatusBarItem>
<TextBlock Text="Ready"/>
</StatusBarItem>
<Separator/>
<StatusBarItem>
<TextBlock Text="User: Admin"/>
</StatusBarItem>
</StatusBar>
Important Properties #
| Property | Description |
|---|---|
| Items | Status items |
| Background | Background color |
| HorizontalAlignment | Alignment |
Best Practice #
Keep status messages short, informative, and up to date.
5. ProgressBar #
A ProgressBar visually indicates the progress of a task.
Examples include:
- File upload
- Software installation
- Report generation
- Data synchronization
- Database backup
Basic Syntax #
<ProgressBar Width="250"
Height="20"
Value="40"/>
Setting Minimum and Maximum Values #
<ProgressBar Minimum="0"
Maximum="100"
Value="75"/>
Indeterminate Progress #
<ProgressBar Width="250"
IsIndeterminate="True"/>
Use this when the duration of the task is unknown.
Important Properties #
| Property | Description |
|---|---|
| Minimum | Minimum value |
| Maximum | Maximum value |
| Value | Current progress |
| IsIndeterminate | Unknown progress |
| Orientation | Horizontal or Vertical |
Updating Progress #
<ProgressBar Name="progressBar"
Minimum="0"
Maximum="100"/>
Code Behind
progressBar.Value = 50;
Best Practice #
Use an indeterminate ProgressBar when the completion percentage cannot be calculated.
6. Slider #
A Slider lets users select a value by dragging a thumb along a track.
Examples include:
- Volume control
- Brightness adjustment
- Zoom level
- Rating
- Temperature selection
Basic Syntax #
<Slider Width="250"/>
Setting Range #
<Slider Minimum="0"
Maximum="100"
Value="25"/>
Tick Marks #
<Slider Minimum="0"
Maximum="100"
TickFrequency="10"
IsSnapToTickEnabled="True"/>
Vertical Slider #
<Slider Orientation="Vertical"
Height="150"
Minimum="0"
Maximum="100"/>
Data Binding #
<Slider Value="{Binding Volume}"/>
Important Properties #
| Property | Description |
|---|---|
| Minimum | Lowest value |
| Maximum | Highest value |
| Value | Current value |
| TickFrequency | Tick interval |
| IsSnapToTickEnabled | Snap to tick marks |
| Orientation | Horizontal or Vertical |
Common Event #
<Slider ValueChanged="Slider_ValueChanged"/>
Example Code Behind #
private void Slider_ValueChanged(
object sender,
RoutedPropertyChangedEventArgs<double> e)
{
volumeText.Text = e.NewValue.ToString("F0");
}
Best Practice #
Use a Slider only when users benefit from quickly selecting a value within a range. For precise numeric input, consider using a TextBox or NumericUpDown control.
Complete Example #
<DockPanel>
<Menu DockPanel.Dock="Top">
<MenuItem Header="_File">
<MenuItem Header="New"/>
<MenuItem Header="Open"/>
<MenuItem Header="Exit"/>
</MenuItem>
</Menu>
<ToolBarTray DockPanel.Dock="Top">
<ToolBar>
<Button Content="New"/>
<Button Content="Save"/>
<Button Content="Print"/>
</ToolBar>
</ToolBarTray>
<StackPanel Margin="20">
<Slider Width="250"
Minimum="0"
Maximum="100"
Value="40"/>
<ProgressBar Width="250"
Height="20"
Margin="0,20,0,0"
Value="40"/>
</StackPanel>
<StatusBar DockPanel.Dock="Bottom">
<StatusBarItem>
<TextBlock Text="Ready"/>
</StatusBarItem>
</StatusBar>
</DockPanel>
Summary #
Navigation and feedback controls make WPF applications easier to use and more professional.
- Menu provides structured access to application commands.
- ContextMenu displays actions specific to the selected item.
- ToolBar offers quick access to frequently used features.
- StatusBar communicates the application’s current status.
- ProgressBar gives users visual feedback during long-running tasks.
- Slider enables intuitive selection of values within a range.
These controls are commonly used together in professional desktop applications to improve usability, efficiency, and user experience.
In the next tutorial, you’ll learn about RichTextBox, Image, MediaElement, InkCanvas, Frame, and WebBrowser, exploring controls for displaying rich content, multimedia, and advanced user interaction.