- Android Dev – Starting (3/3)

Android Application Development – Ground Zero (3/3)

[เสียงเพลง background]

….ก็ใจมันยินยอม มันยังอยากจะรักเธอ ไม่ห็นต้องพูดอะไรให้มันมากมาย….
….ไม่ต้องมีคำบรรยายใดๆสักคำให้ลึกซึ้ง ไม่ต้องบรรยายอะไรให้สวยเลิศเลอ….
….ไม่ว่าอะไรมันคือเหตุผลที่ฉันนั้นรักเธอ ให้รู้ว่ารักเธอเท่านั้นพอ…

[ปุจฉา - วิสัจชนา]

• รูปด้านซ้ายเป็นรูปตามโจทย์ใน SDK ที่เราสามารถ ก๊อปโค๊ตมารันได้จนสำเร็จ
• รูปขวาเป็น”ปุจฉา”ที่อยากให้ลองทำดูคับ

(HelloView1 – LinearLayout)

[รูป 1.0 – HelloView1_LinearLayout กับปุจฉาที่ให้ลองทำ]

(HelloView2 – RelativeLayout)

[รูป 2.0 – HelloView2_RelativeLayout กับปุจฉาที่ให้ทำ]

(HelloView9 – FormStuff)

[รูป 3.0 – HelloView6_FormStuff กับปุจฉาที่ให้ลองทำ]

(HelloView12 – TabWidget)

[รูป 4.0 – HelloView12_TabWidget กับปุจฉาที่ให้ลองทำ]

[วิสัจชนา]
คำเฉลยคับ (จิงๆสามารถทำได้อีกหลายวิธี)

(HelloView1 – LinearLayout)

[รูป 5.0 – HelloView1_LinearLayout กับวิสัจชนา]

(HelloView2 – RelativeLayout)

[รูป 6.0 – HelloView2_RelativeLayout กับวิสัจชนา]

(HelloView9 – FormStuff)

[รูป 7.0 – HelloView6_FormStuff กับวิสัจชนาส่วน Layout]

[รูป 8.0 – HelloView6_FormStuff กับวิสัจชนาส่วน Coding]

(HelloView12 – TabWidget)

[รูป 9.0 – HelloView12_TabWidget กับวิสัจชนาส่วน Layout]

[รูป 10.0 – HelloView12_TabWidget กับวิสัจชนาส่วน Coding]

[โดยสรุป]

สรุป

สรุปหัวใจสำคัญของอุปกรณ์มือถือที่ต่างจากเครื่อง Desktop/Notebook คือ ขนาดหน้าจอที่เล็ก ขนาดหน้าจอที่มีขนาดไม่เท่ากันในแต่ละรุ่น การใช่งานในแนวตั้ง/นอน

(คือ คงไม่บ่อยที่เราตะแคง Notebook ของเราเพื่อใช่งาน/ดูภาพ)

จะเห็นได้ว่า Android ออกแบบให้เราสามารถแยก Layout (กรอบ/หน้าตา) ออกมาจาก Program Logic ได้

โดยจากตัวอย่างที่เราสามารถแก้ Layout โดยมิต้องแก้ Code ก้อสามารถเปลี่ยน**หน้าตา**ของแอพเราไปตามวัตถุประสงค์ต่างๆได้

ในขณะเดียวกัน (ถ้าต้องการ)เราก้อสามารถใช่ Code ในการรองรับการเปลี่ยนแปลงโดยไม่พึ่ง Layout ก้อได้เช่นกัน

การทำ Layout นั้น ทำให้เราสามารถออกแบบแอพเราให้รองรับการใช่งานในสถานะการณ์ต่างๆ เช่น ขณะนั้นกำลังใช่งานแนวตั้ง/แนวนอนอยู่

การทำ Layout นั้น จะทำให้แอพของเรารองรับความหลากหลายของคุณสมบัติของอุปกรณ์ เช่น ขนาด/ความละเอียดของรุ่นต่างๆของมือถือ (รู้สึกว่าจะตั้งแต่ 1.6 ขึ้นไป)

เราสามารถใช่ Widget ที่มีมาให้ มาต่อยอด ทำให้สามารถเขียน Code ไม่กี่บรรทัดก้อทำลูกเล่นต่างๆได้

เราสามารถใช่ Object ของกูเกิ้ล(และของบริษัทอื่นๆ – ถ้ามี) เพื่อ connect ไปใช่ services ต่างๆที่มีให้ (แต่แน่นอน ถ้าเป็น Location Service อ่ะ มีเสียตังแน่ๆ)

