Tutorial Android Studio

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

อบรมเขียน Coding Android Application สำหรับผู้เริ่มต้น

1 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

สารบัญ Table&of&Contents&

สารบัญ มาสเตอร Talk เริ่มตน จาก ศูนย คอยๆ ทําตามไป http://androidthai.in.th https://www.facebook.com/android.Training.by.EWTC

2 6 6 6 6 6

หรือโทรหา มาสเตอร อึ่ง เพื่อ ปรึกษาปญหา 081 – 859 – 5309 ไดตลอดเวลาครับ มาสเตอร อึ่ง ติดตั้ง JDK และกำหนด path Java 1. Download JDK มาติดตัง้ กอน 2. Download ตัวติดตั้งมาแลว ก็ ติดตั้ง ซะ 3. ตรวจสอบวามี JDK ในเครื่องหรือยัง ดวย cmd 4. กำหนด System Variables ใหกับ Java ติดตั้ง Android Studio 1. Getting Started with Android Studio 2. เมื่อโหลด ตัวติดตั้ง Android Studio มาไดแลว

6 6 6 6 7 7 8 9 10 13 13 14

HelloWorld Android Apps by Android Studio 1. เปด Android Studio ขึ้นมาครับ 2. New Project เรียน OnClickListener จาก Workshop ABC_Text User Interface ABC_Text

16 16 16 19 19 2

อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

ABC_Text WorkShop เปด Android Studio ออกมาเลยครับ New Project การจัดการดาน Icon คลาส MainActivity.java สวนควบคุม Layout activity_main.xml Create Emulator for Tester My emulator SDK Manager Design UI Text TextSize การเพิ่ม Widget ไปที่ Activity การวางตําแหนงของ Widget การเปลี่ยน Background กําหนดสีใหกับ TextView กำหนด TextView และ Button เปน สีขาว ใหหมด

19 19 20 21 23 24 24 26 27 28 28 28 30 35 35 37 38

ทดสอบโคด ดวย Emulator กำหนด id ใหกับ Widget ที่เปน Object การโคดดิ้งแอนดรอยด โคด เริ่มจากการ Declaration หรือ การประกาศตัวแปรคลาส กอน Initial Widget SetOnClickListener แบบ คลาส Implement คลาส Implement

38 40 41 41 42 43 43

การ get Event จากการคลิก ลองทดสอบโคด ABC_Text บน Emulator การทำแอพ หลายภาษา

44 45 46 3

อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

การปรับมุมมอง ระหวาง ภาษา อังกฤษ และ ไทย การกําหนด ภาษา ใหกับ emulator การทําแอพที่มีหลายๆ Activity เปด Android Studio เพื่อทํา WorkShop ManyActivity

48 48 49 51 51

ไดมาละ แอพ ManyActivity การสราง ListItem ดวย String Array Create Values Resource File ที่ชอื่ วา my_list.xml การโคดดิ้งแอนดรอยด แบบ ListView ใหทําการ Override Method Intent Class เขาใชกันอยางไร?

52 54 54 55 57 58

การใช Intent ใหไปเปดเว็บโซด เมื่อ เกิดการคลิก สรางการสืบทอด หรือ Herniate จาก คลาส Intent ลองทดสอบโคดแอนดรอยด ที่เขียนได บน Emulator การสราง Activity จาก Android Component การสราง Layout Resource File การกำหนด คลาส Activity กับ Layout สราง Intent ไปที่ EditTextActivity.java คลาส การ SetOnClickListener จากการกำหนด onClick ของ xml Declaration & Initial Widget ซะใหเรียบรอย Declaration Initial Widget กําหนดให Get Value จาก Edit Text การทำ Alert Dialog

58 58 59 59 60 61 61 62 63 63 63 63 64

ลองทดสอบโคด ที่แสดง AlertDialog

66 4

อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

