今天正式開始畫面設計的部分,主要是學怎麼在Android Studio裡修改UI元件。打開activity_main.xml,它其實就是App的畫面設定。裡面有像TextView(顯示文字)、Button(按鈕)跟EditText(輸入框)這些元件。
我先在設計畫面拖了一個TextView出來,改了文字、大小和顏色,馬上在模擬器上就看到變化了,很有成就感。接著加上EditText讓使用者可以輸入名字,再放一個Button,按下去後顯示「Hello + 名字」。這邊要去 MainActivity.kt連接按鈕事件,類似:
val button = findViewById(R.id.button)
val editText = findViewById(R.id.editText)
val textView = findViewById(R.id.textView)
button.setOnClickListener {
textView.text = "Hello, ${editText.text}"
}
當我看到畫面上真的顯示出「Hello, xxx」的時候就知道成功了,雖然一開始還打錯ID名稱,但修幾次就成功了。
今天算是第一次讓畫面「動起來」,但還很粗糙簡陋,感覺離自己做出真正的App又更近一步。也開始體會UI跟程式是怎麼互相連動的,之後想試試做更可愛一點的介面。