คร่าวนี้ไม่ได้บรรยาย(ในส่วนวิธีการ)ใดๆให้ลึกซึ้งนะคับ

สวัสดี

Jan 25, 2010

Artist : Mr.Team
Title : ไม่ต้องมีคำบรรยาย
Album : Money Money

จะแต่งจะเติมถ้อยคำ สักกี่หมื่นคำ ให้เอาความดีๆ มารวมกัน
คงจะต้องคุย ยกเรื่องราวสักร้อยพัน เพื่อบอกว่าตัวเธอเป็นเช่นไร

ต้องบอกต้องอธิบาย สักกี่หมื่นวัน เพื่อรวมความเป็นจริงที่เป็นเธอ
ใจที่งดงาม และความดีของเธอ ก็เกินที่ใครๆ จะเข้าใจ

* จะเป็น(จะตาย)ยังไงก็ไม่สำคัญ แค่ขอให้ฉันนั้นได้รักเธอ
ก็ใจมันยินยอม มันยังอยากจะรักเธอ ไม่ห็นต้องพูดอะไรให้มันมากมาย

** ไม่ต้องมีคำบรรยายใดๆสักคำให้ลึกซึ้ง
ไม่ต้องบรรยายอะไรให้สวยเลิศเลอ
ไม่ว่าอะไรมันคือเหตุผลที่ฉันนั้นรักเธอ
ให้รู้ว่ารักเธอเท่านั้นพอ

จะเปลี่ยนเอาใครทดแทน สักกี่หมื่นคน ให้แทนเธอคนเดียวไม่มีทาง
จะดีสักเท่าไร ฉันไม่เอาสักอย่าง ก็มีเธอคนเดียว ทั้งหัวใจ

(ซ้ำ * , ** , **)

ไม่ว่าอะไรมันคือเหตุผลที่ฉันนั้นรักเธอ
ให้รู้ว่ารักเธอเท่านั้นพอ

- Android Dev – Starting (2/3)

Android Application Development – Ground Zero (2/3)

 

[จากตอนที่แล้ว]

เป็นไงคับ  ทำกันแล้วเป็นไงบ้าง  คิดว่าไม่น่าจะมีประเด็นอะไรนะคับ  ติดขัดอะไรก็โพสมากันคับ  เผื่อช่วยอะไรได้

 

[มาต่อกันดีก่า]

รอบนี้จะมาว่าด้วยเรื่องการ generate ตัว key เพื่อให้แอพ (MapView) สามารถเรียกใช้บริการ Location Service ของ Google สาเหตุที่จะมาลงรายละเอียดกันก้อเพราะตัวผมเองงมอยู่สองวันเนื่องจากความใหม่ในเรื่องพวกนี้ (พวก JAVA/Eclipse)  ท่านที่อยู่ตัวอยู่แล้วก้อสามารถข้ามไปหัวข้อต่อไปเลยคับ

 

[ว่าด้วยเรื่องการสร้าง Key เพื่อไปขอใช้บริการ Location Service]

อ้างอิง http://code.google.com/intl/th-TH/android/add-ons/google-apis/mapkey.html)

เล่าคร่าวๆนะคับ

1. เขาคาดหวังว่า แอพเราจะมี Certificate (ใบรับรองบนโลกคอมพิวเตอร์) ผูกไว้
2. เราเอาต้องเอา “ลายนิ้วมือ” (Fingerprint) ที่ถอด(รหัส)จากใบรับรองเพื่อไปลงทะเบียนกับกูเกิ้ล
3. ทางกูเกิ้ลจะสร้าง “กุญแจ” มาให้ (Key ที่ผูกกับ “ลายนิ้วมือ”ที่ลงทะเบียนไว้)
4. เอากุญแจ(ที่เราได้มา)ใส่ลงใน Code ของเรา  แอพเราจะทำการส่งกุญแจก่อนเรียกใช้งาน Location Service และสามารถโหลดภาพแผนที่กลับเข้ามาแสดงผลถ้ากุญแจถูกต้อง
5. *หมายเหตุ* ถ้ากุญแจไม่ได้ลงทะเบียนไว้  หรือกุญแจไม่ตรงกับลายนิ้วมือบนแอพของเรา  แอพเราจะไม่ได้รับข้อมูลกลับมา 
6. *หมายเหตุ* คำว่า “ไม่ตรง” เกิดจากการคำนวนทางคณิตศาสตร์ชั้นสูง  เหมือนเอาตัวเลขสองตัวหยอดเข้าไปในสมการ  ถ้าผลลัพธ์ก้อจะเป็นแค่ “ตรง” หรือ “ไม่ตรง” อะไรประมาณเนี้ยแล่ะ 
7. *หมายเหตุ* ทุกๆเครื่อง(ที่ลง SDK)จะมีใบรับรองแบบ debug mode อยู่  ใบนั้นละคับคือใบที่เราจะเอาไปสร้างลายนิ้วมือเพื่อใช่ในการทำงานครั้งนี้
8. *หมายเหตุ* ทั้งใบรับรอง  ลายนิ้วมือ  กุญแจ  จิงๆคือตัวเลขเป็นชุดๆที่ทำให้สามารถระบุที่มาที่ไปของตัว(แอพ)ของคุณได้  คือจะขาดความน่าเชื่อถือถ้าไม่มีใบนั้นๆ(คือไม่รู้หัวนอนปลายเท้า)  เหมือนเวลาลงโปรแกรมบน XP แล้วโดนเตือนว่า “ท่านกำลังลงโปรแกรมที่ไม่ทราบเจ้าของ” อ่ะคับ

 

