【教學】實作你的第一個Hello World Android App

本篇教學主要重點有：
1. 該在哪撰寫Java代碼
2. 該在哪佈置App框架
3. 如何進行編譯動作
4. 內文有提供代碼進行複製
5. 應該沒有五了...

一開始我先跟大家說明當你進入Android Studio的撰寫頁面時，該在哪撰寫Java、在哪建構框架、如何編譯，以及哪兒Log紀錄。如果開發環境還沒建置好的朋友們，可以瀏覽連結的文章。

▼當我們進入Android Studio時，應該會看到這個畫面
依照系統不同，風格不同，看起來應該會有些許誤差
（黑色系列真的好帥！）

▼頁面左邊紅色框框圈選的地方為選擇Java檔的區塊

詳細位置為app資料夾底下的java資料夾底下的你的package底下的Java檔

注意是第一個package，下面兩個旁邊有括號的先不用理它

你點選你要選擇的檔案後，就可以在右邊看到的大區塊中撰寫Java

▼下圖頁面左邊紅色框框圈選的地方是負責App框架建置的地方

一般要建置固定App框架的話，我們會在res底下的layout裡建置相關檔案

同樣點擊要建置的檔案，就可以在右邊大區塊中撰寫

當然要建置App內容不一定要用這個，方法百百種，這只是其中一種

▼要編譯的話，點擊下圖綠色三角形按鈕就行囉！

▼初次編譯時，會跳出對話框問你要選擇哪個裝置進行瀏覽

上方<none>區塊，如果有用實體機的話，會顯示時體積的型號

下方則是自己新增的模擬器，這裡可以依照你的喜好進行選擇

選擇完之後，點擊「OK」

▼我點選模擬器進行測試，以下是這支App執行完之後的畫面

▼下方紅色框框則是會顯示這支App運作的狀況如何

基本上，不要出現一大串紅字就沒什麼事

記住是要點擊「logcat」進行觀察喔！

它可是幫忙你debug的最佳好夥伴！

以上就是大致的介紹，接下來要來說明代碼了。
首先是Layout的部分，也就是我們App框架的部分。關於框架的內容物，我大致分成兩種，一種是Layout，負責整體App的框架；一種是物件，也就是我們眼睛所能看到，能互動的東西。每個Layout跟物件都有不同的特性，這就得請各位上網多多查看及實作。

下述範例為例，外框架為RelativeLayout。它制定了這支App排版的方式，而內容物TextView則是負責顯示所呈現的內容。

File Name: activity_main.xml


<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.app.ray.myfirsthelloworld.MainActivity">

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

接著是關於Java代碼的部分。onCreate Function基本上是負責App該頁面初始化的動作，關於Android App的生命週期，可以看連結的這篇文章。如果要將我們剛才弄好的layout套進這個App頁面的話，需要套用到setContentView()這個Function。

setTitle() Function是負責設定該App頁面最上方的標題。而我們在這支App頁面裡面，還記得我們有一個TextView物件嗎？我們必須將它宣告出來，才能對該物件進行控制的動作。這裡Ray小編寫的功能是當點擊這個TextView物件時，上方的字幕就會轉變為「Hi, there is Mr. Ray's Box」。

File Name: MainActivity


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

public class MainActivity extends AppCompatActivity {

    private TextView txtHello;

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

        setTitle("Hey!");

        txtHello = (TextView) this.findViewById(R.id.txt_hello_world);
        txtHello.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                txtHello.setText("Hi, there is Mr. Ray's Box");
            }
        });

    }
}

以上就是本篇的內容，Android App開發是不是很有趣呢？歡迎大家一起加入Android App開發的領域喔！

【教學】實作你的第一個Hello World Android App

1 則留言: