第4天 UI基礎元件(二) : EditText - iT 邦幫忙::一起幫忙解決難題，拯救 IT 人的一天

link之家

链接快照平台

输入网页链接，自动生成快照
标签化管理网页链接

EditText

經過昨天的TextViewe跟Button的介紹，應該會有一種感覺，這些UI元件的寫法大概就是寬、高必須給，id通常也會設，再加一些該元件特有的屬性， ~~坐等IDE提醒我(大誤)~~ 。
EditText一樣是TextView的子類，同樣也是與用戶互動的常用重要元件之一。很常使用在聊天軟體、簡訊、社交軟體發文、帳號密碼登入、備忘錄、行事曆、購物網...等等，總之無所不在。

EditText常用的屬性

hint : 提示字串(一樣建議放入res/strings)，讓用戶知道這裡該輸入什麼資訊，是較好的使用者體驗，hint在開始輸入後就會消失。 maxLines : 高度設"wrap_content" 的情況下，若使用者輸入n行，那麼EditText的高度也會跟著拉高。maxLines是限制元件的行高，需注意並不是限制用戶輸入的最大行數，用戶仍然能輸入n行，文本會向上捲動只留下設定的行數，如 : android:maxLines="1"為顯示最新的一行。 inputType : 限制輸入的類型及鍵盤模式，有text、number、time、date...等多種設定值可選，鍵盤就會依照設定的值顯示相對應的鍵盤模式(如:number就會是數字鍵盤而不是英文字母鍵盤)，對提升使用者體驗也有好處。官方文件 maxLength : 最多顯示幾個字符，中文、英文字母、數字皆可。 maxEms : 是用來限制元件顯示寬度的，em是排版印刷上的單位，以字母'M'的寬度為基準，設定要讓用戶輸入幾個'M'的寬度，所以輸入數字、英文字母、中文能顯示的字符數量都會不同，並不能真正限制輸入的字符數。 有坑注意:只在寬度為"wrap_content"時適用，match_parent跟固定寬度均無法適用 。 importantForAutofill : IDE常常在EditText的編輯過程中出現黃色警告，建議設置 autoFillHint ，自動填充提示，這東西就是我們使用app時，若有輸入過的帳戶名、電話、地址等，都會出現的提示框，他好處是可以減少用戶重複輸入訊息的時間及輸入錯誤的情況，可以讓用戶體驗加分。如果不需的話就將android:importantForAutofill="no"加上去，IDE就會收起它的黃牌了。 autofill官方文件

   <EditText
        android:id="@+id/editTextInput"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="@string/edittext_hint"
        android:maxLength="12"
        android:maxLines="1"
        android:inputType="text"
        android:importantForAutofill="no"
        android:minHeight="48dp"/>     
在Activity取得輸入的內容，並Toast出來
EditText經常搭配按鈕來對輸入的內容做送出、確認...等等動作。下面以Toast來當例子
使用getText()方法取得輸入內容，".text"是kotlin的語法糖，語法糖就是友善開發者容易理解或簡化程式碼的語法，所以兩者做的事是一樣的，你也可以寫getText()，IDE會在字底下畫上蚯蚓線提醒可以使用語法糖讓程式碼更簡潔。再調用toString()將內容轉成字符串。

設置setOnClickListener，按下ok按鈕後彈出訊息泡泡
  //宣告變量與元件連結
    val editTextInput :EditText = findViewById(R.id.editTextInput)
    val btnOk : Button = findViewById(R.id.btnOK)
    btnOk.setOnClickListener {
        //取得EditText的內容並叫用toString()，以String的形式賦值給變量inputUsername
        val inputUsername = editTextInput.text.toString()
        //彈出以inputUsername為內容的訊息泡泡
        Toast.makeText(this,inputUsername,Toast.LENGTH_SHORT).show()
EditText官方文檔
註解可分單行註解跟多行註解，使用快捷鍵或直接打出符號也行:
Window:
單行快捷鍵ctrl + /
多行快捷鍵ctrl + shift + /
單行快捷鍵command + /
多行快捷鍵command + shift + /
// 我是單行註解
/*我是多行註解1
* 我是多行註解2
* 我是多行註解3*/
一段程式碼中夾雜這樣的文字解釋叫做註解，IDE在編譯的的時候會忽略它不去編譯，是用來輔助開發者了解這行或這區塊的程式碼什麼意思?在幹嘛?的好東西，尤其記憶力不好的時候，隔沒幾天在看自己寫的程式碼，猶如天書，這時候有註解的話就可以幫助回想，節省時間啊!

多人協作的時候，想了解別人的程式碼或是當個體貼的好夥伴，好的註解是少不了的，正所謂:註解下的好，不怕朋友少。

通常會註解自己獨立一(多)行，或下在完整的一句程式碼後面，個人不建議下在程式碼之中(如下)，因為打斷程式碼有礙閱讀，就像講話到一半被插話一樣難受。
 //可以這裡
 Toast.makeText(this,"You click the Alarm ImageButton"/*不報錯，但不推薦*/,Toast.LENGTH_SHORT).show() //可以這裡
 //可以這裡
一天一點點，打家明天見。絕對不是偷懶