It is sometimes interesting to have an animated icon to tell to our user that their command is actually processing. Typically for a refresh icon. So, two solution: you could use an animated GIF and use an external library like WpfAnimatedGif (or the XAML MediaElement), or use an rounded icon (like this one) and create […]
WPF – Animated text
Sometimes it can be useful to have an animated text even in WPF. Typically a “Loading…”, where the 3 dots are moving one by one. Here is a simple way to do an animation with text:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 | <StackPanel Orientation="Horizontal" Margin="20"> <Button Content="Start" Height="20" Command="{Binding StartCommand}" VerticalAlignment="Top" Margin="5" /> <Button Content="Stop" Height="20" Command="{Binding StopCommand}" VerticalAlignment="Top" Margin="5" /> <TextBlock Text="{Binding Status}" Margin="5"> <TextBlock.Style> <Style TargetType="{x:Type TextBlock}"> <Style.Triggers> <DataTrigger Binding="{Binding Status}" Value="Running"> <DataTrigger.EnterActions> <BeginStoryboard Name="animationRefresh"> <Storyboard> <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Text" Duration="00:00:01.0" RepeatBehavior="Forever"> <DiscreteObjectKeyFrame KeyTime="00:00:00.00" Value="Running "/> <DiscreteObjectKeyFrame KeyTime="00:00:00.25" Value="Running. "/> <DiscreteObjectKeyFrame KeyTime="00:00:00.50" Value="Running.. "/> <DiscreteObjectKeyFrame KeyTime="00:00:00.75" Value="Running..."/> </ObjectAnimationUsingKeyFrames> </Storyboard> </BeginStoryboard> </DataTrigger.EnterActions> <DataTrigger.ExitActions> <StopStoryboard BeginStoryboardName="animationRefresh"/> </DataTrigger.ExitActions> </DataTrigger> </Style.Triggers> </Style> </TextBlock.Style> </TextBlock> </StackPanel> |
With a ViewModel looking like (using PRISM 6.3):
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 | using Prism.Commands; using Prism.Mvvm; namespace AnimateTextWPF { public class MainWindowVM : BindableBase { #region Properties private string _status; public string Status { get { return _status; } set { SetProperty(ref _status, value); } } #endregion #region Commands private DelegateCommand _startCommand; public DelegateCommand StartCommand => _startCommand ?? (_startCommand = new DelegateCommand(Start)); private DelegateCommand _stopCommand; public DelegateCommand StopCommand => _stopCommand ?? (_stopCommand = new DelegateCommand(Stop)); #endregion public MainWindowVM() { this.Status = "Not started yet"; } private void Start() { this.Status = "Running"; } private void Stop() { this.Status = "Stopped"; } } } |
Here is another post talking about animated images. Happy […]
WPF – Nullable binding
Hello Devz, Imagine you have a TextBox binded to a nullable integer and you put a value in it. Now let’s say you delete this value. You expect to have your value to be null. To be able to do that, you need to update the properties of you binding like this:
1 | <TextBox Text="{Binding Value, UpdateSourceTrigger=PropertyChanged, TargetNullValue=''}"/> |
Please notice […]
WPF – MessageBox on top of the other Views
Hello devz, It happens sometimes with WPF that a popup or a MessageBox is hidden and can block the whole application. To avoid this, just do the following:
1 | var msgBoxResult = MessageBox.Show(Application.Current.MainWindow, "Are you sure?", "Delete item", MessageBoxButton.YesNo, MessageBoxImage.Question); |
The Application.Current.MainWindow is the solution… But please pay attention that this parameter can be different! Indeed it’s an implementation of IWin32Window that will own the modal dialog […]
C# – Coma and Dot decimal separator
Hi peeps, You probably know the common issue with the decimal seprator. Depending on the country, the keyboard or what your client wants (which can be variable…), the separator will be a coma or a dot (or even something else…). In my case, the Culture is “en-US“, on a Belgian keyboard where the decimal separator […]
WPF – Change color of a row in a DataGrid
Hi folks, Today we will see how to change the color or a row depending on the value of the content. To do that, create a simple View:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 | <Window x:Class="DataTrigger_Test.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d" Title="MainWindow" Height="350" Width="525"> <Grid> <DataGrid Margin="10" ItemsSource="{Binding Users}" AutoGenerateColumns="False" ColumnWidth="*" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" HorizontalContentAlignment="Stretch" EnableRowVirtualization="false" EnableColumnVirtualization="false" CanUserAddRows="False" CanUserReorderColumns="False" CanUserResizeColumns="True"> <DataGrid.CellStyle> <Style TargetType="{x:Type DataGridCell}"> <Style.Triggers> <DataTrigger Binding="{Binding FirstName}" Value="Dolores"> <Setter Property="Foreground" Value="Green" /> </DataTrigger> <DataTrigger Binding="{Binding FirstName}" Value="Maeve"> <Setter Property="Foreground" Value="Blue" /> </DataTrigger> </Style.Triggers> </Style> </DataGrid.CellStyle> <DataGrid.Columns> <DataGridTextColumn Header="FirstName" Binding="{Binding FirstName}" MinWidth="150" /> <DataGridTextColumn Header="LastName" Binding="{Binding LastName}" MinWidth="150" /> </DataGrid.Columns> </DataGrid> </Grid> </Window> |
The important thing here are the DataTriggers. If a condition is met, it will apply a value to a property. For example, the first trigger is: […]
WPF – DataGrid with single click checkbox
The problem with the checkbox in a WPF DataGrid By default, if you place a checkbox in a WPF DataGrid, you will have to click twice to check or uncheck the checkbox. And there is a logical explanation. The first click will select the row in the DataGrid, and the second one, the checkbox in […]
WPF – Override Decimal Separator for the c
Lets say we want to keep the current en-US culture format but override the way the Decimal is represented (normaly with a dot (.) but here we want a coma instead (,).
1 2 3 4 5 6 | System.Threading.Thread.CurrentThread.CurrentUICulture = CultureInfo.GetCultureInfo("en-US"); var currentCulture = System.Threading.Thread.CurrentThread.CurrentCulture.Name; var ci = new CultureInfo(currentCulture) { NumberFormat = { NumberDecimalSeparator = "," } }; System.Threading.Thread.CurrentThread.CurrentCulture = ci; System.Threading.Thread.CurrentThread.CurrentUICulture = ci; FrameworkElement.LanguageProperty.OverrideMetadata(typeof(FrameworkElement), new FrameworkPropertyMetadata(XmlLanguage.GetLanguage(CultureInfo.CurrentCulture.IetfLanguageTag))); |
Enjoy!
WPF – Missing Underscore with Label or Che
Did you ever have a missing underscore with WPF? If you have a Label or a Checkbox containing underscores, the first underscore will not be displayed on screen. It is called the RecognizeAccessKey. Which allows you to reach the control with you keyboard by pressing ALT and the first lettre following the first underscore. So […]
WPF – MVVM – Get filtered values from a Gr
The goal of this article is to show how to get the filtered items from a GridView (here we will use Telerik RadGridView, but it should be the same for any Grid). This case is really useful if you need to apply some calculation on a filtered subset of the Data you’re displaying, while you’re […]