Spinner Widget กําหนด เมธอด ตอนคลิกที่ onClick กำหนดการ Intent ไปที่ SpinnerActivity.java การ Set Up Spinner Declaration และ Initial Widget ใหกับ Spinner

66 67 67 68 68

ประกาศตัวแปร Array GetResource ใหกับ ตัวแปร Array พรอมสราง Adapter ลองทดสอบโคด Spinner SetOnItemSelectedListener ใหกับ Spinner Test Codding form Spinner เรียนรูการทํา SeekBar

69 69 69 70 71 71

ประกาศตัวแปร และ Initial Widget ของ SeekBar ทดสอบ SeekBar การสงคา SeekBar ที่เลือกไปที่ Alert Dialog ทดสอบโคด SeekBar ครับ การบาน android Thai

73 74 75 75 76

5 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

มาสเตอร Talk เริ่มตน จาก ศูนย

การอบรมการเขียน หรือ การพัฒนา ซอฟตแวร หรือ แอพพลิเคชั่น แอนดรอยด สําหรับผูเริ่มตน จากประสพการณ ของ มาสเตอร อึ่ง ในการที่จะพัฒนาแอนพลิเคชั่น แอนดรอยด ใหดีนั้น ตองศึกษาตลอดเวลา ไมมีใคร ที่ใชเวลา 1 เดือน, 1 สัปดาห หรือ 2 วัน จะเขียนโปรแกรม แอนดรอยด ไดอยาง ถองแท หลอกครับ ดังนั้น การยากที่สุด ของการเรียนรู และ พัฒนาการ โปรแกรมเมอร คือ การเริ่มตน

คอยๆ ทําตามไป

ทําไมไดอยาทอถอย ไปทําอยางอื่น แลวคอยกลับมา ศึกษาตอ แตถาไมได จริงๆ มาลง คอรสเบสิกแอนดรอยด กับ มาสเตอร อึ่ง เลยครับ โดยเขาไปหาขอมูลที่

http://androidthai.in.th https://www.facebook.com/android.Training.by.EWTC หรือโทรหา มาสเตอร อึ่ง เพื่อ ปรึกษาปญหา 081 – 859 – 5309 ไดตลอดเวลาครับ มาสเตอร อึ่ง

6 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

ติดตั้ง JDK และกำหนด path Java 1. Download JDK มาติดตั้งกอน

เราตองใช JDK ครับ โหลดไดจาก http://www.oracle.com/technetwork/java/javase/downloads/index.html

โหลดตัวที่เหมาะสมกับ ระบบปฎิบัติการของตนเองนะครับ อยาง มาสเตอร ใช Windows 64 Bit ก็ใหโหลด ตัว jdk— 7u25-windows-x64 แตถาเปน jdk-7u25Windows 32 Bit ก็ใหเลือกโหลด windows-i586 ครับ

7 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง 2. Download ตัวติดตั้งมาแลว ก็ ติดตั้ง ซะ

ดับเปลคลิกเพื่อติดตั้ง JDK

8 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง 3. ตรวจสอบวามี JDK ในเครื่องหรือยัง ดวย cmd ไปที่ Start > run > cmd

พิมพคําสั่ง java –version แบบนี้

ถาทุกอยางถูกตอง นาจะไดผลแบบนี้ ครับ

9 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง 4. กำหนด System Variables ใหกับ Java

หลายๆทานที่ ใจรอนรีบไปติดตั้ง android Studio เลยเนีย จะทําให error ได เราควรกําหนด System Variables ใหกับ จาวา กอน

ไปที่ Environment Variables และ สราง System variables ใหม โดยการคลิก New

10 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง กําหนด ชื่อ และ path แบบนี้

และอีกอันแบบนี้

ตําแหนงของ Variable Value บางที เครื่องคุณจะไมเหมือน ของ มาสเตอร ใหยืดเครื่องของคุณนะครับ โดยการไปดูที่ และ copy path ไวครับ

11 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง ลองตรวจสอบวา สิ่งที่เรากําหนดไดไหม ?

12 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

