国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁 > 編程 > C# > 正文

UGUI實現4位驗證碼輸入

2020-01-24 00:01:17
字體:
來源:轉載
供稿:網友

原本在電腦上開發一個驗證碼功能不是什么難題,4個InputField就搞定了,依次監聽InputField的onValueChanged,當value.length == 1時跳轉至下一個InputField,并ActiveField即可。

但是到了手機上,跳轉至下一個InputField時,手機鍵盤會收縮,然后再彈出,然而,手機上的鍵盤如果間隔過短,會出現收回后不再彈出的情況。即使設置了0.2秒的間隔,也會因為手機鍵盤反復伸縮導致用戶輸入驗證碼出現間斷感,極大降低了體驗。

那么有沒有辦法實現這個功能呢?當然有啦!

雖然說NGUI完全可以通過設置字間距來完成,但是UGUI的InputField并沒有這樣的屬性。因此,得通過一些黑科技來實現。

此外,其他大佬用代碼實現了UGUI的InputField的字間距設置,但是本篇主要是講述黑科技方法。

先看下這個預制體結構:

在這個InputField下添加了4個VCode(UnityEngine.UI.Text)組件,并在對應的下方添加了一個Line(Image)的子物體,用來做下劃線。(每當一位驗證碼輸入完成后,跳轉至下一個Text組件顯示新的驗證碼,切已輸入的驗證碼的下劃線變成藍色)

是不是有思路了,沒錯,就是用4個Text組件來顯示驗證碼,而InputField這是用來接收用戶輸入而已(不顯示輸入結果)。

這樣的情況下,不會因為跳轉InputField導致手機鍵盤反復伸縮或間隔過小而導致手機鍵盤不再彈出等問題。

每當用戶輸入的驗證碼位數發生變化,則將對應的位數賦給對應的Text,這樣就做到了只使用1個InputField來輸入4位驗證碼,而無需關心驗證碼之間的間距長度了。

既然邏輯構思好了,代碼就不難了。

using System;using System.Collections;using System.Collections.Generic;using System.Text;using UnityEngine;using UnityEngine.EventSystems;using UnityEngine.UI; public class VerifyCodePanel : ILoginChild{   public const int VERIFY_CODE_LENGTH = 4;   public InputField VCodeInput;  public Text[] VCodes = new Text[VERIFY_CODE_LENGTH];   //外部選擇藍色與灰色,分別表示已輸入(Blue)和未輸入(Gray)  public Color Blue;  public Color Gray;   private int m_lastVcodeLength = 0;   void Start()  {    //外部設置VCodeInput等組件,或使用代碼獲取,這必須在初始化或之前設置完成    //UIUtility是自己實現的一個針對UI組件獲取與綁定的一個工具    VCodeInput = UIUtility.GetChildControl<InputField>("VCodeInput", transform);    BindUIEvents();  }   private void BindUIEvents()  {    //綁定VCodeInput的值變化,外部綁定和代碼綁定皆可,這里使用的是自己實現的一個UI工具    UIUtility.BindUIEvent(EventTypeEnum.InputFieldOnValueChanged,          OnVCodeValueChanged, VCodeInput.transform);  }   // 監聽輸入的字符變化  private void OnVCodeValueChanged(string value)  {    //外部已經設置好VCodeInput的長度限制,最多為4,但是為了避免意外情況,限制字符長度    if (value.Length < 0 || value.Length > 4)    {      return;    }    //判斷字符是邊長了還是變短了,用以決定Text的跳轉方向    bool next = false;    //分割字符,默認為空,如果是長度增加,則說明輸入了新的驗證碼,將這個驗證碼記錄下來    string character = string.Empty;    //比較與上一次輸入的驗證碼長度,缺省長度為0    if(value.Length > m_lastVcodeLength)    {      next = true;      character = value[value.Length - 1].ToString();    }    m_lastVcodeLength = value.Length;    int which = value.Length - 1;    OnMoveCursor(next, which, character);  }   //移動光標(實際上是操作用來顯示驗證碼的Text)  private void OnMoveCursor(bool next, int which, string character)  {    //將值賦給對應的Text    if (next)    {      VCodes[which].text = character;      SetLineColor(which, Blue);    }    else    {      /*這里比較繞,如果是回退,則說明當前的which其實是已經退格后的位數,      * 比如說,原本是輸入了123,退格后則變成了12,      * 那么which的值為value.length - 1 = 1; value.length為2      * 而我們需要將原本第三位(從0開始計數,值為2)的Text設置為空      * 因此需要i + 1,而為了避免用戶全選并刪除所有驗證碼的情況,需要遍歷      */      for (int i = which; i < VERIFY_CODE_LENGTH - 1; ++i)      {        VCodes[i + 1].text = character;        SetLineColor(i + 1, Gray);      }    }  }   //設置相應Text的Line的顏色  private void SetLineColor(int which, Color color)  {    VCodes[which].transform.GetChild(0).GetComponent<Image>().color = color;  }  }

以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持武林網。

發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
主站蜘蛛池模板: 和田市| 新巴尔虎左旗| 勐海县| 鲁山县| 富平县| 雷州市| 商河县| 辽源市| 雅江县| 天水市| 乐平市| 湘阴县| 松溪县| 朝阳市| 镇宁| 自贡市| 临澧县| 讷河市| 平利县| 辽阳县| 木里| 钦州市| 阿鲁科尔沁旗| 民和| 望城县| 新竹市| 德安县| 淳化县| 玉田县| 武平县| 元阳县| 永登县| 柘城县| 光泽县| 铜川市| 永吉县| 清涧县| 晋江市| 扎鲁特旗| 沁源县| 眉山市|