Today Preview

1. 正文

今日內容主要分成三個部分：

1. TextField
2. TextEditor
3. 輸入相關
4. 又在抱怨(不是說三個部分嗎)

TextField介紹

1. init方式

• 傳入的text就是place holder(在Flutter叫做hint☘️☘️☘️)
• 一樣會綁定一個binding變數，用來取得user輸入的內容
  以前在Flutter很多元件都會用到contoller這個屬性來控制元件，但SwiftUI並沒有這個概念⚠️⚠️⚠️，大部分都是用Modifier

2. 監聽輸入完成

• 使用 .onSubmit()這個Modifier，這裡用個alert來示範，實務上可以拿來打API之類的

3. style

• 分成 .automatic .plain .roundedBorder
  automatic就是plain
  plain就是沒有樣式
  roundedBorder就是跟以前UITextField長得一樣
• 而以前是否隱藏文字只是UITextField的一個小屬性，到了現在竟然升級成一個獨立元件

TextEditor

這東西在UIKit叫做UITextView，以前在iOS就滿特別了，因為他是繼承自UIScrollView，不是UITextField XDD
在Flutter並沒有類似的Widget⚠️⚠️⚠️，而是採取了跟Android一樣的做法：使用TextField，然後用maxLines這個屬性去控制
使用這個元件的時候需要注意，因為‘return’鍵被拿來換行了，所以必須思考縮鍵盤的手段，例如做個按鈕, 點背景, 甚至在鍵盤上做條bar(Android就不用操心這檔事，因為人家有個系統back鍵)

輸入相關

1. 首先最常見的是改鍵盤類型.keyboardType(.numberPad)
   不過preview running雖然可以輸入，但是不會顯示鍵盤，這邊要跑模擬器驗證
2. 再來就是Focus，有個特別的@FocusState專門來處理
   用來判斷是否開始輸入啦、管理鍵盤啦
   這邊要實現一個很常見的效果：一進頁面就跳鍵盤
   查了一下發現一個很像workaround的作法...當然是先抄再說囉XDD
3. 實作keyboard上的tool bar發現沒辦法by field去處理，例如有的欄位要tool bar要有的不要

又在抱怨

其實抱怨才是撰寫本專欄的目的（？

1. 如果是使用.roundedBorder style 或 TextEditor，是沒辦法改背景色的，除非使用黑魔法偷改UIKit
2. place holder的顏色也沒辦法修改，隨便一查就發現超多奇技淫巧

呼應第一集提到的『SwiftUI可以變動的彈性較低，Flutter的Widget就是比較開放，怎麼調整都可以，但SwiftUI總是有實現不了的部分。』
這就是我最討厭SwiftUI的地方，對畫面的掌控度太低了，Flutter這麼基本的東西一定有提供修改⚠️⚠️⚠️

code

1. 幫這頁上底色
   

2. TextField
   

3. TextEditor
   

2. 對照表

Tomorrow Preview

跨界學習系列文章

Android版：iOS Developer Learning Android. Lesson 10 - TextView + EditText (不用寫code就可做到跑馬燈跟UITextView自動長高)
Flutter版：iOS Developer Learning Flutter. Lesson6 文字顯示與輸入

https://github.com/mark33699/FDLS