ติดตั้ง Android Studio 1. Getting Started with Android Studio

เริ่มตนจากการไป Download ตัวติดตั้ง Android Studio จาก เว็บ http://developer.android.com/sdk/installing/studio.html

13 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง 2. เมื่อโหลด ตัวติดตั้ง Android Studio มาไดแลว ก็ใหทําการติดตั้ง ซะ

14 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

ไดมาละ สัง Start Android Studio เลยครับ

15 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

HelloWorld Android Apps by Android Studio

มั่นใจวาเครื่อง ตอเน็ตนะ เพราะการ New Project Android ครั้งแรกบน Android Studio ตัวโปรแกรมจะมีการ โหลด บางสิ่งบางอยาง จาก Internet มา ฉะนั้น ตัว Firewall, Antivirus ตางๆ ปดซะกอนครับ

1. เปด Android Studio ขึ้นมาครับ

2. New Project

16 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

ชวง Download gradle จะมี Firewall Windows ฟอง ให Allow ไปนะครับ

17 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง ไดมาละ HelloWorld ของเรา

18 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

เรียน OnClickListener จาก Workshop ABC_Text

ในการเขียนโคด ให Get Event จากการคลิก ไมวาจะเปน ปุม, ภาพ หรือ Widget ใดๆ เรานิยม เขียนโคดแอนดรอยด แบบ OnClickListener ครับ เอาอยางนี้ เรามา เรียนรู การ Set OnClickListener จากการคลิก จาก Workshop ABC_Text กัน

User Interface ABC_Text

ABC_Text WorkShop 1. เปนแอฟ สองภาษา คือ อังกฤษ, และ ไทย 2. เรียนรูการ get Event จากการ คลิก Button a, b, c, d, และ e 3. เมื่อคลิก a, b, c, d หรือ e สงผมให TextView ที่โชว อยูที่ Activity เปลี่ยนไป

เปด Android Studio ออกมาเลยครับ

19 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง New Project

กรอกขอมูลตามนี้ไปเลยครับ • Application name : ABC_Text • Module name: ABC_Text • Package name ตองการความเปน unity เหมือนเดิม • Minimum required SDK มาเตอร ใหรันไดไมต่ํากวา Android 2.1 หรือที่เราเรียกวา Eclair • Compile ดวย แอนดรอยด 4.2 ครับ

20 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง การจัดการดาน Icon

เลือกไอคอนที่ตองการ

21 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง เราสามารถจัดการดานสี ของ ไอคอน ได

Activity

Android Studio จะ gen โคดใหแบบนี้

22 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง เปด Project ออกมา

คลาส MainActivity.java

23 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง สวนควบคุม Layout activity_main.xml

Create Emulator for Tester

กอนที่เราจะเขาไป โคดแอนดรอยด มาสเตอร จะใหคุณสราง emulator สําหรับ ทดสอบโคด ที่เขียนได กอน

24 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

25 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง My emulator

ในการโคดแอนดรอยด มาสเตอร จะเปด android Studio และ Emulator เอาไวเลย ครับ

26 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

SDK Manager

ไหนๆ เราเขามาใน AVD เพื่อทํา Emulator ทีนี่เรามาลอง ติดตั้ง Platforms เพื่อ หรือ ความสามารถพิเศษ กัน ไปที่ SDK Manager เลยครับ

การติดตั้งก็แค ไปเลือกสิ่งที่ตองการ จากตัวอยาง มาสเตอร ตองการ Intel x86 เพื่อให emulator เร็วขึ้น ครับ

27 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

Design UI

กลับมาที่ WorkShop ABC_Text ของเรา

Text

TextSize

28 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

จะไดผลแบบนี้ครับ และ มาสเตอร ลองลาก Widget เพื่อขยับ ยายตําแหนง

29 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

การเพิ่ม Widget ไปที่ Activity

จากตัวอยาง มาสเตอร ลาก TextView Widget ไป Drop ที่ Relative Layout

