สร้างโปรเจค Android Create New Project บนโปรแกรม Eclipse (Android Project)

Android Create New Project บนโปรแกรม Eclipse หลังจากทีได้ติดตั้งโปรแกรม สำหรับการพัฒนา Android บนโปรแกรม Eclipse เรียบร้อยแล้ว หัวข้อนี้เราจะทดสอบการสร้าง หรือ Create New Android Project บนโปรแกรม Eclipse แบบง่าย ๆ ทำความเข้าใจกับโครงสร้างพื้นว่าประกอบด้วยไฟล์ และขั้นตอนใดบ้าง

รู้จักกับ Android คืออะไร ? จะเขียนโปรแกรมบนแอนดรอยด์จะต้องติดตั้ง Software อะไรบ้าง ?

http://www.thaicreate.com/mobile/basic-android.html

เปิดโปรแกรม Eclipse



เลือกเมนู File -> New -> Android Application Proejct



กำหนด Application Name , Project name , Package Name และก็ Build SDK : ให้เลือก Version ของ Android แนะนำให้เลือก ที่ได้ทำการติดตั้ง Emulator ไว้ (ติดตั้ง Android AVD Emulator)



ขั้นตอนนี้จะเป็นการสร้าง Icons ของ App สามารถปรับแต่งได้ตามความต้องการ หรือจะกำหนดเป็นค่า Default ไปก่อนก็ได้ โดยให้คลิก Next เพื่อไปยังขั้นตอนถัดไปได้เลย



เลือก Create BlankActivity และ Next เพื่อไยังขั้นตอนถัดไป (Activity คืออะไร จะได้อธิบายในขั้นตอนถัดไป)



กำหนดชื่อ Activity ถ้าไม่ต้องการแก้ไข สามารกำหนดเป็นค่า Default และเลือก Finish



กรณีที่แจ้งดังภาพให้ทำการ Install และ Upgrade ให้เรียบร้อยก่อน



เลือก Accept และ Install



กำลัง Install



เลือก Finish


หน้าจอหลักของ Project
ในการพัฒนาโปรแกรม Android ด้วยโปรแกรม Eclipse นั้น สามารถพัฒนาผ่าน UI ที่เป็น GUI ได้เช่นเดียวกัน ซึ่งจะช่วยให้การเขียนโปรแกรมนั้นง่ายและสะดวกยิ่งขึ้น และในการสร้างโปรเจคแต่ล่ะครั้งตัวโปรแกรม Eclipse จะทำการ include library ที่เป็นค่า Default และจำเป็นต่อการพัฒนาโปรแกรมนั้นหลายตัว แต่ที่ใช้และเราจะต้องสนใจในขั้นตอนนี้ให้ดูแค่ 2 ตัวคือ

- MainActivity.java
- activity_main.xml

โดยชื่อไฟล์อาจจะขึ้นอยู่กับขั้นตอนการสร้าง Project (ดูได้จากขั้นตอนก่อนหน้านี้)

คำอธิบาย activity_main.xml กับ MainActivity.java

- activity_main.xml จัดเก็บไว้ที่ /res/layout/ คือจะเก็บ resource ที่เป็น User Interface ที่ได้จากการออกแบบหน้าจอต่าง ๆ โดยเมื่อเราทำการลาก Widgets หรือ Element ต่าง ๆ เข้าไปใน Interface ก็จะมีการสร้าง Tag ต่าง ที่เป็น Widgets หรือ Element ที่อยู่ในรูปแบบ XML ลงในไฟล์นี้ เช่น

activity_main.xml

01.<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

02.xmlns:tools="http://schemas.android.com/tools"

03.android:layout_width="match_parent"

04.android:layout_height="match_parent" >

05. 

06.<TextView

07.android:id="@+id/textView1"

08.android:layout_width="wrap_content"

09.android:layout_height="wrap_content"

10.android:layout_centerHorizontal="true"

11.android:layout_centerVertical="true"

12.android:padding="@dimen/padding_medium"

13.android:text="@string/hello_world"

14.tools:context=".MainActivity" />

15. 

16.</RelativeLayout>

โดยในการสร้าง Project แต่ล่ะครั้งจะต้องมีไฟล์ทีเป็น Activity อย่างน้อย 1 ตัว และใน Project หนึ่ง ๆ สามารถมีได้หลาย Activity ขึ้นอยู่กับว่าโปรแกรมจะแยกหน้าจอการทำงานเป็นแบบใดบ้าง

- MainActivity.java จัดเก็บไว้ที่ /src/com/helloworld/ มีหน้าที่ควบคุมการทำงานของไฟล์ที่เป็น activity_main.xml ซึ่งถ้าจะเข้าใจง่าย ๆ คือ จัดเก็บ Event การทำงาน ต่าง ๆ ของ Widgets หรือ Element ที่อยู่ใน activity_main.xml

MainActivity.java

01.package com.helloworld;

02. 

03.import android.os.Bundle;

04.import android.app.Activity;

05.import android.view.Menu;

06. 

