假设我有一个Border,其DataContext是MyViewModel类型的对象。 MyViewModel具有名为RoundLeft和RoundRight的bool属性。当RoundLeft为true时,我希望边框的CornerRadius为6,0,0,6。当RoundRight为真时,我想要0,6,6,0。如果两者都是真的,我想要6,6,6,6。
我已经在下面描述了我的前两次尝试。我还没有放弃,但我想知道是否有其他人可能有任何想法。
尝试#1
我通过绑定到MyViewModel实例本身(不是特定属性)并使用构建正确的CornerRadius对象的IValueConverter来部分工作。这适用于初始加载。问题是绑定是监视整个对象的变化,而不是改变特定的RoundLeft和RoundRight属性,例如:如果RoundLeft改变,边框的CornerRadius不会。
结合:
<Border CornerRadius="{Binding Converter={StaticResource myShiftCornerRadiusConverter}}" />
转换器:
public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
var myViewModel = value as MyViewModel;
if (myViewModel != null)
{
return new CornerRadius(
myViewModel.RoundLeft ? 6 : 0,
myViewModel.RoundRight ? 6 : 0,
myViewModel.RoundRight ? 6 : 0,
myViewModel.RoundLeft ? 6 : 0);
}
else
{
return new CornerRadius(6);
}
}
尝试#2
来自Colin Eberhardt的这个blog post看起来很有希望,但我模糊的XamlParseExceptions和ComExceptions。这是我的XAML:
<Border>
<ce:MultiBindings>
<ce:MultiBinding TargetProperty="CornerRadius" Converter="{StaticResource myCornerRadiusConverter}">
<ce:MultiBinding.Bindings>
<ce:BindingCollection>
<Binding Path="RoundLeft" />
<Binding Path="RoundRight" />
</ce:BindingCollection>
</ce:MultiBinding.Bindings>
</ce:MultiBinding>
</ce:MultiBindings>
</Border>
这是我的转换器,虽然执行永远不会这么远,即我的断点永远不会被击中。
public object Convert(object[] values, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
if (values.Length == 2 && values.All(v => v is bool))
{
var roundLeft = (bool)values[0];
var roundRight = (bool)values[1];
return new CornerRadius(
roundLeft ? 6 : 0,
roundRight ? 6 : 0,
roundRight ? 6 : 0,
roundLeft ? 6 : 0);
}
else
{
return new CornerRadius(6);
}
}
答案 0 :(得分:1)
在SL中缺乏内置的MultiBinding支持使得这有点痛苦,但如何更简单(虽然稍微更加耦合)的方法。
由于您的VM中已经具有roundLeft和roundRight属性,这些属性已经在某种程度上与特定的UI范例相关联。那么为什么不只是有一个计算属性返回一个CornerRadius值并绑定到那个?
因此,例如,当您更改roundLeft时,您调用一个方法来更新计算的CornerRadius属性并在该属性上引发更改通知,然后您的视图将绑定到计算出的CornerRadius属性。
答案 1 :(得分:0)
DataTrigger和适当的模型属性如何:
<Border Height="25" Width="45" BorderThickness="5" BorderBrush="Green">
<Border.Style>
<Style>
<Style.Triggers>
<DataTrigger Binding="{Binding Round}" Value="Left">
<Setter Property="Border.CornerRadius" Value="6,0,0,6"/>
</DataTrigger>
<DataTrigger Binding="{Binding Round}" Value="Right">
<Setter Property="Border.CornerRadius" Value="0,6,6,0"/>
</DataTrigger>
<DataTrigger Binding="{Binding Round}" Value="Both">
<Setter Property="Border.CornerRadius" Value="6"/>
</DataTrigger>
</Style.Triggers>
</Style>
</Border.Style>
<TextBlock Text="{Binding Text}"/>
</Border>
答案 2 :(得分:0)
我实现了@Foovanadil建议的方法,但后来又有了另一个想法:我创建了一个新的ContentControl,它暴露了RoundLeft和RoundRight依赖属性。它肯定涉及更多的代码,但现在CornerRadius的东西都在View层中。
[TemplatePart(Name = _borderPartName, Type = typeof(Border))]
public class CustomRoundedBorder : ContentControl
{
#region Private Fields
private const string _borderPartName = "PART_Border";
private Border _borderPart;
#endregion
#region Dependency Properties
#region DefaultCornerRadius
//////////////////////////////////////////////////////////////////////////////
/// <summary>
/// Gets or sets the default corner radius, in pixels.
/// </summary>
//////////////////////////////////////////////////////////////////////////////
public double DefaultCornerRadius
{
get { return (double)GetValue(DefaultCornerRadiusProperty); }
set { SetValue(DefaultCornerRadiusProperty, value); }
}
public static readonly DependencyProperty DefaultCornerRadiusProperty = DependencyProperty.Register(
"DefaultCornerRadius", typeof(double), typeof(CustomRoundedBorder),
new PropertyMetadata(new PropertyChangedCallback(RoundingChanged)));
#endregion
#region RoundLeft
//////////////////////////////////////////////////////////////////////////////
/// <summary>
/// Gets or sets a value indicating whether to round the corners on the left side of the border.
/// </summary>
//////////////////////////////////////////////////////////////////////////////
public bool RoundLeft
{
get { return (bool)GetValue(RoundLeftProperty); }
set { SetValue(RoundLeftProperty, value); }
}
public static readonly DependencyProperty RoundLeftProperty = DependencyProperty.Register(
"RoundLeft", typeof(bool), typeof(CustomRoundedBorder),
new PropertyMetadata(new PropertyChangedCallback(RoundingChanged)));
#endregion
#region RoundRight
//////////////////////////////////////////////////////////////////////////////
/// <summary>
/// Gets or sets a value indicating whether to round the corners on the left side of the border.
/// </summary>
//////////////////////////////////////////////////////////////////////////////
public bool RoundRight
{
get { return (bool)GetValue(RoundRightProperty); }
set { SetValue(RoundRightProperty, value); }
}
public static readonly DependencyProperty RoundRightProperty = DependencyProperty.Register(
"RoundRight", typeof(bool), typeof(CustomRoundedBorder),
new PropertyMetadata(new PropertyChangedCallback(RoundingChanged)));
#endregion
#region EffectiveCornerRadius
//////////////////////////////////////////////////////////////////////////////
/// <summary>
/// Gets the effective corner radius, based on DefaultCornerRadius and
/// RoundLeft and RoundRight.
/// </summary>
//////////////////////////////////////////////////////////////////////////////
public double EffectiveCornerRadius
{
get { return (double)GetValue(EffectiveCornerRadiusProperty); }
private set { SetValue(EffectiveCornerRadiusProperty, value); }
}
public static readonly DependencyProperty EffectiveCornerRadiusProperty = DependencyProperty.Register(
"EffectiveCornerRadius", typeof(double), typeof(CustomRoundedBorder),
new PropertyMetadata(new PropertyChangedCallback(RoundingChanged)));
#endregion
#endregion
#region Overrides
public override void OnApplyTemplate()
{
base.OnApplyTemplate();
this._borderPart = this.GetTemplateChild(_borderPartName) as Border;
this.UpdateCornerRadius();
}
#endregion
#region Private Methods
private static void RoundingChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
var control = d as CustomRoundedBorder;
if (control != null)
{
control.UpdateCornerRadius();
}
}
private void UpdateCornerRadius()
{
if (this._borderPart != null)
{
this._borderPart.CornerRadius = new CornerRadius(
this.RoundLeft ? this.DefaultCornerRadius : 0,
this.RoundRight ? this.DefaultCornerRadius : 0,
this.RoundRight ? this.DefaultCornerRadius : 0,
this.RoundLeft ? this.DefaultCornerRadius : 0);
}
}
#endregion
}
然后我为它创建了一个ControlTemplate(为简洁起见省略了一些属性):
<ControlTemplate x:Key="MyBorderTemplate" TargetType="ce:CustomRoundedBorder">
<Border
x:Name="PART_Border"
CornerRadius="{TemplateBinding EffectiveCornerRadius}"
>
<ContentPresenter />
</Border>
</ControlTemplate>
然后我将它绑定到视图模型属性:
<ce:CustomRoundedBorder
DefaultCornerRadius="6"
RoundLeft="{Binding RoundLeft}"
RoundRight="{Binding RoundRight}"
Template="{StaticResource MyBorderTemplate}"
>
<!-- Content -->
</ce:CustomRoundedBorder>