30 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง จะไดผลแบบนี้ ปรับขนาด โดยการเพิ่ม h2

ได TextView ใหมมาละ ปรับตําแหนง ไปอยูตรงกลาง

31 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

ตอไปมาสเตอร จะทํา Panal ของปุม โดยการสราง ใน Linear Layout

32 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง ตอไป มาสเตอร จะเพิ่มปุม ไปที่ Layout ที่เราไดสรางขึ้น 5 ปุม

33 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง กำหนด Text ใหกับ ปายปุม ทั้ง 5 เปน a, b, c, d, และ e โดยทําเปน Strings.xml

กำหนด Weight = 1 ใหกับทุกปุม ครับ

34 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง การวางตําแหนงของ Widget

การเปลี่ยน Background

35 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

ไปหาโคดสี 16 บิท มา สมมุติ มาสเตอร ตองการให Background ของแอพเปนสีเขียวแบบนี้

36 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง กําหนดสีใหกับ TextView

กําหนดโคดสีขาว ใน colors.xml

37 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง กำหนด TextView และ Button เปน สีขาว ใหหมด

ทดสอบโคด ดวย Emulator คลิกรันเลยครับ และ ไปดูที่ Emulator ที่เราสรางไว

38 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง Android Studio จะ Build

สําเร็จสําสําหรับ การออกแบบ และ Create User Interface ละ

39 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

กำหนด id ใหกับ Widget ที่เปน Object

ทําไดโดยการ Select Widget ที่เราตองการ มองหา id ที่ Properties

และพิมพ Id ที่เราตองการไปเลย

และเปลี่ยน id ทุกตัวไปเปนแบบนี้

40 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

การโคดดิ้งแอนดรอยด โคด เริ่มจากการ Declaration หรือ การประกาศตัวแปรคลาส กอน เปดคลาสออกมา ในที่นี่ก็คือ MainActivity.java ตําแหนง ที่จะประกาศตัวแปรคลาส คือ อยูใน คลาส แต อยูนอก เมธอด

41 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

Initial Widget

การผูก ตัวแปรคลาส ที่เราประกาศ กับ Widget ที่อยูบน Activity เราจะเรียน กระบวนการนี้วา Initial Widget สวนมาก มาสเตอรจะ สราง เมธอด ออกไปกําหนดนอก เมธอด onCreate เพราะไมชอบยัด คําสัง เขาไปใน เมธอดหลัก เทาไร ครับ มาสเตอร สราง เมธอด initialWidget(); ขึ้นมาทํา หนาที่ Initial Widget ครับ

42 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

SetOnClickListener แบบ คลาส Implement

การ SetOnClickListener ใหกับ Widget ตางๆ ของแอนดรอยด เทาที่มาสเตอร เห็น มี 3 แบบ • คลาส Implement • Call Back • Xml onClick

คลาส Implement

นําตัวแปร มา SetOnClickListener แบบนี้

เมื่อเรา กําหนด this ใน parameter ระบบจะขอ Implement OnClickLIstener กับ คลาสหลัก และ ขอ Create onClick แบบนี้

43 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

การ get Event จากการคลิก กําหนดโคดที่ เมธอด onClick

และ กำหนด SetOnClickListener ไปที่ ปุมทั้งหมด

44 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

ลองทดสอบโคด ABC_Text บน Emulator

45 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

การทำแอพ หลายภาษา คลิกที AddTranslation

เลือกที่ ธงชาติไทย

46 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

เพิ่มคาภาษาไทย ไปที่ Thai(th)

ตัว android Studio จะ Create strings.xml ที่ โฟวเตอร values-th แบบนี้ครับ

47 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

การปรับมุมมอง ระหวาง ภาษา อังกฤษ และ ไทย

การกําหนด ภาษา ใหกับ emulator

