WPF MVVM制作发送短信小按钮
最近做一个项目,因为涉及到注册,因此需要发送短信,一般发送短信都有一个倒计时的小按钮,因此,就做了一个,在此做个记录。
一、发送消息
没有调用公司的短信平台,只是模拟前台生成一串数字,将此串数字输出一下。
在这个部分写了两个类文件:一个是生成随机数,一个是模拟发送此数字的。
1、因为生成几位随机数,是必须要到项目上线之前才能定的,因此,写了一个带参数的函数,如下
/// <summary> /// 生成随机验证码 /// </summary> public static class RandomCode { /// <summary> /// 返回一个N位验证码 /// </summary> /// <param name="N">位数</param> /// <returns></returns> public static string RandomCodeCommand(int N) { string code = ""; Random random = new Random(); for (int i = 0; i < N; i++) { code += random.Next(9); } return code; } }
2、模拟发送此串数字。
这个类里面用了两个Timer函数,一个是用作Button的倒数显示的,另一个是用作保存这个验证码时长的。
在记录验证码的同时,还需要记录发送验证码的手机号,以防止,用户用第一个手机号点击了发送验证码后,把手机号部分修改为其他的手机号。
public class SendRandomCode : ViewModelBase { private int _interval;//记录倒计时长 private string idCode;//在规定时间内保存验证码 private int idCodeTime;//设置验证码的有效时间(秒) private int idCodeNum = 6;//设置验证码的位数 public void GetCode(string phoneNum) { //获取验证码 timerSend = new Timer(1000); timerSend.AutoReset = true; timerSend.Elapsed += Timer_Elapsed; _interval = SecondNum; timerSend.Start(); //在验证码有效期内,再次请求验证码,需要先关闭上一次的 if (timerTime != null) { timerTime.Close(); timerTime.Dispose(); } //验证码的有效期 timerTime = new Timer(1000); timerTime.AutoReset = true; timerTime.Elapsed += TimerTime_Elapsed; timerTime.Start(); idCodeTime = SaveTime; IdCode = RandomCode.RandomCodeCommand(idCodeNum); PhoneNum = phoneNum; } #region 获取验证码倒计时 Timer timerSend; Timer timerTime; private void Timer_Elapsed(object sender, ElapsedEventArgs e) { BtnIsEnable = false; BtnContent = "(" + (_interval--) + ")秒后再次获取验证码"; if (_interval <= -1) { BtnIsEnable = true; BtnContent = "获取验证码"; timerSend.Stop(); timerSend.Dispose(); } //throw new NotImplementedException(); } private void TimerTime_Elapsed(object sender, ElapsedEventArgs e) { idCodeTime--; if (idCodeTime <= 0) { IdCode = ""; timerTime.Stop(); timerTime.Dispose(); } Console.WriteLine(IdCode); //throw new NotImplementedException(); } #endregion #region 字段 //*************************************************************************************************//上线时需要修改 private int secondNum = 30;//设置倒计时长 private int saveTime = 60;//设置保存验证码时长 //*************************************************************************************************// private string btnContent = "获取验证码";//设置获取验证码按钮显示的名称 private bool btnIsEnable = true;//设置获取验证码按钮是否可用 private string phoneNum;//记录是否是发送验证码的手机号 public int SecondNum { get { return secondNum; } set { secondNum = value; } } public int SaveTime { get { return saveTime; } set { saveTime = value; } } public string BtnContent { get { return btnContent; } set { btnContent = value; RaisePropertyChanged("BtnContent"); } } public bool BtnIsEnable { get { return btnIsEnable; } set { btnIsEnable = value; RaisePropertyChanged("BtnIsEnable"); } } public string IdCode { get { return idCode; } set { idCode = value; RaisePropertyChanged("IdCode"); } } public string PhoneNum { get { return phoneNum; } set { phoneNum = value; RaisePropertyChanged("PhoneNum"); } } #endregion }
二、XAML页面代码
<Grid> <Grid.RowDefinitions> <RowDefinition/> <RowDefinition/> </Grid.RowDefinitions> <StackPanel Grid.Row="0" HorizontalAlignment="Center" VerticalAlignment="Center" Orientation="Horizontal"> <Label Content="手机号"/> <TextBox Text="{Binding PhoneNum}" Height="20" Width="100"/> <Button Content="{Binding Src.BtnContent}" IsEnabled="{Binding Src.BtnIsEnable}" Command="{Binding SendCode}" Height="20" Width="120"/> </StackPanel> <StackPanel Grid.Row="1" HorizontalAlignment="Center" VerticalAlignment="Center" Orientation="Horizontal"> <Label Content="验证码"/> <TextBox Text="{Binding IdentifyCode}" Height="20" Width="100"/> <Button Content="提交" Command="{Binding Submit}" Height="20" Width="120"/> </StackPanel> </Grid>
三、VM页面代码
VM页面没有什么特别的,就是声明了一些字段,
特别注意的是,由于前台的XAML页面上的发送短信按钮是需要倒计时的,因此Button的Content和IsEnable需要绑定到SendRandomCode这个类上,所以需要在VM下声明一下这个类
public class BingVM: ViewModelBase { #region 界面字段 private string phoneNum;//手机号 private string identifyCode;//验证码 public string PhoneNum { get { return phoneNum; } set { phoneNum = value; RaisePropertyChanged("PhoneNum"); } } public string IdentifyCode { get { return identifyCode; } set { identifyCode = value; RaisePropertyChanged("IdentifyCode"); } } #endregion #region 为获取验证码按钮设置content和isEnable用的 SendRandomCode src = new SendRandomCode(); public SendRandomCode Src { get { return src; } set { src = value; } } #endregion private RelayCommand sendCode;//获取验证码 public RelayCommand SendCode { get { return sendCode ?? (sendCode = new RelayCommand( () => { if (!string.IsNullOrEmpty(PhoneNum)) { src.GetCode(PhoneNum); } else { MessageBox.Show("手机号不能为空!"); } })); } } private RelayCommand submit; public RelayCommand Submit { get { return submit ?? (submit = new RelayCommand( () => { if (IdentifyCode == src.IdCode && PhoneNum == src.PhoneNum) { MessageBox.Show("验证成功"); } else { MessageBox.Show("验证失败"); } })); } } }
四、效果展示
上面是成功的效果图。
验证失败的情况如下:
1、如果在发送验证码的过程中,把手机号修改了,填入原有的验证码
2、如果输入的验证码不是程序输出的验证码
3、时间超过了验证码的保存时间
BUG修复:
刚才在测试的过程中发现了一个问题,由于我们做的主程序是调用模块的DLL文件生成磁贴的,而主程序的返回按钮,不会关闭掉当前磁贴的所有线程,导致当返回再进入此磁贴时,再次点击发送按钮,则会再次出现一个验证码,解决方式很简单:修改SendRandomCode代码,在Timer timerTime;前加static,是其成为静态的。这样再次点击时,就是知道线程已存在,先关闭再发送。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持猪先飞。
相关文章
c# WPF中通过双击编辑DataGrid中Cell的示例(附源码)
这篇文章主要介绍了c# WPF中通过双击编辑DataGrid中Cell的示例(附源码),帮助大家更好的理解和学习使用c#,感兴趣的朋友可以了解下...2021-03-03- 下面小编就为大家带来一篇利用JS实现点击按钮后图片自动切换的简单方法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧...2016-10-25
- 最近在网上看到了新版的360安全卫士,感觉界面还不错,于是用WPF制作了一个,时间有限,一些具体的控件没有制作,用图片代替了。感兴趣的朋友一起跟着小编学习WPF实现类似360安全卫士界面的程序源码分享...2020-06-25
- 这篇文章主要为大家详细解析了BootStrap栅格系统、表单样式与按钮样式源码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2017-01-23
- 这篇文章主要介绍了C#使用浏览按钮获得文件路径和文件夹路径的方法,结合实例形式分析了C#浏览器事件响应及文件操作相关技巧,需要的朋友可以参考下...2020-06-25
- 在淘宝等购物网站,我们都会看到一个发送短信倒计时的按钮,究竟是如何实现的呢?下面小编通过本篇文章给大家分享一段代码关于js实现手机短信按钮倒计时,需要的朋友参考下...2016-01-02
- 这篇文章主要为大家介绍了python编程使用PyQt5如何创建按钮及触发点击事件的示例解析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步...2021-10-29
- 这篇文章主要为大家详细介绍了WPF仿三星手机充电界面实现代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2020-06-25
- 这篇文章主要为大家详细介绍了jquery mobile实现可折叠的导航按钮,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2017-03-13
- 这篇文章主要介绍了微信小程序将页面按钮悬浮固定在底部的实现代码,代码简单易懂,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下...2020-10-29
- 这篇文章主要介绍了C# WPF 通过委托实现多窗口间的传值的方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧...2020-06-25
- javascript代码判断按钮是否被点击了在项目中经常会遇到这个需求,今天小编抽点时间给大家分享一段代码关于javascript判断按钮是否被点击的方法,感兴趣的朋友一起学习吧...2015-12-14
- 这篇文章主要介绍了javascript+css3 实现动态按钮菜单特效的相关资料,需要的朋友可以参考下...2016-02-12
- 这篇文章主要为大家详细介绍了vue实现自定义多选按钮,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2020-07-16
- 这篇文章主要介绍了如何在.Net版本UEditor中添加一个普通按钮,需要的朋友可以参考下...2021-09-22
- 下面小编就为大家带来一篇JS判断键盘是否按的回车键并触发指定按钮点击操作的方法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧...2017-02-19
- 这篇文章主要介绍了Angular2搜索和重置按钮过场动画,需要的朋友可以参考下...2017-05-27
- 这篇文章主要介绍了C#中WPF使用多线程调用窗体组件的方法,涉及C#中多线程的使用技巧,具有一定参考借鉴价值,需要的朋友可以参考下...2020-06-25
- 这篇文章主要为大家详细介绍了WPF TextBox实现按字节长度限制输入功能,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2020-06-25
- 这篇文章主要为大家详细介绍了WPF InkCanvas绘制矩形和椭圆,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2020-06-25