Skip to main content

DevExpress v24.2 Update — Your Feedback Matters

Our What's New in v24.2 webpage includes product-specific surveys. Your response to our survey questions will help us measure product satisfaction for features released in this major update and help us refine our plans for our next major release.

Take the survey Not interested

How to: Customize a SpinEdit to Display Currency Values

A SpinEdit editor allows you to operate with numeric values.

This document demonstrates how to create a SpinEdit control and customize it to show currency values.

#Create a New Project and Add a SpinEdit

  1. Run MS Visual Studio.
  2. Create a new WPF Application project. For this, choose New Project on the File menu or press Ctrl+Shift+N, and then choose WPF Application.
  3. Add a SpinEdit component to the project.

    To do this, open the Visual Studio toolbox, locate the “DX: Common Controls” tab, choose the SpinEdit toolbox item and drop it onto the window.

    <Window x:Class="How_to_SpinEdit.MainWindow"
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Height="300" Width="300" xmlns:dxe="http://schemas.devexpress.com/winfx/2008/xaml/editors" Title="Main Window">
        <Grid>
            <dxe:SpinEdit HorizontalAlignment="Center" Name="spinEdit1" Width="200" Height="40" VerticalAlignment="Center" />
        </Grid>
    </Window>
    

#Customize the SpinEdit

  1. Right click the SpinEdit and select Properties. Set the BaseEdit.DisplayFormatString property to ‘c2’ to display currency values.
  2. Set the SpinEdit.Increment property to 0.01 to specify a value by which the editor’s value changes each time the editor is spun.

    <Window x:Class="How_to_SpinEdit.MainWindow"
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Height="300" Width="300" xmlns:dxe="http://schemas.devexpress.com/winfx/2008/xaml/editors" Title="Main Window">
        <Grid>
            <dxe:SpinEdit HorizontalAlignment="Center" Name="spinEdit1" Width="200" Height="40" VerticalAlignment="Center" DisplayFormatString="c2" Increment="0.01" />
        </Grid>
    </Window>
    
  3. Run the application to see the result.

    SpinEdit MainWindow