silverlight回车登录的实现

来源:互联网 发布:java怎么截取字符串 编辑:程序博客网 时间:2024/05/19 06:39

 http://apps.hi.baidu.com/share/detail/45013100

 

silverlight回车登录的实现
修改浏览权限 | 删除

浅谈Silverlight应用之回车登录最佳实践

对于一个应用系统来说,登录是最最基本的功能,也是最简单的功能。本文就Silverlight应用的登录表单来谈谈怎样做到最佳实践,这也是我学习Silverlight的些许沉淀。

想必会有朋友觉得这么简单的功能不值得小题大做,其实非也。

首先来看下我专门为此文准备的这个Silverlight Demo的登录表单:

Login-Form

一个登录表单无非就是几个文本框加一个登录按钮或取消按钮而已。而我们都知道对于系统的登录除了可以单击登录按钮登录之外,还需要使用回车键进行登录,这基本是每一个登录表单都具备的功能,缺一不可,如果不提供Enter键登录那就大大降低了用户体验。

而本文所探讨的则是在Silverlight应用中如何去做Enter键登录。可能做ASP.NET开发的朋友很清楚,ASP.NET中登录表单的是不需要专门写代码来控制Enter键登录的,至于纯HTML的Form等等我就不啰嗦了。对于上面这个登录表单,先看下该表单的XAML构成(只贴出重心代码):

<TextBlock Text="用户名:"     Grid.Row="0"     Grid.Column="0"     Margin="10 20 5 0"     VerticalAlignment="Center"     HorizontalAlignment="Right" /><TextBox x:Name="userNameBox"     Grid.Row="0"     Grid.Column="1"     Margin="0 20 0 0"     Width="220"     Height="26"     Text="{Binding Path=UserName,Mode=TwoWay,NotifyOnValidationError=True, ValidatesOnExceptions=True}"     TextChanged="userNameBox_TextChanged" SelectionChanged="userNameBox_SelectionChanged" /><TextBlock Text="密码:"     Grid.Row="1"     Grid.Column="0"     Margin="10 0 5 0"     VerticalAlignment="Center"     HorizontalAlignment="Right" /><PasswordBox x:Name="userPwdBox"     Grid.Row="1"     Grid.Column="1"     Width="220"     Height="26"     Password="{Binding Path=UserPwd,Mode=TwoWay,NotifyOnValidationError=True,ValidatesOnExceptions=True}"     PasswordChanged="userPwdBox_PasswordChanged" /><Button x:Name="loginBtn"     Content="登录"     Grid.Row="2"     Grid.ColumnSpan="2"     HorizontalAlignment="Right"     Width="120"     Height="30"     Margin="0 0 30 0"     Click="loginBtn_Click" />

