目标是一个registration form行为像google registration form。打开Google registration form 研究它的行为。当form是第一次显示,它的“Register”按钮应该启动;编辑器没有提示任何输入错误。输入First Name编辑器字段,清理输入和离开编辑器应该显示的First Name编辑器在错误状态。
在此教程,你可以实现本行为。
最好的审核实现行为是绑定验证规则-一个标准审核被WPF平台提供。在之前继续,审核如下MSDN文档主题:如何实现绑定验证。
可以创建一个验证规则提示一个输入错误对于每一个空编辑器字段添加普通文件夹在项目和一个新文件,ValidationRule.cs,定义如下类
public class RequiredValidationRule : ValidationRule {
public static string GetErrorMessage(string fieldName, object fieldValue, object nullValue = null) {
string errorMessage = string.Empty;
if(nullValue != null && nullValue.Equals(fieldValue))
errorMessage = string.Format("You cannot leave the {0} field empty.", fieldName);
if(fieldValue == null || string.IsNullOrEmpty(fieldValue.ToString()))
errorMessage = string.Format("You cannot leave the {0} field empty.", fieldName);
return errorMessage;
}
public string FieldName { get; set; }
public override ValidationResult Validate(object value, CultureInfo cultureInfo) {
string error = GetErrorMessage(FieldName, value);
if(!string.IsNullOrEmpty(error))
return new ValidationResult(false, error);
return ValidationResult.ValidResult;
}
}
RequiredValidationRule类检测输入值从继承Validate 方法。对于null或者空编辑值,此方法返回一个审核错误消息。
确定使用验证规则,替换RequiredValidationRule实例在Binding.ValidationRules集合在如下。
<UserControl xmlns:Common="clr-namespace:RegistrationForm.Common" ... >
...
<dxe:TextEdit NullText="FIRST">
<dxe:TextEdit.EditValue>
<Binding Path="FirstName" UpdateSourceTrigger="PropertyChanged" Mode="TwoWay">
<Binding.ValidationRules>
<Helpers:RequiredValidationRule FieldName="First Name"/>
</Binding.ValidationRules>
</Binding>
</dxe:TextEdit.EditValue>
</dxe:TextEdit>
...
</UserControl>
Binding.UpdateSourceTrigger属性设置PropertyChanged - 默认值LostFocus。在LostFocus值之上,验证进程只有当结束时调用-用户离开编辑器。
在EditValue属性可用在任何DXEditors说明绑定机制,考虑如下简单的绑定:EditValue="{Binding FristName,Mode=TwoWay}".
EditValue 是目标属性当绑定应用。对于必须,目标属性总是DependencyProperty(依赖属性)
FirstName属性是源属性。绑定目标属性到源属性。源可以是一个DenpendencyProperty。一个恒定属性或属性触发INotifyProertyChanged.PropertyChanged事件当新值设置。此源属性无论如何不能是字段-必要属性。
绑定可以使用双向绑定模式同样传递输入数据在目标,到密封的潜在源数据。双向绑定行为,通过默认当束缚控件丢失焦点更新源属性。此刷新行为可以被UpdateSourceTrigger指定。对于实例,设置UpdateSourceTrigger参数到PropertyChanged,更新源属性作为目标属性刷新。参考此信息:Binding.UpdateSourceTrigger
此时,将您的注意力转向 DXEditors 如何修改 BaseEdit.EditValue 属性。
DXEditor支持验证机制避免提交无效值到数据源,提供一个兼容终端用户无效输入数据。导入,验证机制调用之前的EditValue更改。仅仅之后验证成功,编辑器提交输入值到EditValue属性。DXEditor提供两个属性对于调用验证机制:BaseEdit.ValiadateOnEnterKeyPressed和BaseEdit.ValidateOnTextInput.
ValidateOnEnterKeyPressed属性控件无论EditValue属性更新当Enter按键被按。ValidateOnTextInpui属性决定无论EditValue属性更新作为终端用户输入到编辑器。
对于FirstName编辑器,它是必要的显示一个错误只在终端用户输入,清理编辑器和左侧的编辑器清空。已经添加检测使用绑定验证规则。余下的自定义编辑器去处理逻辑。不需要验证编辑器在用户输入,因此设置编辑器 ValidateOnTextInput 属性为False。验证编辑器当用户按Enter键,设置ValidateOnEnterKeyPressed属性为True。
<UserControl xmlns:Common="clr-namespace:RegistrationForm.Common" ... >
...
<dxe:TextEdit NullText="FIRST" ValidateOnEnterKeyPressed="True" ValidateOnTextInput="False">
<dxe:TextEdit.EditValue>
<Binding Path="FirstName" UpdateSourceTrigger="PropertyChanged" Mode="TwoWay">
<Binding.ValidationRules>
<Helpers:RequiredValidationRule FieldName="First Name"/>
</Binding.ValidationRules>
</Binding>
</dxe:TextEdit.EditValue>
</dxe:TextEdit>
...
</UserControl>
代码的运行显示如下
使用通过审核自定义LastName,Email,Password,生日编辑器字段。
没有容易的检测ConfirmPassword编辑器字段不为空,因为验证意味着检测是否ConfirmPassword框匹配字符串在密码框。无论如何,对于ConfirmPassword,使用场景验证输入值作为终端用户输入。设置编辑器ValidateOnTextInput属性为True。
<dxlc:LayoutItem Label="Confirm your password">
<dxe:PasswordBoxEdit EditValue="{Binding ConfirmPassword}"
ValidateOnEnterKeyPressed="True" ValidateOnTextInput="True"/>
</dxlc:LayoutItem>
作为必要有注册按钮禁用当验证错误显示。简单的实现DXEditor行为。ValidationService类支持捕获验证错误在特定的用户控件。使用此特性,设置ValidationService.IsValidationContainer附加属性为True在父LayoutControl编辑器元素。之后,绑定IsEnabled属性与注册按钮在ValidationService.HasValidationError附加属性。
<UserControl ... >
...
<dxlc:LayoutControl ... x:Name="container" dxe:ValidationService.IsValidationContainer="True">
...
<Button Content="Register" HorizontalAlignment="Center" VerticalAlignment="Bottom" Width="80"
Command="{Binding AddEmployeeCommand}"
IsEnabled="{Binding ElementName=container, Path=(dxe:ValidationService.HasValidationError), Converter={dxmvvm:BooleanNegationConverter}}" />
</dxlc:LayoutControl>
</UserControl>
当验证错误,ValidationServie.HasValidationError附加属性返回True值。当分配Button.IsEnabled属性为False通过BooleanNegationConverter。