LayaAir textInput 單行輸入&多行輸入
目錄
textInput 元件
文字輸入框是遊戲中經常會用到的一個 UI 元件，任何時候需要輸入的時候都要使用到 laya.ui.textInput 類。
| Package | laya.ui |
| 類 | public class TextInput |
| Inheritance | TextInput  Label Component Sprite Node EventDispatcher Object |
| 子類 | TextArea |
TextInput 類用於建立顯示物件以顯示和輸入文字，常用 API 如下：
| Property | Defined By |
|---|---|
| editable : Boolean 設定可編輯狀態。 | TextInput |
| focus : Boolean 表示焦點是否在此例項上。true 表示元件獲得焦點，預設為 false。 | TextInput |
| height : Number [override] 表示顯示物件的高度，以畫素為單位。 注：當值為0時，高度為自適應大小。 | TextInput |
| inputElementXAdjuster : int 設定原生input輸入框的x座標偏移。 | TextInput |
| inputElementYAdjuster : int 設定原生input輸入框的y座標偏移。 | TextInput |
| maxChars : int 字元數量限制，預設為10000。 設定字元數量限制時，小於等於0的值將會限制字元數量為10000。 |
TextInput |
|
文字域即 Text ，可以理解為 Html 中的 textArea |
TextInput |
| prompt : String 設定輸入提示符。 | TextInput |
| promptColor : String 設定輸入提示符顏色。 | TextInput |
| restrict : String 限制輸入的字元。 | TextInput |
| sizeGrid : String 當前例項的背景圖（ AutoBitmap ）例項的有效縮放網格資料。 資料格式："上邊距,右邊距,下邊距,左邊距,是否重複填充(值為0：不重複填充，1：重複填充)"，以逗號分隔。 例如："4,4,4,4,1" |
TextInput |
| skin : String 物件的面板地址，以字串表示。 如果資源未載入，則先載入資源，載入完成後應用於此物件。 注意：資源載入完成後，會自動快取至資源庫中。 |
TextInput |
| text : String [override] 當前文字內容字串。 | TextInput |
| type : String 輸入框型別為Input靜態常量之一。 TYPE_TEXT、TYPE_PASSWORD 、TYPE_EMAIL 、TYPE_URL、 TYPE_NUMBER、 TYPE_RANGE 、TYPE_DATE、 TYPE_MONTH、 TYPE_WEEK 、TYPE_TIME 、TYPE_DATE_TIME、 TYPE_DATE_TIME_LOCAL 平臺相容性參見http://www.w3school.com.cn/html5/html_5_form_input_types.asp。 |
TextInput |
| width : Number [override] 表示顯示物件的寬度，以畫素為單位。 注：當值為0時，寬度為自適應大小。 |
| Method | Defined By |
|---|---|
| TextInput(text:String) 建立一個新的 TextInput 類例項。 |
TextInput |
| destroy(destroyChild:Boolean = true):void [override] 銷燬此物件。destroy物件預設會把自己從父節點移除，並且清理自身引用關係，等待js自動垃圾回收機制回收。destroy後不能再使用。 destroy時會移除自身的事情監聽，自身的timer監聽，移除子物件及從父節點移除自己。 |
TextInput |
| select():void 選中輸入框內的文字。 |
TextInput |
更多 API 請參考官網 API 地址：https://layaair.ldc.layabox.com/api/?category=UI&class=laya.ui.TextInput
編碼示例
LayaAir 引擎版本為 2.0.0beat5 版本。
//單行文字輸入框
let text_singleLineInput = function(){
//建立文字輸入框物件
//構造器中的內容會直接顯示在元件中當做實際內容，而並非提示內容
let textInput = new Laya.TextInput("住址：");
//wordWrap 表示文字是否自動換行，預設為false。 若值為true，則自動換行；否則不自動換行
textInput.wordWrap = true;//此屬性繼承自父類 Label
//width：[override] 表示顯示物件的寬度，以畫素為單位。 注：當值為0時，寬度為自適應大小。
//height：[override] 表示顯示物件的高度，以畫素為單位。 注：當值為0時，高度為自適應大小。
textInput.width = 300;
textInput.height = 100;
//設定元件顯示的座標位置，相當於分別設定x和y屬性，繼承自父類 Sprite
textInput.pos(10,10);
//文字背景顏色，以字串表示。 繼承自父類 Label
textInput.bgColor = "#007ACC";
//指定文字的字型大小（以畫素為單位）。 預設為20畫素，可以通過 Text.defaultSize 設定預設大小。
//繼承自父類 Label
textInput.fontSize = 22;
//設定輸入框預設獲得焦點
textInput.focus = true;
Laya.stage.addChild(textInput);
};
//多行文字輸入框
let text_multiLineInput = function(){
let textInput = new Laya.TextInput();
textInput.fontSize = 22;
textInput.bgColor = "#007ACC";
textInput.width = 200;
textInput.height = 100;
textInput.x = 10;
textInput.y = 120;
textInput.wordWrap = true;
//multiline：true 表示當前是文字域，支援多行輸入
textInput.multiline = true;
//限制輸入的最大字數為 50，超過時不再顯示
textInput.maxChars = 50;
//輸入框提示符，相當於 Html 的 placeholder 屬性，當用戶實際輸入時，提示字元會消失
textInput.prompt = "教育經歷...";
Laya.stage.addChild(textInput);
};
//密碼框
let text_passwordInput = function(){
let textInput = new Laya.TextInput();
textInput.width = 300;
textInput.height = 100;
textInput.pos(10,250);
textInput.bgColor = "#007ACC";
textInput.fontSize = 22;
textInput.prompt = "密碼";
//設定文字輸入框型別為 密碼框，密碼框內容不可見，laya.display.Input 中提供了各種型別
textInput.type = Laya.Input.TYPE_PASSWORD;
Laya.stage.addChild(textInput);
}
//初始化引擎，指定舞臺場景大小，瀏覽器如果不支援 WebGL ，則會自動切換為 Canvas
Laya.init(360,640,Laya.WebGL);
//設定舞臺背景顏色
Laya.stage.bgColor = "#474749";
text_singleLineInput();
text_multiLineInput();
text_passwordInput();
可參考官網示例：
https://layaair.ldc.layabox.com/demo/?category=2d&group=Text&name=InputSingleline
https://layaair.ldc.layabox.com/demo/?category=2d&group=Text&name=InputMultiline