Disable a MenuItem when TextBox of UserControl is empty - wpf

In my main Window I have a MenuItem and a UserControl. I would like to disable/enable the MenuItem if one of the TextBoxes inside the UserControl is empty/not empty respectively.
Given a UserControl named ContactDetails and a TexBox called ContactNameTextBox, here's my xaml code for the MenuItem:
<MenuItem x:Name="DeleteContact"
Header="Delete Contact"
IsEnabled="{Binding ElementName=ContactDetails.ContactNameTextBox,Path=Text.Length, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
For some reason, the MenuItem always stays enabled. What am I missing?

You are binding to the length of the Text but you need a Converter from length to a bool, because IsEnabled property expects a bool.
public class NumToBoolConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
if (value!=null && value is int )
{
var val = (int)value;
return (val==0) ? false : true;
}
return null;
}
public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
if (value!=null && value is bool )
{
var val = (bool)value; return val ? 1 : 0;
}
return null;
}
}
Add a local xmlns for this and a resource.
xmlns:local="clr-namespace:YourNamespace"
and this is the reference to the converter class.
<local:NumToBoolConverter x:Key="NumToBoolConverter"/>
In your Binding section add this :
Converter={StaticResource NumToBoolConverter}
This can be your final MenuItem definition:
<MenuItem x:Name="DeleteContact"
Header="Delete Contact"
IsEnabled="{Binding ElementName=ContactDetails.ContactNameTextBox,
Path=Text.Length,
Converter={StaticResource NumToBoolConverter},
Mode=TwoWay,
UpdateSourceTrigger=PropertyChanged}"/>

There are a couple of problems with your binding. The first is that you specified a two-way binding. That implies that you want to write back to the 'length' property in your textbox. Since it is readonly you can't.
Normally you should get an error for this:
A TwoWay or OneWayToSource binding cannot work on the read-only
property 'Length' of type 'System.String'.
Now strangely enough, the binding does work after that. But that is REALLY not the right way. The magic of .NET is allowing a 0 to be interpreted as 'false'. But it is not a safe binding. As Olaru said in his answer, the length property is an integer and the IsEnabled field is looking for a bool. What if you wanted to bind to the 'visibility' property?
So what is the best way to handle this then? Converters are definitely one choice, and in many cases the best choice. The advantage to converters is that they can be re-used in similar cases. We have a library full of converters that we use very often. Olaru has described how to do that, so I won't repeat what he has already said.
In some cases though, it is beneficial to know a different way. A datatrigger will allow you to do the same kind of thing as a converter. It is a one-way binding. Here is an example.
<MenuItem x:Name="DeleteContact" Header="Delete Contact">
<MenuItem.Style>
<Style TargetType="{x:Type MenuItem}" BasedOn="{StaticResource {x:Type MenuItem}}">
<Setter Property="MenuItem.IsEnabled" Value="true"/>
<Style.Triggers>
<DataTrigger Binding="{Binding Text.Length, ElementName=ContactNameTextBox}" Value="0">
<Setter Property="MenuItem.IsEnabled" Value="false"/>
</DataTrigger>
</Style.Triggers>
</Style>
</MenuItem.Style>
</MenuItem>
No code necessary!!
There are plenty of arguments about the pros and cons of converters and datatriggers. But the main thing is to know that there are more than one way to do what you are asking.

Related

How to bind to a specific Item property within the style setter of ItemContainerStyle?

I have an issue that isn't breaking anything in my code, it's just causing a bunch of obnoxious warnings and time spent resolving binding expressions. I would like to solve it.
Specifically, here is one of the warnings I get:
System.Windows.Data Error: 2 : Cannot find governing FrameworkElement
or FrameworkContentElement for target element.
BindingExpression:Path=Color; DataItem=null; target element is
'SolidColorBrush'; target property is 'Color' (type 'Color')
(I get two more for Opacity and DashStyle, but for brevity, I'll stick with color for this question).
Here is the relevant code:
<z:ClassWithMyItems ItemsSource="{Binding Items}">
<z:ClassWithMyItems.ItemContainerStyle>
<Style TargetType={"x:Type z:MyItem}">
<Setter Property="Pen">
<Setter.Value>
<Pen Thickness="2.0" options:Freeze="True" DashStyle="{Binding DashStyle}">
<Pen.Brush>
<SolidColorBrush Color={Binding Color, Converter={StaticResource ColorConverter}}" Opacity="{Binding Opacity}" />
</Pen.Brush>
</Pen>
</Setter.Value>
</Setter>
</Style>
</z:Feature.ItemContainerStyle>
</z:ClassWithMyItems>
(NOTE: The DataContext is set to an instance of a MyClassWithItems that has a set of 'Items', and each Item has a 'Color' property).
From what I can tell, xaml is first looking within the DataContext of the SolidColorBrush, and complaining that it's null. Then, after a couple of tries, it finally decides to look at the DataContext of the Item, upon which it finds the 'Color' property and stops complaining. (I know this because it eventually resolves and renders correctly).
This is a bunch of work that can be saved if it knew to look at the DataContext of the 'Item' first instead of the SolidColorBrush. For the life of me I cannot figure out how to do this.
Any suggestions? Thanks!
As suggested by #Clemens you could use a converter that returns a Pen. Just bind to the MyItem object itself:
public class PenConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
MyItem myItem = value as MyItem;
if (myItem == null)
return value;
Pen pen = new Pen();
pen.DashStyle = myItem.DashStyle;
pen.Brush = myItem.Brush;
//...
pen.Freeze();
return pen;
}
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
{
throw new NotSupportedException();
}
}
XAML:
<Style TargetType="{x:Type z:MyItem}">
<Style.Resources>
<local:PenConverter x:Key="converter" />
</Style.Resources>
<Setter Property="Pen" Value="{Binding Path=., Converter={StaticResource converter}}" />
</Style>

