Android Studio: Building UI

New Project

File > New > New Project > Empty Activity

Name          MyApplication
Package Name  com.example.myapplication

Klik "Finish"

Open the Layout Editor

• Di Project window > app > res > layout > activity_main.xml.
• Click (Select Design Surface) > Blueprint.
• Click (View Options) > Show All Constraints pastikan checked.
• (Enable Autoconnection to Parent) > Disable Autoconnect to parent.
• (Default Margins) > 16
• (Device for Preview) > 5.5

Add text box

• Buang / Bersihkan yang ada di layout, terutama tulisan "Hello World!". Select > Delete.
• Palette > Text > Plain Text (drag ke lokasi yang di inginkan)

Add a button

• Palette > Buttons > button (drag ke lokasi yang di inginkan)
• Create a constraint from the left side of the button to the right side of the text box.
• Buat constrain the views agar horizontal sejajar, buat constraint antara text baseline. Right-click button > Show Baseline sampai muncul baseline anchor. baseline anchor di dalam button disambungkan dengan baseline di text box.

Change the UI strings

• Project window > app > res > values > strings.xml > Open editor
• Klik +

 Key             edit_message
 Default Value   Enter a message

• Klik +

 Key             button_send
 Default Value   Send

• Project window > app > res > layout > activity_main.xml > Attribute

 text > Name (di delete Name-nya) > klik list > edit_message
 text > Button (di delete Button-nya) > klik list > button_send

Referensi

https://developer.android.com/training/basics/firstapp/building-ui