07.public class MainActivity extends Activity {

08. 

09.@Override

10.public void onCreate(Bundle savedInstanceState) {

11.super.onCreate(savedInstanceState);

12.setContentView(R.layout.activity_main);

13.}

14. 

15.@Override

16.public boolean onCreateOptionsMenu(Menu menu) {

17.getMenuInflater().inflate(R.menu.activity_main, menu);

18.return true;

19.}

20. 

21. 

22.}

คำอธิบายเบื้องต้น

1.@Override

2.public void onCreate(Bundle savedInstanceState) {

3.super.onCreate(savedInstanceState);

4.setContentView(R.layout.activity_main);

5.}

Event onCreate คือมีการโหลดข้อมูลแรกสุดจะเห็นว่ามีการโหลด layout ของ activity_main ซึ่งก็เป็น activity_main.xml นั้นเอง



คำอธิบายหน้าจอ
1. Package ที่เป็น Activity ของไฟล์ java
2. Package ที่เป็น Activity ของไฟล์ xml
3. Palette เป็น Toolbox หรือ Widgets/Element ต่าง ๆ จะนำไปใช้ใน Android Activity Form
4. เป็น Android XML Layout Activity หน้าจอของโปรแกรมที่ต้องการ Design ตัวนี้เป็น activity_main.xml คือสามารถเขียนได้จากมุมมองของ XML หรือ Graphic Layout ก็ได้
5. Outline คือ รายการ ของ Widgets หรือ Element ที่อยู่ใน Android Activity Form



การเปิดปิดไฟล์ สามารถคลิกได้ที่เครื่องหมาย กากบาต X



กรณีที่ไฟล์ต่าง ๆ ถูกปิดไปหมดก็สามารถเรียกขึ้นมาใหม่ได้เช่นเดียวกัน



การเปิดไฟล์ที่เป็น .java



การเปิดไฟล์ที่เป็น activity ของ xml



สามารถสลับการทำงานระหว่างที่เป็น Graphical Layout หรือ XML ได้ ดังรูป


ทดสอยการเรียกใช้ Toolbox และการสร้าง Element



ทดสอบการลาก Element ลงใน Android Activity XML Layout ในตัวอย่างจะลาก Plan Text ลงใน Form

สังเกตุว่าเมื่อมีการลาก Element ที่มีชื่อว่า Plan Text ลงใน Android Activity Form ในส่วนของ Outline จะมีการสร้างรายการ Element แสดงไว้ด้วย



กรณีที่มีการสร้าง Element ลงใน Activity Form ต่าง ๆ ถ้ามี Warning หรือ Error จะต้องทำการแก้ไขให้เรียบร้อย ในตัวอย่างจะมี Warning ชื่อว่า

This text field does not specify and inputType or a hine

มุมมองของ XML



กรณีที่ Element มี Error หรือ Warning ในส่วนของ XML ก็จะมีการแจ้งข้อผิดพลาดด้วย




สำหรับการแก้ไขขึ้นอยู่กับ Error หรือ Warning Message ว่าอะไร ซึ่งในตัวอย่างน่าจะหมายถึง Plan Text ไม่มีการกำหนด inputType

ให้คลิกขวาที่ Element เลือก Show In -> Properties ดังรูป




หรือสามารถเลือกจาก Properties ที่อยู่ข้างล่าง



กำหนด Input Type ให้เป็น text



ลองใส่ข้อความให้กับ Plan Text ในที่นี้จะลองใส่คำว่า "Welcome to My App"



จากนั้นให้ไปที่เมนู Proejct เลือก Clean



ยืนยันการ Clear ข้อผิดพลาดต่าง ๆ ที่ได้เกิดขึ้นหลังจากมีการแก้ไขข้อผิดพลาดแล้ว



กลับมายังหน้าจอก็ไม่มี Warning หรือ Error แล้ว (กรณีที่ยังไม่หาย ลองปิดหน้าจอ Activity ของ XML และเปิดขึ้นมาใหม่)

สำหรับพื้นฐานกับหน้าจอของ Android กับโปรแกรม Eclipse พื้นฐานทั่วไปก็มีอยู่เท่านี้ สำหรับหัวข้อถัดไปจะเป็นการ รันโปรแกรม Android ผ่าน Emulator

วิธีรัน Project Android ผ่าน AVD หรือ Emulator (Android - Eclipse - Emulator)

http://www.thaicreate.com/mobile/android-run-project-avd-emulator.html

---

เพิ่มเติม 1
จากหน้าจอจะมี Warning ที่เป็น Package Explorer ว่า

Code

The import android.support.v4.app.NavUtils is never used
The import android.view.MenuItem is never used

ให้แก้ไขตามนี้



The import android.support.v4.app.NavUtils is never used

http://www.thaicreate.com/mobile/the-import-android.support.v4.app.navutils-is-never-used.html

---

เพิ่มเติม 2
จากหน้าจอจะมี Warning ใน Element ว่า

Code

[I18N] Hardcoded string Welcome to My App, should use @string resource

ให้แก้ไขตามนี้



Hardcoded string 'xxx', should use @string resource - Android Eclipse

http://www.thaicreate.com/mobile/hardcoded-string-xxx-should-use-string-resource.html