[英]How to bind UI color attribute with class property
I have a user control which is an ellipse that acts like a "led". 我有一个用户控件,它是一个椭圆形,类似于“ led”。 I want to bind its "Fill" to a boolean property (State).
我想将其“填充”绑定到布尔属性(状态)。 I used for that a boolean to Color converter.
我为此使用了一个布尔值到颜色转换器。
here is the user control I did: 这是我所做的用户控件:
<UserControl x:Class="Sol.Components.Led"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
...
xmlns:conv="clr-namespace:Sol.Converters"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="300">
<Grid>
<Ellipse Fill="{Binding Converter={StaticResource BoolToColor}}" StrokeThickness="3" Stroke="Gray"/>
</Grid>
</UserControl>
also the converter is not recognised in the user control! 另外在用户控件中无法识别转换器! I did it like this
我是这样做的
public class BoolToColor : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
if (value is bool)
{
if ((bool)value == true)
return Colors.Green; // to replace with onColor
else
return Colors.Red; // to replace with offColor
}
return Colors.LightGray;
}
public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
if (value is Color)
{
if ((Color)value == Colors.Green) // to compare with onColor
{
return true;
}
}
return false;
}
}
I used a window to include 4 user contols: 我使用了一个窗口来包含4个用户控制项:
<Window x:Class="Sol.Menu.Leds"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:led="clr-namespace:Sol.Components"
xmlns:conv="clr-namespace:Sol.Converters"
Title="Leds" Height="300" Width="300">
<Window.Resources>
<conv:BoolToColor x:Key="BoolToColor" />
</Window.Resources>
<Grid>
...
<led:Led Grid.Column="0" Grid.Row="0" x:Name="led1" State="False"/>
<led:Led Grid.Column="0" Grid.Row="1" x:Name="led2" State="False"/>
<led:Led Grid.Column="1" Grid.Row="0" x:Name="led3" State="False"/>
<led:Led Grid.Column="1" Grid.Row="1" x:Name="led4" State="False"/>
</Grid>
</Window>
and the used control class : 和使用的控件类:
public partial class Led : UserControl
{
private bool state;
public bool State
{
get { return state; }
set { state = value; }
}
private Color onColor;
public Color OnColor
{
get { return onColor; }
set { onColor = value; }
}
private Color offColor;
public Color OffColor
{
get { return offColor; }
set { offColor = value; }
}
public Led()
{
InitializeComponent();
}
}
this is works without binding and the window shows 4 ellipses, but I am unable to change the color dynamically (from the code bedhind). 这是没有绑定的作品,并且该窗口显示了4个椭圆,但是我无法动态更改颜色(根据隐藏的代码)。 any help to fix the binding?
任何帮助解决绑定问题?
You need to implement PropertyChanged so the UI knows a property has been changed. 您需要实现PropertyChanged,以便UI知道属性已更改。
Read here how it should be done: https://docs.microsoft.com/en-us/dotnet/framework/wpf/data/how-to-implement-property-change-notification 在此处阅读应如何进行: https : //docs.microsoft.com/zh-cn/dotnet/framework/wpf/data/how-to-implement-property-change-notification
Try to bind to the State
property of the UserControl
: 尝试绑定到
UserControl
的State
属性:
<Ellipse Fill="{Binding Path=State,
RelativeSource={RelativeSource AncestorType=UserControl},
Converter={StaticResource BoolToColor}}" StrokeThickness="3" Stroke="Gray"/>
You should also return a Brush
instead of a Color
from your converter: 您还应该从转换器返回
Brush
而不是Color
:
public class BoolToColor : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
if (value is bool)
{
if ((bool)value == true)
return Brushes.Green; // to replace with onColor
else
return Brushes.Red; // to replace with offColor
}
return Brushes.LightGray;
}
public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
if (value is Brush)
{
if ((Brush)value == Brushes.Green) // to compare with onColor
{
return true;
}
}
return false;
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.