Binding to an element in the ObservableCollection - wpf

How do you make binding to a collection item in this case?
//Both collections have OnPropertyChanged("");
public ObservableCollection<Grid> ConnectorsGrids { get; set; }
public ObservableCollection<double> Connectors { get; set; }
//Coordinates collection
Connectors = new ObservableCollection<double>() { 10 , A - 20 };
ConnectorsGrids = new ObservableCollection<Grid>();
foreach (var e in Connectors)
{
ConnectorsGrids.Add(DrawConnector(new Thickness(e * YB1, 0, 0, 0)));
}
YB1 is the coefficient for the element's size. It is variable depending on the size of the screen
YB1 is not in any collection. Is a parameter in the class
DrawConnector() takes the margin as a parameter
I would like the margin to change depending on the size of the screen
At the moment, it calculates the output value and afterwards when changing the size of the screen, the changes remain

You can try this:
xaml:
<ItemsControl x:Name="PART_ItemsControl"
ItemsSource="{Binding Connectors}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<ContentControl Content="{Binding Converter={local:ToGridConverter}"/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
Converter:
sealed class ToGridConverter : MarkupExtension, IValueConverter{
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
if (value is double)
{
double e = (double)value;
return DrawConnector(new Thickness(e * YB1, 0, 0, 0));
}
return Binding.DoNothing;
}
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
{
throw new NotImplementedException();
}
private ToGridConverter _converter;
public override object ProvideValue(IServiceProvider serviceProvider)
{
if (_converter == null)
{
_converter = new ToGridConverter ();
}
return _converter;
}}

Related

wpf - bind polyline to custom class

