การสร้างแอพพลิเคชั่นบนแอนดรอยด์

1. หน่วยที่ 1 การติดตั้งโปรแกรม
1. ทาการคัดลองโฟลเดอร์งานจากแผ่นซีดี แล้วนามาไว้ที่ไดร์ D:
ของเครื่องคอมพิวเตอร์เราก่อน จากนั้นเปิดโฟลเดอร์
android32Bit (ส่วนใครใช้ 64Bit ก็เลือกโฟลเดอร์ android64Bit
นะครับ)
2. จะมีไฟล์ต่างๆ ที่เตรียมไว้แล้ว ดังภาพ
3. ทาการติดตั้งโปรแกรมจาวา โดยดับเบิ้ลคลิกที่ไฟล์ jdk-7u13-
windows-x32.exe
(ส่วนใครที่มีจาวาในเครื่องแล้วก็ข้ามขั้นตอนนี้ก็ได้นะครับ)

2. 4. เริ่มติดตั้งโปรแกรมจาวา

4. หน่วยที่ 2
ขั้นตอนการติดตั้งอีมูเลเตอร์โดยใช้โปรแกรม
VirtualBox

5. 1. ดับเบิ้ลคลิกที่ไฟล์ VirtualBox-4.3.8-92456-Win.exe
2. จะปรากฏหน้าต่าง ดังภาพ แล้วกดปุ่ม Next

10. เมื่อติดตั้งเสร็จแล้ว กดปุ่ม Finish
เพื่อเปิดโปรแกรมจาลองแท็บเล็ตขึ้นมา ดังภาพ

11. หน่วยที่ 3 ขั้นตอนการ Import ไฟล์แท็บเล็ตจาลอง
1. คลิกที่เมนู File เลือก Import Appliance

12. 2. คลิกปุ่ม Browse เพื่อเปิดไฟล์ ดังภาพ

13. 3. เลือกไฟล์ androVM_vbox86t_4.1.1_r6.1-20130222-
gapps-houdini-flash.ova
4. จากนั้นคลิกปุ่ม Next

14. 5. คลิกปุ่ม Import
6. รอจนกว่าจะนาไฟล์เข้าเสร็จเรียบร้อย

15. หน่วยที่ 4
ขั้นตอนการเปิดใช้งานแท็บเล็ตจาลองครั้งแรก
1. คลิกที่ปุ่ม Start ดังภาพ
2. รอสักครู่ ให้โปรแกรมเริ่มทางาน

17. 3. เครื่องพร้อมใช้งานแล้ว ให้กดปุ่ม Start

18. 4. หากเราไม่ต้องการตั้งค่าใดๆ ก็คลิก No

22. 5. เครื่องแท็บเล็ตจาลองพร้อมใช้งานแล้ว กดปุ่ม OK

23. หน่วยที่ 5
ขั้นตอนการตรวจสอบหาค่าไอพีของแท็บเล็ตจาลอง
1. คลิกที่ปุ่ม แอพพลิเคชั่น ดังรูป
2. คลิกที่ปุ่ม androVM Configuration

24. 3. จะปรากฏเลขไอพี ตามภาพนี้ ถือว่าเรียบร้อยพร้อมใช้งาน
(หมายเหตุ การย้อนกลับแต่ละหน้าในแท็บเล็ตจาลอง ให้กดปุ่ม
ESC ในแป้นพิมพ์)

25. 4. แต่ถ้าหากหากปรากฏตามตัวอย่างภาพนี้
แสดงว่ายังใช้งานไม่ได้ เพราะยังไม่มีเลขไอพี
ต้องทาการแก้ไขก่อน (ดูวิธีการทาในหน่วยถัดไป)
หน่วยที่ 6 ขั้นตอนการกาหนด Network
เพื่อให้แท็บเล็ตจาลองมีเลขไอพี
1. ไปที่ปุ่ม Settings --Network --Adaptor1
2. ตรง Attach to: ให้คลิกเลือก Host-only Adaptor

26. 3. กดปุ่ม OK
4. จากนั้นทาการเปิดแท็บเล็ตจาลอง
แล้วเข้าตรวจสอบไอพีอีกครั้ง ก็จะพบตามภาพ
แสดงว่าเรียบร้อยแล้ว

27. ทาความเข้าโครงสร้างการทางานแต่ละส่วนของโปรแกรม
หน่วยที่ 7 เริ่มต้นสร้างแอพฯของเรา
โดยการเริ่มสร้างโปรเจกต์ก่อน
1. เปิดโปรแกรม eclipse
2. ไปที่เมนู File --- New --- Android Application Project
JAVA ADT
(Eclipse)
Project
(App Android)
Emulator
(VM)
Command DOS

28. 3. กาหนดชื่อโปรเจคต์และค่าAPI

29. 4. หน้าต่างการสร้างแอพใหม่ กดปุ่ม Next
5. กาหนดไอคอน กดปุ่ม Next

30. 6. สร้าง Activity เปล่าๆ กดปุ่ม Next

31. 7. ตั้งชื่อ activity กดปุ่ม Finish

32. หน่วยที่ 8
ขั้นตอนการปรับหน้าจอเพื่อออกแบบใช้กับแท็บเล็ตขนา
ด 7”

33. ผลลัพธ์