[ขั้นตอนในการสร้างและรันโปรแกรมตัวอย่าง MapView ]
ลำดับตามนี้คับ

1. ทำการคัดลองโค๊ตทุกอย่างให้เรียบร้อย
2. ลอก “ลายนิ้วมือ” จากใบรับรองออกมา
3. นำ “ลายนิ้วมือ” ไปลงทะเบียนกับกูเกิ้ล  เพื่อรับกุญแจในการเข้าใช้บริการ
4. นำกุญแจไปใส่ใน Code ของเรา
5. สร้าง AVD (SDCard) ที่รองรับ Google API
6. ทำการรันโปรแกรม 

 

[แรกสุดเลย]
ให้ทำการสร้าง Project แล้วคัดลอกโค๊ตทุกอย่างให้เสร็จก่อนคับ  เพื่อรอการกรอกเลข Key ในขั้นตอนสุดท้าย

 

[ลอกลายนิ้วมือ]
ขั้นตอนการดู “ลายนิ้วมือ” จากใบรับรองที่มีบนเครื่องของเรา

1. หาตำแหน่งของไฟล์ “keytool.exe” ที่อยู่ใน JRE6.0 บนเครื่องของเรา

   อ้างอิง  [การเตรียมเครื่องเพื่อการพัฒนาโปรแกรมบน Android (3/3) - ติดตั้ง JRE6.0... ]
   (ของผมคือ – C:\Program Files\android\jre6\bin\keytool.exe)

2. Run ตัว DOS ขึ้นมา

   (เอ่อ – สำหรับคนรุ่นใหม่คงเรียกว่า CMD.exe กระมัง)
   [Start]->[Run]->[กรอก "cmd"]->[กด OK]

3. (ที่ cmd) ตั้งค่า PATH ของ XP ให้ชี้ไปที่ Keytool.exe ดังนี้

   (ทำคำสั่ง “set path=%path%;c:\++ตำแหน่งDirของKeytool++;”)
   (ของผมคือ – C:\Program Files\android\jre6\bin)

4. ตรวจสอบว่า ตั้งค่า PATH ถูกต้อง

   (ทำคำสั่ง “path”  – ให้ดูว่าค่าที่เราเพิ่งใส่ต้องอยู่ที่ท้ายสุดของสิ่งที่ display ออกมา)

5. หาตำแหน่งของไฟล์ “debug.keystore”

   (ของผมคือ C:\Documents and Settings\ยูสเซอร์เนมบนเครื่องคุณ\.android)

6. (ที่ cmd) ทำการ change directory ไปที่ตำแหน่งของไฟล์ “debug.keystore”

   (ทำคำสั่ง “cd c:\documents and settings\ยูสเซอร์เนมบนเครื่องคุณ\.android)

7. เอ่อ…  ขอพักเหนื่อยก่อนคับ  แต่ใกล้เสร็จแล้ว
8. ทำการเรียก keytool.exe ขึ้นมา

   (ที่ cmd) ทำคำสั่ง  “keytool -list -keystore debug.keystore”

9. ให้ใส่ password ว่า “android”
10. Keytool จะแสดงค่า ลายนิ้วมือออกมาให้ดูคับ  ให้จดไว้หรือ capture หน้านั้นเก็บไว้คับ  ทุกเครื่องจะมีลายนิ้วมือไม่เหมือนกันนะคับ  เสียใจ  ห้ามเลียนแบบ

[รูป 1.0] – หน้าจอผลลัพธ์ในขั้นตอนการคัดลอก “ลายนิ้วมือ”

 

[ไปลงทะเบียนกันคับ]