ในการเปลี่ยนแปลง ภาษา ที่จะแสดงบน Apps Android จะดูจาก มือถือ หรือ emulator กำหนด Language & Input เปน ภาษา อะไร ? ถาเปน ภาษา อังกฤษ Apps ก็จะเลือกใช strings.xml จาก values ในทางตรงกันขาม ถา มือถือ หรือ emulator กำหนด Language & Input เปน ภาษาไทย ตัว Apps ก็จะใช strings.xml จาก values-th นั้นเองครับ ฉะนั้น เรามาเรียนรู การกําหนด ภาษา ใหกับ emulator กัน คลิก เมนู และ เลือก System settings

48 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

49 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

ทีนี่ พอเราเปด ABC_Text ตัว Apps ของเราก็จะแสดงผลภาษาไทย แบบนี้ แลวครับ

50 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

การทําแอพที่มีหลายๆ Activity

จากหัวขอเลยครับ เดี๋ยวเราจะมาเรียนรู การทําแอพแอนดรอยด ที่มีหลายๆ Activity ครับ โดยเราจะทําแอพชื่อ ManyActivity โดยมี Activity แรกแสดงผลเปน ListView ในแตละคลิกที่ List จะพาไปที่ 1. Go To Website เมื่อทําการคลิก ใหไปเปด เว็บไซด 2. EditText Activity เรียนรู การใชงาน EditText Widget และ เขียนโคดการ Get Value 3. Spinner Activity เรียนรู การใชงาน Spinner Widget และ เขียนโคดการ Get Value 4. SeekBar Activity เรียนรู การใชงาน SeekBar Widget และ เขียนโคดการ Get Value 5. RadioButton Activity เรียนรู การใชงาน RadioButton Widget และ เขียนโคดการ Get Value

เปด Android Studio เพื่อทํา WorkShop ManyActivity New Project ขึ้นมาใหม เลยครับ

51 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

ไดมาละ แอพ ManyActivity

ที่ activity_main.xml ใหลบ Relative Layout ออกและ สราง Linear Layout แทน

สราง Android resource directory ที่ชื่อวา drawable เพื่อเก็บภาพ

52 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

นํารูปที่ตองการใชไปเก็บไวที่ drawable และ ออกแบบ User Ingerface ใหไดแบบนี้

หัวใจการทํา ListView ก็คือการที่เราตองรูวา ตําแหนงของ TextView Widget ตวไหนใหแสดงแบบ ListView โดยการกำหนด id ใหกับ Widget

53 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

การสราง ListItem ดวย String Array

ในการสราง และ จัดการ จํานวนหัวขอของ ListVew มาสเตอร ชอบ เทคนิก สราง item ไวใน String Array แบบนี้ครับ

Create Values Resource File ที่ชื่อวา my_list.xml

Code ภายใน my_list.xml

54 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

การโคดดิ้งแอนดรอยด แบบ ListView

เปด MainActivity.java หรือ คลาสของเราออกมาเลยครับ

ประกาศตัวแปร แบบ array ที่ชื่อวา strListView มีชนิดขอมูลแบบ String

ใหคลาส Extends ListActivity และ อยาลืม Comment ที่ SetContentView ดวยครับ

GetResource จาก String-Array ไปที่ตัวแปร ที่เราประกาศ 55 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

สราง ArrayAdapter สําหรับนํา คาที่อยูในตัวแปร ที่เราประกาศ ไปที่ตําแหนง ที่เราตองการใหปรากฏ บน ListView

ลองทดสอบโคด ที่ Emulator นาจะไดแบบนี้

การทำ OnListItemClick ให้กับ ListView 56 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

ในการกําหนด ให การคลิกที่ List ตางๆ เกิดการ Active เขาเรียกการทํา OnListItemClick

ใหทําการ Override Method ทำการมองหา OnListItemClick

จะไดเมธอด แบบนี้

มาสเตอร ใช Switch Case get คา position จากการคลิก แบบนี้

57 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

Intent Class เขาใชกันอยางไร?