34. หน่วยที่ 9 ขั้นตอนการแทรกรูปภาพ
1. ในหน้า Layout ให้ทาการลบข้อความออก โดยการคลิก
แล้วกดปุ่ม Delete ทิ้งก่อน
2. ลากรูปภาพจากเครื่องคอมเรา แล้วเอามาวางในโฟลเดอร์
drawable-mdpi เสียก่อน
3. กดปุ่ม OK เพื่อทาการคัดลอกไฟล์

35. 4. จากนั้นลาก ImageView จากโฟลเดอร์ Images&Media
มาวางในหน้าเลย์เอาท์
5. คลิกเลือกรูปภาพที่เราต้องการนามาแสดง แล้วกดปุ่ม OK

36. 6. จะมีภาพปรากฏในหน้า Layout ดังภาพ

37. 7. ทาการบันทึกไฟล์

38. หน่วยที่ 10
การรันงานดูตัวอย่างในหน้าแท็บเล็ตจาลอง
1. ให้คลิกเมาส์ขวาที่โฟลเดอร์โปรเจกต์ของเรา เลือก Run AS
และคลิก Android Application
ดังภาพ
2. คลิกเลือกที่ชื่อแท็บเล็ตจาลอง ดังภาพ แล้วกดปุ่ม OK

39. 3. จากนั้นกลับไปคลิกแท็ปเล็ตจาลอง รอสักครู
จะปรากฏตัวอย่างผลงานดังภาพ

40. ขั้นตอนการรันแอพพลิเคชั่นเพื่อดูตัวอย่างการแสดงผลแท็บ
เล็ตแบบรวดเร็ว
1. คลิกไปที่แท็บไฟล์จาวา 2. กดปุ่ม run 3. เลือก เครื่องอีมูเลเตอร์
4. กดปุ่ม OK
หน่วยที่ 11 ขั้นตอนการทาให้แสดงผลบน Tablet
แบบเต็มหน้าจอ
1. เลือก App Theme ดังภาพ

41. 2. จากนั้นมากาหนดที่ไฟล์ AndroidManifest.xml ดังภาพ
3. Sdsds

42. หน่วยที่ 12 ขั้นตอนการ Batch File เพื่อเชื่อมต่อ
Emulator
เพื่อให้การเชื่อมโปรแกรม Eclipse
กับไฟล์อีมูเลเตอร์ในการแสดงผลบน Tablet
จาลองได้ง่ายและสะดวก ให้ทาดังนี้
สรุปลาดับขั้นตอนการเปิดแต่ละโปรแกรมเพื่อทางาน
ให้ทาตามขั้นตอนดังนี้
1.เปิดโปรแกรมEcli
pse
2. เปิดโปรแกรม
อีมูเลเตอร์( VM)
3.เชื่อมต่อโดยใช้
connect.bat

43. หน่วยที่ 12 สรุปโค๊ดที่ใช้ในการทางาน
1.โค๊ดเล่นไฟล์วิดีโอ
final VideoView myVideo =
(VideoView)findViewById(R.id.videoView1);
myVideo.setVideoURI(Uri.parse("android.resource:/
/" + getPackageName()
+"/"+R.raw.ชื่อไฟล์วิดีโอของเรา));
myVideo.setMediaController(new
MediaController(this));
MediaController mc = new MediaController
(this);

44. myVideo.setMediaController(mc);
myVideo.start();
myVideo.requestFocus();
2.โค๊ดเล่นไฟล์แฟลช
WebView flashLoader;
@Override
protected void onCreate(Bundle
savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_flash);
flashLoader = (WebView)
findViewById(R.id.webView1);
flashLoader.loadUrl("file:///android_res/raw/start.swf
");
flashLoader.getSettings().setAllowContentAccess(tr
ue);

45. flashLoader.getSettings().setJavaScriptEnabled(tru
e);
flashLoader.getSettings().setPluginState(PluginStat
e.ON);
}
@Override
protected void onPause() {
super.onPause();
flashLoader.destroy();
}
3.โค๊ดหน่วงเวลา
new Thread() {
public void run() {
try {
sleep(3000);
} catch (InterruptedException e) {
e.printStackTrace();

46. } finally {
startActivity(new
Intent(SplashScreen.this,MainActivity.class));
SplashScreen.this.fileList();
}
};
}.start();
}
4.โค๊ดปุ่มลิงค์
final Button btn1 = (Button)
findViewById(R.id.Button1);
btn1.setOnClickListener(new
View.OnClickListener() {
@Override
public void onClick(View v) {
startActivity(new
Intent(MainActivity.this,Page2.class));
}
});

47. 5.โค๊ดเล่นเสียง
//1. ให้สร้างไฟล์ Music.java แล้วใส่โค๊ดดังนี้
public class Music {
private static MediaPlayer mPlayer = null;
public static void play(Context context,int resID){
stop(context);
mPlayer = MediaPlayer.create(context, resID);
mPlayer.setLooping(true);//เล่นวนลูป
mPlayer.start();
}
public static void stop(Context context){
if(mPlayer != null){
mPlayer.stop();
mPlayer.release();

48. mPlayer=null;
}
}
}
//2. ใส่โค๊ดสาหรับหน้า Activity ใดๆก็ตาม
ที่เราต้องการเล่นเสียง
@Override
protected void onPause() {
super.onPause();
Music.stop(this);
}
@Override
protected void onResume() {
super.onResume();
Music.play(this,
R.raw.ชื่อเพลงที่เรานาเข้ามาเล่น);
}