Expander Header text binding not respecting the string formatter

I have a WPF Expander in my project. I have applied styles to the expander to change the header colors and whatnot. After doing so, my data is still bound to the Header's content area, but it just binds the raw data and not the formatting I have specified. See the examples below.
<Style x:Key="ValkyrieStyleExpander" TargetType="{x:Type Expander}">
<!-- Ommiting property setters for brevity -->
<Setter Property="HeaderTemplate">
<Setter.Value>
<DataTemplate>
<TextBlock Text="{Binding}" FontWeight="Bold"
Foreground="White" VerticalAlignment="Center" />
</DataTemplate>
</Setter.Value>
</Setter>
</Style>
And here is the actual declaration with the appropriate binding syntax
<Expander Style="{StaticResource ValkyrieStyleExpander}"
Margin="10,10,0,0"
Width="670"
Header="{Binding PolicyNumber, StringFormat=Policy {0}}">
</Expander>
We I run the app, the header should display "Policy 123456", and before I restyled the expander it did so. But now when I run the app, the header just shows "123456". I am still kind of a babe-in-the-woods when it comes to databinding, so I am not sure really what I need to do to get the new style to show the correct data. Hopefully the answer isn't to add it to the ValkyrieStyleExpender's Header Template style, as that would defeat the purpose of having a style (Not all expanders in the project are for displaying a particular policy)
StringFormat usually does not work when using it within the Expander.Header property since the property is not of type string.
You will need to write your own class derived from IFormatter that implements the formatted string you'd actually define in the property. I've researched quite a bit and found no better solution for this issue.
The class may look as follows:
public class SomeClass: IFormattable
{
public string ToString(string format, IFormatProvider formatProvider)
{
if(format == "n")
{
return "This is the formatted string";
}
else
{
return "this is the non-formatted string";
}
}
}
And you would use it in your style this way:
Setter Property="HeaderStringFormat" Value="n" />
If the string format is not working for you, you can easily implement a converter, such as...
#region PolicyConverter (ValueConverter)
public class PolicyConverter : MarkupExtension, IValueConverter
{
public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
if (value != null)
{
return "Policy " + value.ToString();
}
return null;
}
public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
return null;
}
public override object ProvideValue(IServiceProvider serviceProvider)
{
return this;
}
}
#endregion
...and then declare it in your Xaml...
<Window.Resources>
<pc:PolicyConverter x:Key="PolicyConverter"/>
</Window.Resources>
...and finally reference it in your template. I did not use (or modify) your ValkyrieStyleExpander code. But to verify the correctness of this approach, I used the following declaration as a functional prototype...
<Expander Name="Expander1">
<Expander.HeaderTemplate>
<DataTemplate>
<TextBlock
Text="{Binding ElementName=Expander1,
Path=DataContext.PolicyNumber,
Converter={StaticResource PolicyConverter}}"/>
</DataTemplate>
</Expander.HeaderTemplate>
</Expander>
...and it worked as expected (.net 4.5). If you needed to evacuate the in-lined templating to a global declaration in your Xaml, this would also make a great starting point.

IValueConverter not updating wpf TextBox

