DevExpress使用教程：利用WizardControl構建多步向導界面 时间：2015/11/3 4:37:17 来源：慧都控件網

DevExpress使用教程：利用WizardControl構建多步向導界面

　　利用好的界面控件，往往能做成比較棒的界面體驗效果。在一些界面操作里面，我們可能把它拆分為幾部進行處理，這個時候引入WizardControl向導控件應該是比較不錯的選擇了。多步的處理方式，可以讓用戶避免一次性輸入太多內容的煩躁心情，也可以針對性的校驗部分內容，本文以利用 WizardControl控件來設計找回密碼的結果來進行介紹，使大家對基于 DevExpress的WizardControl向導控件的使用有一個大概的了解。

　　| DevExpress最新版下載|

　　1、界面效果的規劃在一般APP或者基于網路的軟體界面里面，都有一個為了幫助用戶找回賬號密碼的功能，可以讓用戶自助通過手機、郵件等方式獲得充值密碼的機會。如一般的APP界面效果如下所示。

　　我們拖動能這個控件到一個空白的窗體界面上，就可以看到默認有一些界面了，我們在其中可以看到一個完整的向導界面效果的。

　　拖動過來的控件，初始化界面效果都是英文的，可以通過控件內容對其中的文字進行修改即可。

　　修改后的界面效果如下所示。

　　然后我們修改向導控件的一些內容，如圖片、文字等內容，最后在其中空白的位置，拖入一些界面控件，實現我們的界面效果即可。

　　另外默認的向導控件是三個界面頁的，因此我們可以根據需要增加或者刪除一些，如本例我就移除了一個，僅僅使用兩個頁面來處理密碼的找回處理即可。

　　另外，我們為了實現向導控件界面的輸入驗證和處理，我們往往還需要對其中下一步、完成、取消、幫助等事件進行處理，這樣才能達到較好的處理效果。

　　其中部分處理代碼如下所示。

　　private void wizardControl1_NextClick(object sender, DevExpress.XtraWizard.WizardCommandButtonClickEventArgs e) { string pageText = e.Page.Text; if(pageText == "驗證賬號") { if (this.txtMobile.Text.Length == 0 || this.txtValidateCode.Text.Length == 0) { MessageDxUtil.ShowTips("請輸入手機號碼和驗證碼"); e.Handled = true; this.txtValidateCode.Focus(); return; } else if(!ValidateUtil.IsValidMobile(this.txtMobile.Text)) { MessageDxUtil.ShowTips("請輸入正確的手機號碼"); e.Handled = true; this.txtMobile.Focus(); return; } else { bool result = CallerFactory.Instance.CheckSmsCode(this.txtMobile.Text, this.txtValidateCode.Text); if (!result) { MessageDxUtil.ShowTips("驗證碼校驗不正確，請檢查驗證碼是否在有效時間內。"); this.txtValidateCode.Focus(); return; e.Handled = true; } } } else if(pageText == "重置密碼") { MessageDxUtil.ShowTips(pageText); } }

　　在這些Next下一步事件里面，有一個代碼是需要阻塞下一步的處理的。

　　e.Handled = true;

　　這樣我們就可以實現對用戶輸入的驗證處理了，如果處理不通過，那么就停留在這個頁面上，讓用戶校正輸入即可。

　　如果是完成按鈕頁面，它的處理也是差不多。

　　private void wizardControl1_FinishClick(object sender, CancelEventArgs e) { if (this.txtCorpAccount.Text.Length == 0) { this.txtCorpAccount.Focus(); MessageDxUtil.ShowTips("公司賬號不能為空！"); e.Cancel = true; return; } else if(this.txtNewPassword.Text.Length == 0) { this.txtNewPassword.Focus(); MessageDxUtil.ShowTips("密碼不能為空！"); e.Cancel = true; return; } else if (!this.txtNewPassword.Text.Equals(this.txtRePassword.Text)) { this.txtRePassword.Focus(); MessageDxUtil.ShowTips("兩次密碼不一致！"); e.Cancel = true; return; } ...............

　　最后我們實現的效果就是前面所說的一樣了。

　　結合短信平臺，我們可以給用戶發送驗證碼以及提示消息即可。

　　本文原文為部落格園伍華聰發布。

　　DevExpress年終促銷火熱進行中！低至8折起！

　　如果您要購買DevExpress或者對產品還存在疑問，請咨詢我們的在線客服>>

　　0

　　有用(0)沒用(0)

　　本站文章除注明轉載外，均為本站原創或翻譯

　　歡迎任何形式的轉載，但請務必注明出處，尊重他人勞動成果

　　轉載請注明：文章轉載自：慧都控件網 []

　　本文地址：

本文相關推薦

相關資訊