Does anyone know whether it is possible to bind a polyline to a collection of custom objects?
For example, I have a class like so:
public class MyDataClass{
public double Value { get; set; } //I'd like to map this to a polyline point's x value
public double Position { get; set; } //I'd like to map this to a polyline point's y value
}
And I'd like to bind a polyline to a collection of those objects and translate the Value property to X and the Position property to Y.
Thanks!
Although already answered by Joseph, I'd like to add a shorter and more flexible implementation of the Convert method, which uses the LINQ Select method:
using System.Linq;
...
public object Convert(
object value, Type targetType, object parameter, CultureInfo culture)
{
var myDataCollection = value as IEnumerable<MyDataClass>;
if (myDataCollection == null)
{
return null;
}
return new PointCollection(
myDataCollection.Select(p => new Point(p.Value, p.Position)));
}
The Polyline is expecting a PointCollection of Points in order to draw them, you could use a converter to assure that :
Xaml
<Polyline Stretch="Fill" Grid.Column="0"
Name="Polyline" Stroke="Red"
Points="{Binding Points,Converter={StaticResource ToPointConverter}}">
</Polyline>
the converter is implemented like so:
public class ToPointConverter:IValueConverter
{
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
if (value == null) return null;
var pointCollection=new PointCollection();
(value as List<MyDataClass>).ForEach(x=>{pointCollection.Add(new Point()
{
X = x.Value,
Y = x.Position
});});
return pointCollection;
}
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
{
throw new NotImplementedException();
}
}
and in your codebehind or your Viewmodel define the List<MyDataClass> property :
public List<MyDataClass> Points { get; set; }
don't forget to set the DataContext and set the ToPointConverter in your resource.
`

WPF/XAML: How to make all text upper case in TextBlock?

I want all characters in a TextBlock to be displayed in uppercase
<TextBlock Name="tbAbc"
FontSize="12"
TextAlignment="Center"
Text="Channel Name"
Foreground="{DynamicResource {x:Static r:RibbonSkinResources.RibbonGroupLabelFontColorBrushKey}}" />
The strings are taken through Binding. I don't want to make the strings uppercase in the dictionary itself.
Or use
Typography.Capitals="AllSmallCaps"
in your TextBlock definition.
See here: MSDN - Typography.Capitals
EDIT:
This does not work in Windows Phone 8.1, only in Windows 8.1 ...
Implement a custom converter.
using System.Globalization;
using System.Windows.Data;
// ...
public class StringToUpperConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
if (value != null && value is string )
{
return ((string)value).ToUpper();
}
return value;
}
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
{
return null;
}
}
Then include that in your XAML as a resource:
<local:StringToUpperConverter x:Key="StringToUpperConverter"/>
And add it to your binding:
Converter={StaticResource StringToUpperConverter}
You can use an attached property like this:
public static class TextBlock
{
public static readonly DependencyProperty CharacterCasingProperty = DependencyProperty.RegisterAttached(
"CharacterCasing",
typeof(CharacterCasing),
typeof(TextBlock),
new FrameworkPropertyMetadata(
CharacterCasing.Normal,
FrameworkPropertyMetadataOptions.Inherits | FrameworkPropertyMetadataOptions.NotDataBindable,
OnCharacterCasingChanged));
private static readonly DependencyProperty TextProxyProperty = DependencyProperty.RegisterAttached(
"TextProxy",
typeof(string),
typeof(TextBlock),
new PropertyMetadata(default(string), OnTextProxyChanged));
private static readonly PropertyPath TextPropertyPath = new PropertyPath("Text");
public static void SetCharacterCasing(DependencyObject element, CharacterCasing value)
{
element.SetValue(CharacterCasingProperty, value);
}
public static CharacterCasing GetCharacterCasing(DependencyObject element)
{
return (CharacterCasing)element.GetValue(CharacterCasingProperty);
}
private static void OnCharacterCasingChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
if (d is System.Windows.Controls.TextBlock textBlock)
{
if (BindingOperations.GetBinding(textBlock, TextProxyProperty) == null)
{
BindingOperations.SetBinding(
textBlock,
TextProxyProperty,
new Binding
{
Path = TextPropertyPath,
RelativeSource = RelativeSource.Self,
Mode = BindingMode.OneWay,
});
}
}
}
private static void OnTextProxyChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
d.SetCurrentValue(System.Windows.Controls.TextBlock.TextProperty, Format((string)e.NewValue, GetCharacterCasing(d)));
string Format(string text, CharacterCasing casing)
{
if (string.IsNullOrEmpty(text))
{
return text;
}
switch (casing)
{
case CharacterCasing.Normal:
return text;
case CharacterCasing.Lower:
return text.ToLower();
case CharacterCasing.Upper:
return text.ToUpper();
default:
throw new ArgumentOutOfRangeException(nameof(casing), casing, null);
}
}
}
}
Then usage in xaml will look like:
<StackPanel>
<TextBox x:Name="TextBox" Text="abc" />
<TextBlock local:TextBlock.CharacterCasing="Upper" Text="abc" />
<TextBlock local:TextBlock.CharacterCasing="Upper" Text="{Binding ElementName=TextBox, Path=Text}" />
<Button local:TextBlock.CharacterCasing="Upper" Content="abc" />
<Button local:TextBlock.CharacterCasing="Upper" Content="{Binding ElementName=TextBox, Path=Text}" />
</StackPanel>
If it's not a big deal you could use TextBox instead of TextBlock like this:
<TextBox CharacterCasing="Upper" IsReadOnly="True" />
While there's already a great answer here that uses a converter, I'm providing an alternative implementation that simplifies the conversion to a single line (thanks to null coalescing), as well as making it a subclass of MarkupExtension so it's easier to use in XAML.
Here's the converter...
using System;
using System.Globalization;
using System.Windows.Data;
using System.Windows.Markup;
namespace IntuoSoft.Wpf.Converters {
[ValueConversion(typeof(string), typeof(string))]
public class CapitalizationConverter : MarkupExtension, IValueConverter {
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
=> (value as string)?.ToUpper() ?? value; // If it's a string, call ToUpper(), otherwise, pass it through as-is.
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
=> throw new NotSupportedException();
public override object ProvideValue(IServiceProvider serviceProvider) => this;
}
}
And here's how you use it (Note: This assumes the above namespace is prefixed with is in your XAML):
<TextBlock Text={Binding SomeValue, Converter={is:CapitalizationConverter}}" />
Because it's a MarkupExtension subclass, you can simply use it right where/when it's needed. No need to define it in the resources first.
I use a character casing value converter:
class CharacterCasingConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
var s = value as string;
if (s == null)
return value;
CharacterCasing casing;
if (!Enum.TryParse(parameter as string, out casing))
casing = CharacterCasing.Upper;
switch (casing)
{
case CharacterCasing.Lower:
return s.ToLower(culture);
case CharacterCasing.Upper:
return s.ToUpper(culture);
default:
return s;
}
}
object IValueConverter.ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
{
throw new NotSupportedException();
}
}

Set the Visibility of Data Grid in WPF

In my application I have 3 data grids in a single xaml file. Based on the User selection I want show one grid and hide other grids.
in my view model class I have Boolean property for each grid and based on the selection I am setting it to true or false.But all grids are visible .
<DataGrid Visibility="{Binding Path=IsGridVisible}" >
In my view model I am setting IsGridVisible value
public bool IsCapexGridVisible
{
get { return isCapexGridVisible; }
set { isCapexGridVisible = value; RaisePropertyChangedEvent("IsCapexGridVisible"); }
}
Please provide your ideas. Thanks
There is a BooleanToVisibilityConverter available to you that converts true to System.Windows.Visibility.Visible and false to System.Windows.Visibility.Collapsed.
So you can take help of this pre built converter and must add it to resources.
<BooleanToVisibilityConverter x:Key="BoolToVis"/>
Create a property of type bool in your ViewModel
bool _dgVisibility;
public bool DataGridVisibility
{
get { return _dgVisibility; }
set
{
_dgVisibility = value;
OnPropertyChanged("DataGridVisibility");
}
}
and you can use it as below
<DataGrid Visibility="{Binding Path=DataGridVisibility, Converter={StaticResource BoolToVis}}"/>
Visibility property on UIElement is not a boolean. It is an enum with three values:
Collapsed Do not display the element, and do not reserve space for it in layout.
Hidden Do not display the element, but reserve space for the element in layout.
Visible Display the element.
So in order to set it properly from ViewModel you should:
- make your property type of Visibility (not best solution in the world)
- Use converter for the binding which will do the trick of translating boolean to visibility
public class BooleanToCollapsedConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
if (targetType == typeof(Visibility) && value is bool)
{
return (bool)value ? Visibility.Visible : Visibility.Collapsed;
}
throw new FormatException();
}
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
{
throw new NotImplementedException();
}
}
Additional converter variant with visibility customization
using System;
using System.Globalization;
using System.Windows;
using System.Windows.Data;
using System.Windows.Markup;
[MarkupExtensionReturnType(typeof(IValueConverter))]
public class BoolToVisibilityConverter : MarkupExtension, IValueConverter
{
[ConstructorArgument("TrueValue")]
public Visibility TrueValue { get; set; }
[ConstructorArgument("FalseValue")]
public Visibility FalseValue { get; set; }
[ConstructorArgument("NullValue")]
public Visibility NullValue { get; set; }
public BoolToVisibilityConverter()
{
TrueValue = Visibility.Visible;
FalseValue = Visibility.Collapsed;
NullValue = Visibility.Collapsed;
}
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
if (value == null) return NullValue;
if (value is not bool boolValue)
return null;
return boolValue ? TrueValue : FalseValue;
}
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
{
if (Equals(value, TrueValue))
return true;
if (Equals(value, FalseValue))
return false;
return null;
}
public override object ProvideValue(IServiceProvider serviceProvider)
{
return this;
}
}
Usage:
<someControl ...
xmlns:converters="clr-namespace:ExampleNamespace.Converters;assembly=ExampleAssembly"
...
>
...
Visibility="{Binding IsSearchInProgress,
Mode=OneWay,
Converter={converters:BoolToVisibilityConverter}}"
Visibility="{Binding IsSearchInProgress,
Mode=OneWay,
Converter={converters:BoolToVisibilityConverter TrueValue=Collapsed, FalseValue=Visible}}"

How to change the font color of a datatemplated wpf listbox using a converter?

I have a DataTemplate that is used by a listbox:
<local:BooleanToFontColorConverter x:Key="boolToFontColor" />
<DataTemplate x:Key="ListBox_DataTemplateSpeakStatus">
<Label Width="Auto">
<TextBlock Name="MY_TextBlock" Text="Hello!" Foreground="{Binding Path=MY_COLOR, Converter={StaticResource boolToFontColor}}" />
</Label>
</DataTemplate>
MY_COLOR is the following bit of code:
public class Packet_Class : INotifyPropertyChanged
{
private bool _my_color = false;
public bool MY_COLOR { get { return _my_color; }
set { _my_color = value; RaisePropertyChanged("MY_COLOR"); } }
}
and then when appropriate I set the property, which I think would fire the RaisePropertyChanged function
myPacketClass.MY_COLOR = true;
while boolToFontColor is "trying" to use this bit:
public class BooleanToFontColorConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter,
CultureInfo culture)
{
if (value is Boolean)
{
return ((bool)value) ? new SolidColorBrush(Colors.Red) : new SolidColorBrush(Colors.Black);
}
return new SolidColorBrush(Colors.Black);
}
public object ConvertBack(object value, Type targetType, object parameter,
CultureInfo culture)
{
throw new NotImplementedException();
}
}
When I change the value of MY_COLOR from true to false, or vice versa, I see no visible changes in my text foreground color during runtime. Is anyone able to give advice as to where I am going wrong? Much appreciated and thank you in advance.
EDIT:
Some additional information to attempt to provide more clarity. I am using my DataTemplate in a ListBox like this:
<ListBox x:Name="MyUserList" ItemTemplate="{StaticResource ListBox_DataTemplateSpeakStatus}" SelectionMode="Extended" />
And in my WPF Window element I set my local namespace to the namespace that my mainwindow.xaml.cs is encapsulated in:
xmlns:local ="clr-namespace:My_NameSpace"
the RaisePropertyChanged method should raise the PropertyChanged event define in the interface and look like:
public event PropertyChangedEventHandler PropertyChanged;
protected void RaisePropertyChanged (string propertyName)
{
if (this.PropertyChanged != null)
this.PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
}
the converter:
public class BooleanToFontColorConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter,
CultureInfo culture)
{
if (value is Boolean)
{
return ((bool)value) ? new SolidColorBrush(Colors.Red) : new SolidColorBrush(Colors.Black);
}
return new SolidColorBrush(Colors.Black);
}
public object ConvertBack(object value, Type targetType, object parameter,
CultureInfo culture)
{
throw new NotImplementedException();
}
}
You have to use a SolidColorBrush to make it work.
It works on my environment, let me know if you encounter any trouble.

Text color depends of value

First of all, I am new to WPF and Xaml, so I just hope that you understand what I am asking.
I got this situation: There is a listBox of Animals. Every Animal has Weight property. What I am trying to achieve is whenever Weight of Animal is greater then 300 kg, that Weight should be displayed red.
You could use custom converter to achieve that. If your item looks like that:
public class Animal
{
public int Weight { get; set; }
public string Name { get; set; }
}
and ItemTemplate like that:
<DataTemplate x:Key="AnimalTemplate">
<TextBlock Text="{Binding Name}" Foreground="{Binding Weight, Converter={StaticResource AnimalColorSelector}}"/>
</DataTemplate>
Your converter will be like the following one:
public class AnimalColorSelector : IValueConverter
{
private readonly Color _overweightColor = Colors.Red;
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
if (value is int)
{
return (int) value > 300 ? new SolidColorBrush(_overweightColor) : Binding.DoNothing;
}
return Binding.DoNothing;
}
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
{
throw new NotSupportedException();
}
}
This approach has the following pros:
You don't need to hardcode the default color, but inherit it by using Binding.DoNothing.
You don't need to store any style information in a view model.
You could create a ViewModel for Animals that would contain necessary logic for color setting. Like this:
public class VMAnimal : INotifyPropertyChanged
{
private int _weight;
public int Weight
{
get { return _weight; }
set
{
_weight = value;
RaisePropertyChanged("Weight");
RaisePropertyChanged("Color");
}
}
public Brush Foreground
{
get
{
if (Weight > 300)
return new SolidColorBrush(Color.Red);
return new SolidColorBrush(Color.Black);
}
}
}
And use it with binding like this:
<TextBlock Text="{Binding Weight}" Foreground="{Binding Foreground}" />

Resources