iT邦幫忙

第 12 屆 iT 邦幫忙鐵人賽

DAY 12
0
Mobile Development

Andriod Studio 菜鳥的學習分享系列 第 12

[Android Studio菜鳥的學習分享]基本元件介紹-EditText & TextView & Button

今天要介紹三個非常常用的基本元件,
並將他們三個組合來練習使用。
EditText:輸入欄位
TextView:字串顯示欄位
Button:按鈕


目標:

在輸入欄位輸入字串,
按下送出按紐後,
字串顯示欄位顯示出剛剛輸入的字串。

結果預覽:

https://ithelp.ithome.com.tw/upload/images/20200906/20129524DuCqempD6l.jpg

activity_main.xml

https://ithelp.ithome.com.tw/upload/images/20200906/20129524AfVyKLTe8k.jpg

MainActivity.java

https://ithelp.ithome.com.tw/upload/images/20200906/20129524CTJIYK4aUA.jpg


activity_main.xml 原始碼展示


共同屬性

1. android:layout_width

物件寬度
(1)直接輸入固定數值(單位建議使用dp)

(2)match_parent
跟隨父容器大小

(3)wrap_content
依照物件內容自適應大小

2. android:layout_height

物件高度

3. android:id

物件ID


< LinearLayout >

LinearLayout我只更動兩個屬性

1. android:orientation

LinearLayout的必要屬性
horizontal(水平排序)
https://ithelp.ithome.com.tw/upload/images/20200906/20129524UjlIsdmXvS.jpg

vertical(垂直排序)
https://ithelp.ithome.com.tw/upload/images/20200906/20129524AZkTYSf31y.jpg

2. android:gravity

物件對齊

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:orientation="vertical"
    tools:context=".MainActivity">
    
</LinearLayout>

< EditText >

<EditText
    android:layout_width="150dp"
    android:layout_height="wrap_content"
    android:id="@+id/edittitle">

</EditText>

< TextView >

1. android:text

顯示文字

2. android:textAlignment

顯示文字對齊

3. android:textSize

顯示文字大小(單位建議使用sp)

<TextView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="N/A"
    android:textAlignment="center"
    android:textSize="30sp"
    android:id="@+id/textoutput">

</TextView>

< Button >

1. android:text

顯示文字

<Button
    android:layout_width="150dp"
    android:layout_height="wrap_content"
    android:text="送出"
    android:id="@+id/btnoutput">

</Button>

MainActivity.java 原始碼展示


Step01-產生變數:

private EditText edittitle;
private TextView textoutput;
private Button btnoutput;

Step02-變數綁定ID:

edittitle = (EditText) findViewById(R.id.edittitle);
textoutput = (TextView) findViewById(R.id.textoutput);
btnoutput = (Button) findViewById(R.id.btnoutput);

Step03-新增按鈕監聽器:

btnoutput.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
        textoutput.setText(edittitle.getText());
    }
});

上一篇
[Android Studio菜鳥的學習分享]Android Activity 生命週期介紹
下一篇
[Android Studio菜鳥的學習分享]頁面跳轉切換-Intent
系列文
Andriod Studio 菜鳥的學習分享30

尚未有邦友留言

立即登入留言