(อ้างอิง – http://code.google.com/intl/th-TH/android/maps-api-signup.html)

1. ไปที่นี่คับ http://code.google.com/intl/th-TH/android/maps-api-signup.html

2. ทำการกรอกเลขลายนิ้วมือลงไป  (ระบุหน่อยคับว่า ตกลงตามเงื่อนไขที่ว่าไว้)

3. กดปุ่ม  [Generate Map API]  จะได้ผลลัพธ์หน้าตาประมาณนี้ละคับ  ให้จดค่า Key และทำการ capture หน้าจอเก็บไว้คับ

[รูป 1.0] – หน้าจอผลลัพธ์ในขั้นตอนการลงทะเบียนเพื่อขอ MapAPI

 

[เอา Key ไปใส่ใน Code]
ได้ Key แล้วให้เอาไปใส่ใน Code ของเราตรงไฟล์ Layout ใน Res คับ

ของผมคือ

[XML ใน Layout File]
<com.google.android.maps.MapView
    android:layout_width=”fill_parent”
    android:layout_height=”fill_parent”
    android:apiKey=”0MWZBHOMcDn3g9bxIQ0uLu-cPs1AxBoQDfGYTMw”/>

 

[ก่อนที่จะ Run ตัว MapView]
ต้องทำการสร้าง SDCard ตัวใหม่โดยระบุให้มีการใช้ API เป็น “Google API Level 4″ ก่อนนะคับ  มิงั้น Eclipse จะฟ้องและไม่ยอมโหลด Emulator ให้

อ้างอิง: การเตรียมเครื่องเพื่อการพัฒนาโปรแกรมบน Android (3/3) – [Activate ตัว Android Emulator]

ทำตามขั้นตอนนั้นละคับ  แต่เปลี่ยน [Target] ให้เป็น “Android 1.6 – API Level 4″
เวลารันไม่ต้องระบุอะไร  ตราบเท่าที่ Eclipse สามารถหา SDCard ที่มี API ถูกตัว

 

[ถ้าพร้อมแล้ว]
ให้ทำการรันได้เลยครับ  เครื่องต้อง online ได้นะคับ  เมื่อตัว Emulator ขึ้นมาแล้วลองเล่นดู  จะเห็นได้รำไรว่าอนาคตของมือถือ Android แล้วคับว่าจะมาแนวไหน

 

[ตอนหน้า (3/3)]
ขอโยกปุจฉาไปอยู่กับวิสัจชนาในตอนหน้ารวดเดียวเลยคับ

 

สวัสดี ปีเสือ

- Android Dev – Starting (1/3)

Android Application Development – Ground Zero (1/3)

จุด… “ศูนย์จุดศูนย์” สำหรับการพัฒนาแอพพิเคชั่นบนแอนดรอยด์ครับ คือทำความคุ้นเคยกับตัว Eclipse กับ Code เล็กๆน้อยๆจากตัวอย่างที่มีมาให้จากใน SDK
ต้องเรียกได้เลยว่าไม่บังเอิญแน่ๆสำหรับตัวอย่างพวกนี้ เดาได้เลยคับว่าต้องมีการตั้งหน่วยสอดส่องเพื่อหาโปรแกรมตัวอย่างในตลาดที่”โดน”ใจกรรมการ และมีการวางแผนไว้ก่อนแล้วว่า ต้องมีเนื้อหาสำคัญๆที่เป็นหัวใจของการพัฒนาบน Android อะไรบ้าง เมื่อพบเห็นโปรแกรมตัวอย่างดังกล่าวก้อจะไปขออนุญาติจากผู้พัฒนาท่านนั้นๆ(จาก Blog ของเขา)แล้วเอามาจัดหน้าตาให้ง่ายต่อการเข้าใจและปล่อยลงใน SDK Tutorials

[สิ่งที่ทำสำหรับจุดนี้]
คือการทดลองสร้างและ run โปรแกรมตัวอย่างในหมวด “Hello, World” (มี 1 ตัว), และ “Hello, Views” (มี 14 ตัว)

[ข้อสังเกตุ]
สิ่งที่สังเกตุได้คือ

• “Hello World” และ “Hello View” จะไม่มี Source Code สำเร็จรูปให้ แต่ต้องทำทีละขั้นตอนโดยทำการ copy ตัว code เอาเองจากที่เขาบรรยายไว้ ทั้งนี้(เดาว่า)จะได้ให้มีความคุ้นเคยกับตัว Eclipse, การ navigate ไปมา, และการเล่นตัว Emulator ไปในตัว (แน่ๆกับผม พอจบ Hello Views ทั้งหมด ก้อคล่องตัวขึ้นเป็นกอง)
• เราสามารถสร้าง App (ตัวเป็นๆ) จาก Code ไม่กี่บรรทัด โดยการ reuse ตัว Widget สำเร็จรูปต่างๆที่มีให้ จะเห็นได้ว่า Code ไม่กี่บรรทัดก้อสามารถสร้างลูกเล่นต่างๆได้ เช่น ตัว Spinner (ตัวหมุนๆ)

[เริ่มจาก - ทำการเปิด หน้า Tutorials]

• ใช้ IE เปิดเนื้อหา SDK (แบบ offline) ที่ Favorite ไว้

  (ชี้ไปที่ Android SDK Guide บนเครื่อง – ดูตอนที่แล้วๆ)

• หัวข้อ [Tab - Dev Guide]->[กรอบซ้ายล่างๆ-HelloWorld]

  ของผมคือ [C:\...\android…sdk…\docs\guide\tutorials\hello-world.html]

• จะมี “Hello View”, “NotePad Tutorial”, และ “Sample Code”

[ทำการสร้าง App ตัวอย่างทีละตัว]
ตามนั้นละคับ ให้ค่อยๆทำตามไปทีละตัวจนครบทุกตัว ทำตามทีละขั้น ผมไม่บรรยายซ้ำละคับ ตัวอย่างทุกตัวคอนเฟอร์มว่าทำได้หมดนะคับ แน่นอน บรรยายได้ละเอียดมักๆ ยอดจิงๆ

[ขอแนะนำให้]

• ทำวันละตัวสองตัวก้อพอในระยะเริ่มต้น สมองเรามีศักยภาพในการรับข้อมูลปริมาณที่จำกัดต่อวัน ของผมแรกๆมีลืมเป็นประจำ (เช่น ขั้นตอนการสร้าง New Project) ข้ามวันก้อลืม ต้องย้อนกลับมาอ่านหลายครั้ง กลายเป็นว่ามันซ้ำๆเข้าไป แม่นดีเหมือนกัน
• ทั้งหมดมี 15 ตัวนะคับ น่าจะใช่เวลาหนึ่งอาทิตย์
• ตัว “GridView” กับ “Gallery” ต้องหารูปภาพมาไว้ล่วงหน้า (ผมใช้รูปน้องๆพริ้ตตี้ตามเวป มาแปลงให้อยู่ใน format PNG ไปใส่ไว้ในที่ที่กำหนด)
• ตัว “MapView” กับ “WebView” เวลา run เครื่องต้องต่อ net ไว้นะคับ
  <หมายเหตุ> รู้สึกว่าตัว Emulator ต้องอยู่บนเครื่องที่ออก Net ตรงถึงจะทำงานได้นะคับ Net ของบางบริษัทมีตัว Proxy ขั้นก่อนออก *อาจ*ทำให้ Emulator มีปัญหา (พอดีเห็นมีคนบ่นแว๊ปๆบน Forum อ่ะ)
• ขอให้ทำทุกตัว*ยกเว้น* Map View ที่ผมจะมาลงรายละเอียดเรื่องการสร้าง key หน่อยหนึ่ง (งมอยู่สองวัน) ในตอนหน้า

[ลืมบอกไป - สำคัญมาก]
ก่อนที่จะเริ่มทำการสร้าง App ตัวอย่าง ขอให้อ่านเนื้อหาในหัวข้อ “What is Android?” และ “Framework Topics” **ทั้งหมด** สักหนึ่งรอบ (ให้อ่านแบบผ่านๆ พอจับใจความได้) เพื่อที่จะได้คุ้นคำศัพท์ต่างๆบนโลก Android
เดี๋ยวเราผ่านด่านไล่โปรแกรมตัวอย่าง NotePad แล้วกลับไปอ่านอีกรอบ จะเห็นว่าอ่านรู้เรื่องขึ้นอีกเป็นกองเลย

[ตอนหน้า (2/3)]

• จะมาลงรายละเอียดเรื่องการสร้าง Key เพื่อ access ไปที่ Location Service ของ Google ดังในตัวอย่าง MapView
• และจะปุจฉา มาลองให้ทำดูว่า ต้องแก้ code จุดไหนเพื่อวิสัจชนากัน
• กำลังเล่งว่าจะ*รำพึงรำพัน*ว่าด้วยหัวข้อว่า สิ่งที่ต้องรู้ก่อนออกแบบแอนดรอยด์แอพ ที่ถอดความจากหัวข้อ Design for Performance, Responsiveness, and Seemlessness

ขอขอบคุณ