I'm using IValueConverter to convert a double to string. The string created by the converter is not displayed in a corresponding textbox. For example, if a user enters 1.1 my value converter might format it as '1'. However I still see '1.1' in the textbox. I verified in debugger that the converter's Convert() method is called and that it returns '1'. Am I missing something basic?
The converter's method is as follows:
public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
if (value == null)
{
return string.Empty;
}
if (value is double && targetType == typeof(string))
{
string format = parameter == null ? "{0:F2}" : (string)parameter;
string formatted = string.Format(format, value);
return formatted;
}
return value.ToString();
}
The xaml is as follows:
<TextBox x:Name="balance" Grid.Row="12" Grid.Column="1"
Text="{Binding Balance, Converter={StaticResource nullableConverter}, ConverterParameter=\{0:F0 \}, ValidatesOnDataErrors=True, ValidatesOnExceptions=True, UpdateSourceTrigger=PropertyChanged}" Width="90" TextAlignment="Right" />
Thanks.
I believe this is a known issue with using a converter on TextBox.Text when UpdateSourceTrigger=PropertyChanged
This usually isn't an ideal solution because as the user types, the value gets converted, so this can cause confusion and unexpected results for the user.
For example, if the user types "1.1", and the value keeps getting truncated to "1" after each key press, the sequence of events would be:
type 1
type .
converter changes value to 1
type 1
value is now 11
As a workaround, I usually recommend applying formatting only when the TextBox does not have focus using a Trigger, like this:
<Style TargetType="{x:Type TextBox}">
<Setter Property="Text" Value="{Binding Balance, Converter={StaticResource nullableConverter}, ConverterParameter=\{0:F0 \}" />
<Style.Triggers>
<Trigger Property="IsKeyboardFocusWithin" Value="True">
<Setter Property="Text" Value="{Binding Balance, ValidatesOnDataErrors=True, ValidatesOnExceptions=True, UpdateSourceTrigger=PropertyChanged}" />
</Trigger>
</Style.Triggers>
</Style>
Your format item (stuff inside curly braces) is malformed.
Instead of
ConverterParameter=\{0:F0 \}
Try
ConverterParameter='{}{0:F0} '
However, I wonder if setting Binding.StringFormat property wouldn't be enough? The conversion will be handled for you (forth and back) and you'll have validation working too (at least for the case when user inputs a non-number text).
Make the binding two way so it flows in both directions.
It's only going to run that converter when the Binding object recognizes that the "Balance" property of your ViewModel has changed.
Does your ViewModel have both a public Getter and Setter?
If so, the Binding should be invoking the property setter on the ViewModel as the data in the textbox is changing.
Next, you need to signal back to the View (and the binding) that the property value has changed. Does your viewmodel implement INotifyPropertyChanged? Is your viewmodel raising the the PropertyChanged event (with PropertyName of "Balance") when the Balance setter is called?

WPF Radio Button Fires Converter in strange order

I am writing a simple program using the MVVM Model on WPF. Basicly when the user clicks a radio button in a group of radio buttons, it will update a property in the View Model with the new Account number. The problem is, when I click a different button the converter is called for the new button IsChecked Binding, and then after that it runs the converter for the previous button IsChecked binding(for losing its checked status).
This is causing a problem, since the new button is updating the value of the property with the correct account number, and then when the old button calls the converter, it gets converted back to the old value. I have hacked it to work by adding a static variable to the class, and if the IsChecked property is false, just return the value in the static variable. Does anyone have a better solution for Short Circuting the Converter Call on the box that loses its checked status. Code is below:
Converter:
class RadioToAccountConverter : IValueConverter
{
static string myValue; //HACK TO MAKE IT WORK
object IValueConverter.Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
return parameter.ToString();
}
object IValueConverter.ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
if ((bool)value)
{
myValue = parameter.ToString(); // Hack to make it work
return parameter.ToString();
}
return myValue; // Hack to make it work
}
}
XAML:
<RadioButton Foreground="HotPink"
Grid.Column="0"
Content="6087721"
Tag="6087721"
IsChecked="{Binding Account, Converter={StaticResource Radio2Value}, Mode=OneWayToSource, ConverterParameter=6087721}">
</RadioButton>
<RadioButton Foreground="HotPink"
Grid.Column="1"
Content="BFSC120"
IsChecked="{Binding Account, Converter={StaticResource Radio2Value}, Mode=OneWayToSource, ConverterParameter='BFSC120'}">
</RadioButton>
<RadioButton Foreground="HotPink"
Grid.Column="2"
Content="BFSC121"
IsChecked="{Binding Account, Converter={StaticResource Radio2Value}, Mode=OneWayToSource, ConverterParameter=BFSC121}">
</RadioButton>
<RadioButton Foreground="HotPink"
Grid.Column="3"
Content="BFSC206"
IsChecked="{Binding Account, Converter={StaticResource Radio2Value}, Mode=OneWayToSource, ConverterParameter=BFSC206}">
</RadioButton>
Property:
public const string AccountPropertyName = "Account";
private string _account;
/// <summary>
/// Sets and gets the Account property.
/// Changes to that property's value raise the PropertyChanged event.
/// </summary>
public string Account
{
get
{
return _account;
}
set
{
if (_account == value)
{
return;
}
RaisePropertyChanging(AccountPropertyName);
_account = value;
RaisePropertyChanged(AccountPropertyName);
}
}
Any Help Is Greatly Appreciated.
Based on what I understand, you want to give users the ability to select from a list of account numbers. You're choice of presentation (view) is a group of radio buttons.
If that is true, the key part is this: you want to give users the ability to select from a list of account numbers. This means that the control you should use is a ListBox, since users should select one of the appropriate values. Now, since you are looking to use radio buttons visually, you simply have to supply an alternative ItemsSource.ItemContainerStyle.
XAML:
<ListBox ItemsSource="{Binding AccountNumbers, Mode=OneWay">
<ListBox.ItemContainerStyle>
<Style TargetType="{x:Type ListBoxItem}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ListBoxItem}">
<RadioButton Content="{Binding}" IsChecked="{Binding IsSelected, RelativeSource={x:Static RelativeSource.TemplatedParent}}"/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ListBox.ItemContainerStyle>
</ListBox>
Note that you'll need to add another property on your ViewModel (I named it AccountNumbers). For example:
public IReadOnlyCollection<string> AccountNumbers { ... }
Of course, the underlying collection can be a observable if you need it to be, but that's really up to you.
If you define a GroupName on each RadioButton, WPF will manage the IsChecked states for you.
You could bind the state with a {Binding SomeProperty, Mode=OneWayToSource} if you want the ViewModel to be aware of state.
One way to approach this would be to bind each RadioButton's IsChecked property to the whole ViewModel, just bind it to something like
IsChecked="{Binding WholeViewModel, Mode=OneWayToSource, Converter={StaticResource MyRadioButtonConverter}, ConverterParameter=SomethingReallyUnique}"
...where the public property WholeViewModel is a property that does a return this; in the getter. This would let you have access to the ViewModel and enough information to query the ViewModel to see if the radiobutton should be checked or not. But, only do this if the GroupName DependencyProperty doesn't somehow give you what you want.
To process the clicking on the buttons, then, to actually change the ViewModel state, you'd implement an ICommand in your ViewModel and bind the Command property of the RadioButton to {Binding ClickedCommand} and define a CommandParameter with any string you want. This approach will guarantee a one-way relationship to the IsChecked state, preventing the thing you're describing, I think.
I'll work up a code sample if you think you'd like one.

