新建項(xiàng)目

打開Android Studio，如果你還沒打開的話。然后File->New->New Project在新出現(xiàn)的New Project界面中：

new_project.png

• Application name中輸入應(yīng)用的名稱。我們的這個(gè)應(yīng)用就叫“Yo”。
• Company Domain里輸入“31day.com”。這個(gè)company domain就是公司域名，我們暫時(shí)就以這個(gè)系列為名稱。
• Project name里會出現(xiàn)com.a31day.yo。這個(gè)是可以編輯的，在這個(gè)名稱的后面有一個(gè)Edit按鈕。點(diǎn)擊之后可以進(jìn)入編輯狀態(tài)。
• Project location修改我們要創(chuàng)建的項(xiàng)目的位置，一般來說默認(rèn)的就可以。
  以上的內(nèi)容全部填寫完成之后，點(diǎn)擊Next。

target_android_devices.png

我們選擇的是手機(jī)和平板。在這個(gè)項(xiàng)目下有一個(gè)Minimum SDK。這個(gè)是項(xiàng)目最小支持哪個(gè)版本的系統(tǒng)。我們這里選擇API 21: Android 5.0 (Lollipop)。現(xiàn)在大多數(shù)的手機(jī)都可以支持到Android 5.0了。

之后繼續(xù)Next。

add_activity.png

np_customize_activity.png

編寫代碼

begin coding

在正式開始編寫代碼以前，這是你會看到的界面。點(diǎn)擊屏幕最上的綠色三角形按鈕，AVD會運(yùn)行起來，并且我們的應(yīng)用也會在這個(gè)AVD中運(yùn)行起來。

avd

現(xiàn)在的APP還太簡單，只是一個(gè)Hello World！離我們需要的功能還差的多。現(xiàn)在就開始編寫代碼，添加我們需要的功能。

布局

我們在創(chuàng)建項(xiàng)目的時(shí)候就已經(jīng)設(shè)定了布局文件的名稱activity_main.xml。這個(gè)文件在app/res/layout目錄下。雙擊打開。

linearlayout

在布局中的TextView是一個(gè)展示只讀文本的視圖。Android中接受用戶輸入，展示文本和用戶可以點(diǎn)擊的按鈕等都叫做視圖。在第二行可以看到LinearLayout，這個(gè)是用來存放各種視圖的容器。但是Android Studio默認(rèn)生成的不是這個(gè)布局容器。我們需要手動修改為LinearLayout，并參照上圖添加一下內(nèi)容：android:orientation="vertical"。這句的意思就是保證在這個(gè)布局容器的視圖全部是按照添加的順序豎直向下依次排列的。稍后會有詳細(xì)的介紹。這里不做深究。

以上都好了以后就可以添加我們需要的視圖了。首先，我們需要一個(gè)可以讓用戶輸入名字的視圖。EditText就是專門負(fù)責(zé)接收用戶輸入的內(nèi)容的。

在TextView的下面鍵入以下內(nèi)容：

    <EditText
        android:id="@+id/username_edittext"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="what's your name?" />

• android:id, 這個(gè)后面java代碼用來關(guān)聯(lián)視圖的唯一字符串。名字隨便起，但是為了容易辨認(rèn)我們用前面是作用（輸入用戶名的）后面是視圖名稱，中間是下劃線的組成方式。
• android:layout_width，視圖的寬度，必須要寫。否則報(bào)錯。"match_parent"是指和LinearLayout一樣寬。
• android:layout_height 視圖的高度，必填。"wrap_content"是指高度僅限包裹內(nèi)容。
• android:hint，輸入的時(shí)候的提示。

接下來需要一個(gè)按鈕，點(diǎn)擊之后可以在“hello world”的TextView里輸出“Yo 誰誰誰”的字符串。

添加按鈕：

    <Button
        android:id="@+id/enter_button"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Yo" />

• android:id，和上文一個(gè)意思。
• android:layout_width，同上。
• android:layout_height，同上。
• android:text，是按鈕上顯示的文本內(nèi)容。

打開Preview（預(yù)覽），可以看到我們添加的視圖都已經(jīng)按照自上而下的順序顯示了出來。

Preview 預(yù)覽

讓視圖動起來

視圖都有了，下過的米都有了。下面就來添加Java代碼，讓這些視圖動起來。

在app/java/com.a31day.yo中找到activity文件。雙擊打開?，F(xiàn)在代碼是這樣的：

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }
}

要讓視圖聯(lián)動，勢必先找到要用到的視圖。在setContentView(R.layout.activity_main);后面敲回車，準(zhǔn)備鍵入我們查找視圖的代碼。

首先找到“Yo”按鈕：

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Button yoButton = (Button) findViewById(R.id.enter_button);
    }
}

方法findViewById就是專門用來找布局中的視圖的。我們在布局中添加按鈕的時(shí)候的android:id="@+id/enter_button"就指定了按鈕視圖的id為* enter_button。找到視圖之后得到的是最原始的視圖類型，所以需要強(qiáng)制的轉(zhuǎn)化為我們需要的特定類型的視圖類型，比如按鈕和下面的EditText。*
下面再找到輸入用的視圖：

EditText nameEditText = (EditText) findViewById(R.id.username_edittext);

現(xiàn)在輸入用的和點(diǎn)擊用的視圖都有了。由于輸入的內(nèi)容我們只需要取出來就可以，所以不需要復(fù)雜的處理。這里開始處理按鈕視圖的點(diǎn)擊功能。

    yoButton.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            // 這里添加點(diǎn)擊的處理代碼
        }
    });

把// 這里添加點(diǎn)擊的處理代碼替換成我們獲取用戶輸入的內(nèi)容的代碼：

yoButton.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        String inputString = nameEditText.getText().toString();
    }
});

似乎忘了一件事吧。可以輸入，可以點(diǎn)擊說“Yo”了。怎么輸入呢？說好的用“hello world”的TextView來顯示Yo的內(nèi)容的呢？這個(gè)當(dāng)做一個(gè)零時(shí)的問題，有你來處理。

1. 在布局文件中給TextView添加id。
2. 在MainActivity類中添加查找這個(gè)視圖的代碼。

只是一個(gè)小問題，這里給出答案：
布局：

    <TextView
        android:id="@+id/yo_textview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World!" />

代碼：

TextView yoTextView = (TextView) findViewById(R.id.yo_textview);

那么我們就可以輸出我們需要的內(nèi)容了。

yoButton.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        String inputString = nameEditText.getText().toString();
        yoTextView.setText("Yo " + inputString);
    }
});

運(yùn)行起來看一下吧。

完整代碼

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="com.a31day.yo.MainActivity">

    <TextView
        android:id="@+id/yo_textview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World!" />

    <EditText
        android:id="@+id/username_edittext"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="what's your name?" />

    <Button
        android:id="@+id/enter_button"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Yo" />

</LinearLayout>

java代碼：

package com.a31day.yo;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Button yoButton = (Button) findViewById(R.id.enter_button);
        final EditText nameEditText = (EditText) findViewById(R.id.username_edittext);
        final TextView yoTextView = (TextView) findViewById(R.id.yo_textview);

        yoButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                String inputString = nameEditText.getText().toString();
                yoTextView.setText("Yo " + inputString);
            }
        });
    }
}