首先,为登录按钮添加Click事件,实现单击登录按钮进行登录。

        private void loginBtn_Click(object sender, RoutedEventArgs e)        {            UpdateBindingExpression(userNameBox, TextBox.TextProperty);            UpdateBindingExpression(userPwdBox, PasswordBox.PasswordProperty);             if (!loginValidation.HasErrors)            {                // 登录验证...            }        }

详细的逻辑代码我就省略了。这样我们就能登录到系统了,接下来就是本文要谈的重点了。因为现在我们是不能通过输入用户名和密码后敲Enter键登录的,我想大家最容易想到的方法便是为userPwd这个PassWordBox添加KeyDown事件:

<PasswordBox x:Name="userPwdBox"     Grid.Row="1"     Grid.Column="1"     Width="220"     Height="26"     Password="{Binding Path=UserPwd,Mode=TwoWay,NotifyOnValidationError=True,ValidatesOnExceptions=True}"     PasswordChanged="userPwdBox_PasswordChanged"     KeyDown="userPwdBox_KeyDown" />

然后再把上面那个登录按钮的代码Ctrl+C、Ctrl+V到userPwdBox_KeyDown方法体中,最后在添加点判断敲击的是不是Enter键的代码。这样当然可以,因为实现了文本框的Enter键登录。但这样是不是最佳的解决方案呢?当然不是,那么接下来就来看看本文所说的最佳实践。

先谈谈思路吧,从上面的分析知道,既然是基本相同的代码,那我们应该让文本框在敲下Enter键的时候去触发登录按钮的方法,那么就可以不必再写同样的代码了。这一点应该是很容易想到的,那么怎样实现就需要我们对Silverlight的进一步的了解了。

在Silverlight 3中,Behaviour和Trigger绝对是让大家比较喜欢的东西了。它们允许你以声明方式将操作关联到事件或属性的值。但之前,行为和触发器需要我们安装上 Microsoft Expression Blend SDK ,然后添加System.Windows.Interactivity.dll 程序集的引用。

目前,我们可以使用三种类型的行为: Behavour、 TriggerAction 和 TargetedTriggerAction。在这里,我们使用TargetedTriggerAction<T>泛型类,它表示操作时可以面向一个完全不同的对象,而不受其关联的对象的影响。 它允许我们将触发器关联从一个对象到另一个对象,操作完全不同的元素。所以这里就特别适合了。

新建一个TextBoxEnterBehaviour类,继承自泛型类TargetedTriggerAction<T>,泛型类型为ButtonBase,这里使用ButtonBase是因为它表示所有按钮控件的基类,例如 Button、RepeatButton 和 HyperlinkButton,更加方便我们扩展。TextBoxEnterBehaviour类的详细实现如下:

    public class TextBoxEnterBehaviour : TargetedTriggerAction<ButtonBase>    {        private AutomationPeer peer;         private ButtonBase targetedButton;         /// <summary>        /// 在附加TargetedTriggerAction到关联对象后发生        /// </summary>        protected override void OnAttached()        {            base.OnAttached();             targetedButton = this.Target;            if (null == targetedButton)            {                return;            }            this.peer = FrameworkElementAutomationPeer.FromElement(targetedButton);            if (this.peer == null)            {                this.peer = FrameworkElementAutomationPeer.CreatePeerForElement(targetedButton);            }        }         /// <summary>        /// 关联的Button改变后发生        /// </summary>        /// <param name="oldTarget"></param>        /// <param name="newTarget"></param>         protected override void OnTargetChanged(ButtonBase oldTarget, ButtonBase newTarget)        {            base.OnTargetChanged(oldTarget, newTarget);             targetedButton = newTarget;            if (null == targetedButton)            {                return;            }            this.peer = FrameworkElementAutomationPeer.FromElement(targetedButton);            if (this.peer == null)            {                this.peer = FrameworkElementAutomationPeer.CreatePeerForElement(targetedButton);            }        }         /// <summary>        /// 激活targeted Button并启动targeted Button的单个明确操作        /// </summary>        /// <param name="parameter"></param>         protected override void Invoke(object parameter)        {            KeyEventArgs keyEventArgs = parameter as KeyEventArgs;            if (null != keyEventArgs && keyEventArgs.Key == Key.Enter)            {                if (null != this.peer && this.peer.IsEnabled())                {                    IInvokeProvider invokeProvider = this.peer.GetPattern(PatternInterface.Invoke) as IInvokeProvider;                    invokeProvider.Invoke();                }            }        }    }

然后为userPwdBox添加触发器。首先在该登录表单的XAML中添加如下声明:

xmlns:interaction="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"xmlns:behaviour="clr-namespace:SLDemo" (这个为TextBoxEnterBehaviour类所在命名空间)

然后修改userPwdBox为如下代码:

<PasswordBox x:Name="userPwdBox"     Grid.Row="1"     Grid.Column="1"     Width="220"     Height="26"     Password="{Binding Path=UserPwd,Mode=TwoWay,NotifyOnValidationError=True,ValidatesOnExceptions=True}"     PasswordChanged="userPwdBox_PasswordChanged">  <interaction:Interaction.Triggers>    <interaction:EventTrigger EventName="KeyDown">        <behaviour:TextBoxEnterBehaviour TargetName="loginBtn" />  (TargetName为关联的登录按钮的Name属性值)    </interaction:EventTrigger>  </interaction:Interaction.Triggers></PasswordBox>

这样便通过很好的方法实现了Silverlight应用中的文本框回车登录。因为这样真正避免了重复代码
原文地址:http://www.heroicyang.com/archives/2010/06/01/%E6%B5%85%E8%B0%88silverlight%E5%BA%94%E7%94%A8%E4%B9%8B%E5%9B%9E%E8%BD%A6%E7%99%BB%E5%BD%95%E6%9C%80%E4%BD%B3%E5%AE%9E%E8%B7%B5.html

来自: http://hi.baidu.com/guolulang/blog/item/f199bd3a1fda67d6d462253c.html