Animate DataGrid cell background on TargetUpdated event

I've been searching all over for a solution, but found nothing that works.
The problem is simple:
DataGrid (read-only) is bound to a collection of objects (implementing INotifyPropertyChanged)
When certain properties of data objects change, the cell background should animate (eg. from Red to Transparent)
I've tried using styles with EventTrigger (TargetUpdated) to start a Storyboard, but it has side-effects, all cells' background is animated when DataGrid is first populated, and also when it is scrolled or re-sorted.
I know there are few other similar questions, but I didn't see a working solution.
Has anyone been able to achieve this? I'd very much prefer not to have any code-behind, but if it's necessary, I'll live with it...
EDIT:
I've noticed there is some confusion as to what I'm trying to achieve:
Let's say a cell (and it's underlying property on data object) has a value "A". At some point it changes to "B" (e.g. update from a server). At this point the background should 'flash' (e.g. 1 second animation from Red to Transparent). At all other times the background should be Transparent.
I've been finally pointed in right direction on MS forum, the solution is to use attached behavior that registers OnTargetUpdated handler and starts s Storyboard. I've tried this approach earlier, but apparently one must start the Storyboard only if IsLoaded property of the cell is true. That gets rid of side effects I mentioned above.
Here is the link to the forum post.
add a converter something like this :
namespace System.Converters
{
//Converter for cell animation
public class flashConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
string cellvalue = value.ToString();
return cellvalue = ("place the condition here");
}
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
{
return false;
}
}
}
in your MainWindow.xaml.cs add the namespace
xmlns:loc="clr-namespace:YourProjectName.Converters"
in your resources add the following :
<DataGrid.Resources>
<loc:flashConverter x:Key="SomeConverter"></loc:flashConverter>
</DataGrid.Resources>
In your DatagridTextColumn add the following :
<DataGridTextColumn Header="yourDatagridHeader" IsReadOnly="True" Binding="{Binding Path=yourDatagridHeader}">
<DataGridTextColumn.ElementStyle>
<!--Style to implement the datagrid cell animation for yourDatagridcell-->
<Style TargetType="{x:Type TextBlock}">
<Style.Triggers>
<DataTrigger Binding="{Binding yourDatagridHeader}" Value="Give your condition here">
<!-#E6F85050 is the hexadecimal value for RED-->
<Setter Property="Background" Value="#E6F85050"/>
</DataTrigger>
<DataTrigger Binding="{Binding yourDatagridHeader}" Value="Give your condition here">
<Setter Property="Background" Value="give the hexadecimal value for transparent here "/>
</DataTrigger>
</Style.Triggers>
</Style>
</DataGridTextColumn.ElementStyle>
</DataGridTextColumn>
hope this helps !

Resources