Intent Class เปนคลาส ที่ แอนดรอยด เตรียมไวให Dev. ทําการสืบทอดไปใช ทําหนาที่ • เครื่อนยายการทํางาน ระหวาง Activity กับ Activity • หรือ Activity กับ Server ของแอพตัวอื่น (อยางตัวอยางจะใหไปเปดเว็บโซด ที่เปน บริการของ Browser ครับ)

การใช Intent ใหไปเปดเว็บโซด เมื่อ เกิดการคลิก

เนี่องดวยเรามีการกําหนด Switch Case ไว 5 เหตตุการณ มาสเตอร จะประการตัวแปรคลาส มีการเขาถึง Private คือ ให เมธอดทุกอันที่อยูในคลาส สามารถใช ตัวแปรนี้ไดแบบนี้

สรางการสืบทอด หรือ Herniate จาก คลาส Intent

ในการนํามาใชงาน มาสเตอร ไมสามารถนํามาใชตรงๆ ได ตอง สืบทอด เขามาเปน Object แบบนี้

58 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง ลองทดสอบโคดแอนดรอยด ที่เขียนได บน Emulator

ลองคลิกที่ my Website ที่เปน List ที่มีคา Position เทากับ 0 มือถือจะทําการ Intent ไปเปด WebView ตาม UrlData ที่ไดทําการ ระบุที่ไปไว

การสราง Activity จาก Android Component

ในการทําแอพใหสมบูรณ ตอง มีหลาย Activity แลว เราจะทําอยางไร ? ให สามารถสราง Activity ได มาสเตอร ชอบ การสรางจาก Android Component แบบนี้

59 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

การสราง Layout Resource File

การที่จะเปน Activity จะมีแคคลาสอยางเดียวไมได ตองมี xml ที่ควบคุม Layout ดวย อยางนั้นเรามาลองสรางกัน ออกแบบ UI ใหไดแบบนี้

กําหนด เมธอดที่จะทํา ถามีการ คลิกปุม

60 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

การกำหนด คลาส Activity กับ Layout

เราจะใชคําสั่ง SetContentView ในการ ผูกความสัมพันธ ระหวางคลาส ที่เราสราง และ Layout ที่เราออกแบบ ไปที่ คลาส EditTextActivity.java ที่เราสรางขึ้น เพิ่มคําสั่งนี้ไปที่เมธอด onCreate

สราง Intent ไปที่ EditTextActivity.java คลาส

กลับมาที่ MainActivity.java จำ Switch Case ในเงื่อนไขที่ position = 1 เขียน Intent ไป EditTextActivity.java แบบนี้ครับ

ลองทดสอบโคดที่ได ดวย Emulator โดย ลองคลิกที่ Edit Text ดูซิวา ไปทีอีก Activity หนึ่งไดหรือเปลา ?

61 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

การ SetOnClickListener จากการกำหนด onClick ของ xml

จำตอนเรากำหนด onClick ที่ไฟร xml ที่ควบคุม Layout ไดไหม ? เราจะสราง เมธอด myEditText แบบนี้

เมื่อมีการคลิกที่ ปุม Edit Text เมธอด myEditText จะเริ่มทํางาน

62 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

Declaration & Initial Widget ซะใหเรียบรอย Declaration

Initial Widget

กําหนดให Get Value จาก Edit Text

63 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

การทำ Alert Dialog

เดี๋ยวเราจะใหแสดง ผลของคา strTittle, strMessage บน Alert Dialog กัน สราง คลาส ShowMyDialog เปลาๆ เลยครับ

และตามดวยการสรางเมธอด MyDialog โดยมี parameter แบบนี้

Declaration และ สืบทอด Object ซะ

กำหนด Object objAlertDialog ในเมธอด 64 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

กลับมาที่ EditTextActivity.java ใหประกาศ Object เพื่อสืบทอดมาใชงาน

และสงคา strTittle, strMessage แบบนี้

65 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

ลองทดสอบโคด ที่แสดง AlertDialog

