logo标签列表

更改文本框边框颜色的最佳实践是什么？

c#wpfuser-interfacemvvm
6
假设您有一个包含多个文本框的视图，如下所示：
<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

}
4个回答
0
你可以使用附加行为来实现这个。
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" />
0
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中进行比较，并相应地设置Bool属性。这个Bool属性将指定要使用转换器绑定哪种颜色。忽略小问题，希望您能理解我的意思。
嗯，我只是将问题（自我重复）移动到我的Text属性中，而没有否认它们。我认为可能会有一个“ValidationAttribute”解决方案。 - WiiMaxx
你的意思是想在文本中将橙色边框画为错误提示吗？ - yo chauhan
如果实际的 Text != startText，请不要作为错误而返回，只需作为视觉提示。 - WiiMaxx
0

你可以将其转换为自定义控件/UserControl，并添加一个IsDirtyDependencyProperty和IsDirtyColorDependencyProperty（或附加依赖属性）。这样，您可以用此替换所有文本框，而不必一遍又一遍地重复代码。

0
巧合的是，我刚好遇到了一个和你的问题几乎完全相同的问题，并通过将TextBox包装在Border中来解决它。此外，这也解决了Windows 8机器上无法更改BorderBrush颜色的问题。
因此，我建议采用这种方法。代码非常简单，只需将您的textBox添加到Border中并更改border的BorderBrush属性即可。
你按照TYY的建议创建了一个自定义控件吗？ - WiiMaxx
@WiiMaxx - 不，我的方法比那个简单得多。只需将你的TextBox放在一个Border控件中即可。不需要任何自定义控件。 - Dot NET
请问你能给我一个例子吗？因为我目前看不到你的解决方案有什么改进。 - WiiMaxx
我目前无法访问任何代码，但您可以在此处阅读有关“Border”控件及其属性的信息：http://msdn.microsoft.com/en-us/library/system.windows.controls.border.aspx您可能会注意到，“Child”属性非常适合存储您的文本框。 - Dot NET
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接