更改文本框边框颜色的最佳实践
本文关键字：最佳 颜色 边框 文本 | 更新日期: 2023-09-27 18:04:55
假设您有一个视图，其中有多个像这样的Texbox
<TextBox Text="{Binding myText1, UpdateSourceTrigger=PropertyChanged, ValidatesOnDataErrors=True}" />
每个已经包含一些文本。如果用户更改此文本，则文本框边框应更改为橙色，如果用户取消更改，则应为默认颜色。
目前我是这样做的
<TextBox Height="23" Text="{Binding myText1, UpdateSourceTrigger=PropertyChanged, ValidatesOnDataErrors=True}" BorderThickness="2">
<TextBox.Style>
<Style TargetType="TextBox">
<Style.Triggers>
<DataTrigger Binding="{Binding myDirtyText1, UpdateSourceTrigger=PropertyChanged}" Value="True">
<Setter Property="BorderBrush" Value="Orange"/>
</DataTrigger>
</Style.Triggers>
</Style>
</TextBox.Style>
</TextBox>
有没有更通用/更简单的方法可以做到这一点？
编辑
我已经在使用IDataErrorInfo+System.ComponentModel.DataAnnotations进行错误验证。也许在这种情况下也有类似的方法，但我没有发现任何有用的方法来将我的xaml和代码减少到最低限度。
编辑2.0
我想你并没有真正理解我的问题，所以我会提供一个更好的样本来说明它的实际情况：
查看Xaml(无代码隐藏(
<Grid Margin="12">
<Label Content="Name:" Height="28" HorizontalAlignment="Left" VerticalAlignment="Top" Width="79" />
<TextBox Height="23" HorizontalAlignment="Left" Margin="102,2,0,0" VerticalAlignment="Top" Width="170" BorderThickness="2"
Text="{Binding NameD, UpdateSourceTrigger=PropertyChanged, ValidatesOnDataErrors=True}">
<TextBox.Style>
<Style TargetType="TextBox">
<Style.Triggers>
<DataTrigger Binding="{Binding dirtyName, UpdateSourceTrigger=PropertyChanged}" Value="True">
<Setter Property="BorderBrush" Value="Orange"/>
</DataTrigger>
</Style.Triggers>
</Style>
</TextBox.Style>
</TextBox>
<Label Content="Anzeigetext:" Height="28" HorizontalAlignment="Left" Margin="0,34,0,0" VerticalAlignment="Top" Width="79" />
<TextBox BorderThickness="2" Height="23" HorizontalAlignment="Left" Margin="102,36,0,0" VerticalAlignment="Top" Width="170"
Text="{Binding AnzeigetextD, UpdateSourceTrigger=PropertyChanged, ValidatesOnDataErrors=True}">
<TextBox.Style>
<Style TargetType="TextBox">
<Style.Triggers>
<DataTrigger Binding="{Binding dirtyAnzeigetext, UpdateSourceTrigger=PropertyChanged}" Value="True">
<Setter Property="BorderBrush" Value="Orange"/>
</DataTrigger>
</Style.Triggers>
</Style>
</TextBox.Style>
</TextBox>
<Label Content="Preis:" Height="28" HorizontalAlignment="Left" Margin="0,68,0,0" VerticalAlignment="Top" Width="79" />
<TextBox BorderThickness="2" Height="23" HorizontalAlignment="Left" Margin="102,70,0,0" VerticalAlignment="Top" Width="170"
Text="{Binding PreisD, UpdateSourceTrigger=PropertyChanged, ValidatesOnDataErrors=True, StringFormat='{0:c'}}">
<TextBox.Style>
<Style TargetType="TextBox">
<Style.Triggers>
<DataTrigger Binding="{Binding dirtyPreis, UpdateSourceTrigger=PropertyChanged}" Value="True">
<Setter Property="BorderBrush" Value="Orange"/>
</DataTrigger>
</Style.Triggers>
</Style>
</TextBox.Style>
</TextBox>
<Button Content="Speichern" Height="23" HorizontalAlignment="Left" Margin="102,110,0,0" VerticalAlignment="Top" Width="75" Command="{Binding SaveCommand}"/>
<Button Content="Abbrechen" Height="23" HorizontalAlignment="Left" Margin="197,110,0,0" VerticalAlignment="Top" Width="75" Command="{Binding CancelCommand}"/>
</Grid>
ViewModel
public class MenuangebotVM : DetailVM, IContains
{
#region private Values
private Menuangebot myOriginal = new Menuangebot();
private Menuangebot myValue = new Menuangebot();
#endregion // private Values
#region Properties
#region Detail Properties
public int Id { get { return myOriginal.Id; } }
public bool? Result { get; private set; }
public string Beschreibung { get { return "Einrichtung"; } }
[Required]
[RegularExpression(@"^[0-9a-zA-ZäöüßÄÖÜß''-''s]{2,40}$")]
public string NameD
{
get { return myValue.Name; }
set
{
myValue.Name = value;
RaisePropertyChanged(() => Reg(() => NameD));
RaisePropertyChanged(() => Reg(() => dirtyName));
}
}
public bool dirtyName
{
get { return (!isNew && myValue.Name != myOriginal.Name) ? true : false; }
}
[Required]
[RegularExpression(@"^[0-9a-zA-ZäöüßÄÖÜß''-''s]{2,25}$")]
public string AnzeigetextD
{
get { return myValue.Anzeigetext; }
set
{
myValue.Anzeigetext = value;
RaisePropertyChanged(() => Reg(() => AnzeigetextD));
RaisePropertyChanged(() => Reg(() => dirtyAnzeigetext));
}
}
public bool dirtyAnzeigetext
{
get { return (!isNew && myValue.Anzeigetext != myOriginal.Anzeigetext) ? true : false; }
}
[Required]
public decimal PreisD
{
get { return myValue.Preis; }
set
{
myValue.Preis = value;
RaisePropertyChanged(() => Reg(() => PreisD));
RaisePropertyChanged(() => Reg(() => dirtyPreis));
}
}
public bool dirtyPreis
{
get
{
var value = myValue.Preis;
var Original = myOriginal.Preis;
return (!isNew && value != Original) ? true : false;
}
}
#endregion //Detail Properties
#endregion //Properties
// more code
}
我认为应该是这样的
查看
<Grid Margin="12">
<Label Content="Name:" Height="28" HorizontalAlignment="Left" VerticalAlignment="Top" Width="79" />
<TextBox Height="23" HorizontalAlignment="Left" Margin="102,2,0,0" VerticalAlignment="Top" Width="170" BorderThickness="2"
Text="{Binding NameD, UpdateSourceTrigger=PropertyChanged, ValidatesOnDataErrors=True, EditesOnDataChanges=true}">
</TextBox>
<Label Content="Anzeigetext:" Height="28" HorizontalAlignment="Left" Margin="0,34,0,0" VerticalAlignment="Top" Width="79" />
<TextBox BorderThickness="2" Height="23" HorizontalAlignment="Left" Margin="102,36,0,0" VerticalAlignment="Top" Width="170"
Text="{Binding AnzeigetextD, UpdateSourceTrigger=PropertyChanged, ValidatesOnDataErrors=True, EditesOnDataChanges=true}">
</TextBox>
<Label Content="Preis:" Height="28" HorizontalAlignment="Left" Margin="0,68,0,0" VerticalAlignment="Top" Width="79" />
<TextBox BorderThickness="2" Height="23" HorizontalAlignment="Left" Margin="102,70,0,0" VerticalAlignment="Top" Width="170"
Text="{Binding PreisD, UpdateSourceTrigger=PropertyChanged, ValidatesOnDataErrors=True, StringFormat='{0:c', EditesOnDataChanges=true}}">
</TextBox>
<Button Content="Speichern" Height="23" HorizontalAlignment="Left" Margin="102,110,0,0" VerticalAlignment="Top" Width="75" Command="{Binding SaveCommand}"/>
<Button Content="Abbrechen" Height="23" HorizontalAlignment="Left" Margin="197,110,0,0" VerticalAlignment="Top" Width="75" Command="{Binding CancelCommand}"/>
</Grid>
ViewModel
public class MenuangebotVM : DetailVM, IContains
{
#region private Values
private Menuangebot myOriginal = new Menuangebot();
private Menuangebot myValue = new Menuangebot();
#endregion // private Values
#region Properties
#region Detail Properties
public int Id { get { return myOriginal.Id; } }
public bool? Result { get; private set; }
public string Beschreibung { get { return "Einrichtung"; } }
[Required]
[RegularExpression(@"^[0-9a-zA-ZäöüßÄÖÜß''-''s]{2,40}$")]
[Default(myOriginal.Name)] //<-- added
public string NameD
{
get { return myValue.Name; }
set
{
myValue.Name = value;
RaisePropertyChanged(() => Reg(() => NameD));
}
}
[Required]
[RegularExpression(@"^[0-9a-zA-ZäöüßÄÖÜß''-''s]{2,25}$")]
[Default(myOriginal.Anzeigetext)] //<-- added
public string AnzeigetextD
{
get { return myValue.Anzeigetext; }
set
{
myValue.Anzeigetext = value;
RaisePropertyChanged(() => Reg(() => AnzeigetextD));
}
}
[Required]
[Default(myOriginal.Preis)] //<-- added
public decimal PreisD
{
get { return myValue.Preis; }
set
{
myValue.Preis = value;
RaisePropertyChanged(() => Reg(() => PreisD));
}
}
#endregion //Detail Properties
#endregion //Properties
// more code
}
public class ViewModel:INotifyPropertyChanged
{
private string initialText;
public ViewModel()
{
Text = "ABCD";
initialText = Text;
DefaultBorder = true;
}
private string text;
public string Text
{
get { return text; }
set { text = value;
if (value == initialText)
DefaultBorder = true;
else
DefaultBorder = false;
Notify("Text"); }
}
private bool defaultBorder;
public bool DefaultBorder
{
get { return defaultBorder; }
set { defaultBorder = value; Notify("DefaultBorder"); }
}
private void Notify(string propertyName)
{
if(PropertyChanged!=null)
PropertyChanged(this,new PropertyChangedEventArgs(propertyName));
}
public event PropertyChangedEventHandler PropertyChanged;
}
public class MyConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
if (value != null && value is bool && !(bool)value)
return new SolidColorBrush(Colors.Orange);
else
return new SolidColorBrush(Colors.Navy); //Or default whatever you want
}
public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
throw new NotImplementedException();
}
}
<Window.Resources>
<local:MyConverter x:Key="MyConverter"/>
</Window.Resources>
<Grid>
<TextBox BorderThickness="4" BorderBrush="{Binding DefaultBorder, Converter={StaticResource MyConverter}}" Text="{Binding Text, UpdateSourceTrigger=PropertyChanged}"/>
</Grid>
在这里，我在ViewModel中有一个属性Text，它绑定到TextBox，一开始我保留了最初的Text值。然后每当用户在Text属性的setter中键入i进行比较并相应地设置Bool属性时，该Bool属性将指定使用转换器绑定的颜色。忽略小问题，希望你能有个主意。
您可以将其转换为自定义控件/UserControl，并添加IsDirtyDependencyProperty和IsDirtyColorDependencyProperties(或附加的依赖属性(。这样，你就可以用这个替换所有的文本框，而不必一遍又一遍地重复代码。
巧合的是，我刚刚遇到了一个与您几乎相同的问题，我通过将TextBox封装在Border中来解决它。此外，这也解决了在Windows 8机器上无法更改BorderBrush颜色的问题。
因此，我建议采取这种做法。代码非常简单，只需将textBox添加到Border并更改边界的BorderBrush属性。
您可以对使用附加行为
public static class TextChangedAttachedBehavior
{
public static bool GetChanged(DependencyObject obj)
{
return (bool)obj.GetValue(ChangedProperty);
}
public static void SetChanged(DependencyObject obj, string value)
{
obj.SetValue(ChangedProperty, value);
}
public static readonly DependencyProperty ChangedProperty =
DependencyProperty.RegisterAttached("Changed", typeof(bool),
typeof(TextChangedAttachedBehavior), new PropertyMetadata(false, HookupBehavior));
private static void HookupBehavior(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
var textBox = d as TextBox;
if (textBox == null)
return;
textBox.TextChanged += TextBoxOnTextChanged;
}
private static void TextBoxOnTextChanged(object sender, TextChangedEventArgs args)
{
var textBox = sender as TextBox;
if (textBox == null)
return;
textBox.BorderBrush = new SolidColorBrush(Colors.Orange);
}
}
与xaml 相比
<TextBox Text="{Binding myText1, UpdateSourceTrigger=PropertyChanged, ValidatesOnDataErrors=True}" TextChangedAttachedBehavior.Changed = "True" />