มาสเตอร ลองทดสอบโดยการ พิมพ Android Thai และ ลองคลิก Edit Text ถาทุกอยางถูกตอง นาจะไดผลแบบนี้

Spinner Widget

ในการอํานวยความสะดวกให user ในการกรอก ขอมูลใหเรา บางครั้ง เราจะไมใช Edit Text ทั้งหมด เราจะมีการให Drop Dow ให user เลือก เรามาทํางานกัน สราง Activity, Layout สําหรับ Spinner ไดเลยครับ (มาสเตอร จะไมเขารายละเอียด นะ เพราะสามารถดูได จากตอนทํา Edit Text)

66 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

กําหนด เมธอด ตอนคลิกที่ onClick

พรอมทั้ง SetContentView ในคลาสใหม ที่ Create ขึ่นมาดวย

กำหนดการ Intent ไปที่ SpinnerActivity.java จําไดที่ MainActivity.java จะมี ตอนเราทํา Switch Case Stament ไว ที่ตรง position = 2 ให Intent ไปที่ SpinnerActivity.java แบบนี้ และ ทดสอบโคดวา Intent ไป SpinnerActivity.java ไดไหม ?

67 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

การ Set Up Spinner

เริ่มตนจากการเราตองมี หัวขอที่เราจะให ปรากฏใน Spinner จำ my_list.xml ที่เราเก็บ String Array ของ List View ไดใชไหม ? เราจะเพิ่ม String Array เพิ่มสําหรับ หัวขอ List Spinner แบบนี้ โดย เพิ่มโคดทางดานขวาเขาไป

Declaration และ Initial Widget ใหกับ Spinner

68 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

ประกาศตัวแปร Array

GetResource ใหกับ ตัวแปร Array พรอมสราง Adapter

ลองทดสอบโคด Spinner

69 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

SetOnItemSelectedListener ใหกับ Spinner

การทําให สิ่งที่เราเลือกบน Spinner มีผล คือการทํา SetOnItemSelectedListener เริ่มจากการประกาศตัวแปรกอน

และเอา Spinner มา SetOnItemSelectedListener แบบนี้

ทําการสงคา ที่ user เลือกบน Spinner ไป แสดงบน Alert Dialog

70 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

Test Codding form Spinner

เรียนรูการทํา SeekBar Create Activity มาเลยครับ

ออกแบบ User Interface และ SetContentView ไปที่ คลาส แบบนี้ 71 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

กำหนด Intent ไปที่ SeekBarActivity.java ใน position = 3 ที่ MainActivity.java แบบนี้

ทดสองการทำงานของ Intent วาไปที่ SeekBarAtivity.java แบบนี้ไดใหม ?

72 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

ประกาศตัวแปร และ Initial Widget ของ SeekBar

73 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

ทดสอบ SeekBar

การสงคา SeekBar ไปแสดงบน Alert Dialog เหมือนเดิมประการตัวแปร และ สืบทอด

74 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

การสงคา SeekBar ที่เลือกไปที่ Alert Dialog

ทดสอบโคด SeekBar ครับ

75 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th

อบรมแอนดรอยด กับ มาสเตอร อึ่ง

การบาน android Thai

ลองทําดู เฉลยอยูใน เว็บของ มาสเตอร 1. สราง Activity ของ Radio Button ใหมีขอเลือกไดสัก สาม หรือ สี่ ก็ได 2. รูนะวา การมี คลาสอยางเดียว ทํา Activity ไมได ตองมี Layout ที่เปน ไฟร xml 3. ทำ Intent ขามการทํางาน ระหวาง Activity กับ Activity ที่ MainActivity.java ดวย 4. Get คาที่ User เลือก Radio Button 5. สงคาที่เลือกได ไปแสดงที่ Alert Dialog ขอใหโชคดีครับ มาสเตอร อึ่ง http://androidthai.in.th

76 อบรมเขียน Coding Android Application กับ มาสเตอร อึ่ง http://androidthai.in.th