เขียน Custom Watch Face บน Android Wear กัน

ช่วงนี้ใน Google Play Store เริ่มมี App Watch Face มาให้ดาวน์โหลดกันเยอะขึ้น มี Watch Face ใหม่ๆ แทบจะทุกสัปดาห์ มีทั้งแบบฟรีและเสียเงิน ก็เลยคิดว่าถ้าจะเขียน Watch Face ในแบบที่ต้องการบ้างจะทำอย่างไร ซึ่งเท่าที่ลองค้นหาข้อมูลก็พบว่า Watch Face เขียนคล้ายกับ Launcher บน Android คือเขียน Wear App ปกติแต่ไปกำหนดใน AndroidManifest ว่าให้ทำหน้าที่เป็นอะไร ซึ่งถือว่าง่ายมากๆ ลองมาทำเล่นกันครับ

สิ่งที่ต้องมี

  • Android Studio รุ่นล่าสุด
  • Android SDK Rev 20
  • Android Wear System Image

อันดับแรกสร้าง AVD ขึ้นมาก่อนตามนี้

จากนั้น Start AVD เอาไว้ สำหรับท่านที่ใช้ Intel HAXM การทำงานของ Emulator ก็จะเร็วขึ้นมาบ้างนิดหน่อย T_T

สร้าง Project ขึ้นมาใหม่ เลือกเป็น Mobile และ Wear App เลือก Blank Activity ทั้งคู่

จากนั้น แก้ไข Android Manifest ที่ Wear Module เพิ่ม user permission ดังนี้

<uses-permission android:name="com.google.android.permission.PROVIDE_BACKGROUND" />
<uses-permission android:name="android.permission.WAKE_LOCK" />

จากนั้นกำหนดให้ Activity ฝังเป็น background ดังนี้

android:allowEmbedded="true"

เพิ่ม meta-data ลงไป เพื่อให้แสดง preview ตอนเลือกเปลี่ยน watch face ทำภาพขนาด 320×320 ใส่ลงใน res/drawable-hdpi

<meta-data
android:name="com.google.android.clockwork.home.preview"
android:resource="@drawable/ic_preview" />

ในส่วน intent-filter เพิ่ม category เพื่อกำหนดให้แสดงผลเป็น Background

<category android:name="com.google.android.clockwork.home.category.HOME_BACKGROUND" />

ตัวอย่าง Android Manifest

ทีนี้มาทำ Watch Face กัน แบบง่ายๆ แก้ไข layout ในไฟล์ rect_activity_wear.xml และ round_activity_wear.xml เพิ่ม ImageView และ TextClock ลงไปดังนี้

ใครอยากได้ภาพ Background ก็ทำภาพสวยๆ ขนาด 320x320px ใส่ลงไปได้ใน ImageView จากนั้นมาลองทดสอบ Wear App กัน วิธีการทดสอบทำได้ง่ายๆ สั่ง Run App บน AVD ที่เราสร้างขึ้น App จะ Run ขึ้นมาปกติ ให้เลื่อนขวา แล้วกดค้างที่หน้าจอ เพื่อเปลี่ยน watch face คุณก็จะเห็น watch face ของคุณขึ้นมา

วิธีการทำ Package สำหรับเผยแพร่ใน Play Store เนื่องจาก Wear Device ไม่สามารถเชื่อมต่อกับ Play Store ได้โดยตรง จำเป็นต้องใช้ Mobile App เป็น Payload ถ้าสั่งติดตั้ง Mobile App ที่มี Wear App อยู่ด้วย ตัวมือถือจะ Sync App ไปยังนาฬิกาให้อัตโนมัติ วิธีเพิ่ม wear apk ลงไปใน Mobile App ซึ่งก็มีอยู่ 2 วิธี คือ

  • Sign Package ของ Wear App แล้วเพิ่มเข้าไปใน Mobile App เอง
  • Sign Package ของ Wear App แล้วเพิ่มเข้าไปใน Mobile App แบบอัตโนมัติ

ก็เลือกอย่างหลังจะง่ายที่สุดครับ ให้ดู build.gradle ใน Mobile Module ว่าตั้งค่า WearApp เป็น dependencies แล้วหรือยัง (ถ้าเราสร้าง project มาพร้อมกัน Android Studio จะเพิ่ม WearApp เป็น dependency ให้อยู่แล้ว) จากนั้นสั่ง Generated Sign APK ที่ Mobile Module ได้เลย คุณก็จะได้ APK ที่เป็น Mobile App และมี Wear App อยู่ข้างใน ทีนี้ก็เอา Apk ที่ได้ เอาไปทดสอบกัน

วิธีการสร้าง Custom Watch Face นี้อาจไม่ถูกต้องนัก ทำสอบจาก Emulator มีผลข้างเคียงในเรื่องของการแสดงผล Notification และอาการ Screen Flick ซึ่งบนนาฬิกาจริงๆ ไม่รู้ว่ามีอาการแบบเดียวกันหรือไม่ ถ้าใครมี LG G Watch หรือ Gear Live ก็ฝากลองด้วย :P เอาไว้ถ้ามีวิธีการที่ดีกว่านี้ หรือ Google ปล่อย Watch Face API ออกมาแล้ว เดี๋ยวจะมาอัพเดทกันอีกรอบ :)

มาเขียน Notification บน Android Wear กัน

Android Wear เป็น Platform SmartWatch ที่เพิ่งเปิดตัวไปเมื่อไม่นานมานี้ จากงาน Google I/O 2014 ในเบื้องต้น Android Wear เน้นการเชื่อมต่อกับ Smartwatch และ tablet สามารถ share notification ได้อัตโนมัติ โดย notification ที่แสดงผลบน Smartphone จะแสดงผลบน Smartwatch ด้วยเช่นกัน โดยแสดงผลเป็น card ในรูปแบบของ context stream การใช้ notification ที่เชื่อมระหว่าง Smartphone และ Smartwatch สามารถช่วยสร้างประสบการณ์การใช้งานที่ดีให้กับผู้ใช้ได้ หากคุณเพิ่มฟังก์ชั่นการใช้งานเข้าไปให้กับ notification ที่คุณสร้างด้วย

มาลองสร้าง Notification บน Android Wear กัน สำหรับท่านที่เคยเขียน Notification บน Android มาแล้ว อาจจะคุ้นเคยกับ Notification Builder สำหรับ Smartphone กันอยู่แล้ว แต่ถ้าคุณต้องการสร้าง Notification เพื่อให้แสดงผลทั้งบน Smartphone และ Smartwatch ด้วยจะต้องใช้ NotificationCompat Builder สำหรับการใช้งาน NotificationCompat คุณจะต้องเรียกใช้ library จาก Android Support Library มาทดลองเขียนกันครับ

ขั้นแรกสิ่งที่คุณต้องมี

  • Android Studio 0.8.x รุ่นล่าสุด
  • Android Wear System Image ใช้ Atom ได้จะเร็วมาก อย่าลืมติดตั้ง HAXM ด้วย
  • Android Support Library
  • Android Wear App ดาวน์โหลดได้ที่ Google Play Store

Continue reading

อัดวิดีโอหน้าจอบน Android 4.4.2 KitKat

ผมยังรู้สึกตื่นเต้นกับ KitKat อยู่หลังจากตัดสินใจอัพเกรดจาก 4.3 Stock ROM มาเป็น Cyanogen Mod 11 ทำให้ได้เล่นและได้ลองอะไรใหม่ๆ เยอะ โดยเฉพาะคุณมบัติที่เพิ่งโผล่มา คือ Screen Record ครับ โดยปกตินักพัฒนาจะอาศัยโปรแกรม Screen Record จากภายนอกมาจับหน้าจอเพื่อทำ Video แต่ใน KitKat มีโปรแกรมจับหน้าจอใดตัว ซึ่งเรียกใช้ได้ 2 วิธี

วิธีแรกจาก adb นี่แหละครับ คือสั่ง adb shell ให้ไป run โปรแกรม screen record ในเครื่องให้จับหน้าจอให้แล้วบันทึกลงใน sdcard ดังนี้

adb shell screenrecord /sdcard/a.mp4

หากต้องการหยุด ก็กด Ctrl+C เท่านี้ก็ได้วิดีโอหน้าจอแล้ว จากนั้นก็คัดลอกไฟล์จากมือถือลงมาที่เครื่องดังนี้

adb pull /sdcard/a.mp4

วิธีที่ 2 ใช้ Android Studio ที่เป็นเครื่องมือของนักพัฒนานี่แหละครับ เปิดไปที่ Android DDMS จากนั้นหาปุ่มเขียวๆ กดลงไปเลยครับ

จากนั้นจะมีหน้าจอให้ตั้งค่า config เพิ่มเติมถ้าคิดไม่ออกก็กด Start Recording ไปได้เลย

เมื่อกด Start Recording แล้วหน้าจอจะแสดง progress bar พร้อมปุ่ม Stop หากต้องการหยุดบันทึกก็กดปุ่ม Stop ได้เลย

พอกด Stop โปรแกรมก็จะถามว่าจะบันทึกไฟล์ไว้ที่ไหนดังนี้

เลือกไดเรคทอรีที่ต้องการ :)

 

อัพเกรด Galaxy Nexus เป็น KitKat 4.4.2

เนื่องจาก Google ยกเลิกสนับสนุนการอัพเกรด Galaxy Nexus เนื่องจากอายุเกิน 18 เดือน หมดอายุแล้ว T_T ก็เลยต้องรอ Custom ROM ซึ่ง Cyanogen Mod ก็ไม่ทำให้ผิดหวัง ปัญหาคือไม่ official แต่ก็พอใช้ได้ดีกว่าไม่มี ROM อ่ะนะ การที่จะอัพเดท ROM ของ Cyanogen Mod ต้องใช้ Clock Work Mod Recovery ต้อง flash clockworkmod ก่อน วิธีการก็ง่ายมาก unlock bootloader ก่อนดังนี้

adb reboot bootloader

fastboot oem unlock

จากนั้นที่เครื่องจะถามว่าเราต้องการ unlock bootloader หรือไม่ ก็กด Accept ไปครับ จากนั้นก็ boot เครื่องปกติ จากนั้นดาวน์โหลด Cyanogen Mod 11 และ GApps ใส่ลงใน /sdcard จากนั้นดาวน์โหลด Clock Work Mod Recovery มาแล้วสั่ง flash recovery ดังนี้

fastboot flash recovery recovery-clockwork-touch-6.0.4.3-maguro.img

จากนั้น reboot ไปที่ recovery

fastboot boot recovery-clockwork-touch-6.0.4.3-maguro.img

คุณจะเข้าสู่หน้า CWM ให้เลือก wipe data/factory reset จากนั้นเลือก install zip > install zip from /sdcard เลือก flash cm11 และ gapps ตามลำดับ จากนั้นก็สั่ง reboot เครื่อง เท่านี้ก็ได้ KitKat ใช้แล้ว :)

 

อัพเกรด Jelly Bean 4.3 บน Transformer TF101

Tablet Transformer TF101 ของผมใช้ Jelly Bean จาก Custom ROM ของ Rayman FX พัฒนาจาก CM10 ซึ่งผมก็ซนติดตั้ง CM10 อัพเกรดมาเรื่อยๆ จนกระทั่งอาการของเครื่องมันแปลกทำงานช้าจนรับไม่ได้ ก็เลยลองค้นหา ROM ใหม่ พบว่าระยะหลังๆ มีคนทำ ROM หน้าใหม่เกิดขึ้นมาเพิ่มอีกเรื่อยๆ ก็เลยลองสักหน่อย จาก XDA Developer Forum มี ROM ที่น่าสนใจชื่อ KatKiss เป็น Jelly Bean 4.3 พัฒนาโดย Timduru ซึ่ง ROM ตังนี้ต้องติดตั้ง Recovery ตัวใหม่ด้วย จึงจะ Flash ROM ใหม่ลงไปได้ และทำงานได้ถูกต้อง สำหรับ KatKiss รองรับการแสดงผล UI ได้ 2 แบบคือแบบ Tablet และแบบ Phablet ปรับแต่งได้ตามใจชอบ และที่สำคัญ ROM ตัวนี้มาพร้อมกับ Root ไม่ต้องตาม Root กันทีหลัง สำหรับคนที่สนใจก็ลองไปหาติดตั้งกันดูได้ครับ

ต่อมือถือ Android กับ Ubuntu ผ่าน MTP

ผมใช้มือถือ Nexus มาได้ 1 ปี แต่ก็ยังไม่สามารถรับ-ส่ง ไฟล์ผ่านสาย USB ได้ เนื่องจาก Android 4.x ใน Nexus ใช้การเชื่อมต่อผ่านโปรโตคอล MTP และ PTP เท่านั้น ทำให้การใช้งานเครื่อง Nexus ของผมต้องผ่าน ddms หรือไม่ก็ Airdroid สำหรับท่านที่ใช้ระบบปฏิบัติการ Windows อาจไม่ส่งผลกระทบเท่าไร แต่ท่านที่ใช้ Ubuntu ก็คงต้องมาหาทางแก้ไขกัน ใน Ubuntu มีเครื่องมือหลายอย่างในการรับส่งไฟล์ผ่าน MTP เช่น Go-Mtpfs, Gvfs เป็นต้น แต่ทั้งหมดก็สร้างปัญหา หรือที่เรียกว่าใช้งานไม่ได้มาเกือบ 1 ปี แต่ Gvfs และ libmtp ก็ทะยอยแก้ปัญหามาเรื่อยๆ สำหรับท่านที่อยากลอง สามารถติดตั้งเพื่อทดสอบกันได้ จาก PPA ของนักพัฒนา ดังนี้

เพิ่ม PPA ของ Gvfs

sudo add-apt-repository ppa:langdalepl/gvfs-mtp

sudo apt-get update

จากนั้นสั่ง Upgrade

sudo apt-get upgrade

จากนั้น reboot เครื่อง แล้วลองเสียบเครื่อง Nexus ของคุณดูครับ จะพบว่า Ubuntu จะ Mount MTP Device ขึ้นมาให้พร้อมใช้งาน ;)

หมดพลัง

ช่วงเกือบๆ 3 อาทิตย์ที่ผ่านมาผมพยายามเค้นสมองเรื่องการพัฒนา Mobile Application บน Android ก็ต้องเตรียม Presentation ตัวอย่าง App และวิดีโอ Tutorial เพื่อเตรียมไปสอนที่มหาวิทยาลัยราชภัฏพระนครศรีอยุธยา ในช่วงเดือนมิถุนายน แต่เนื่องจากไม่มี Material เหล่านี้เลย ก็ต้องทำกันใหม่หมด ทำให้ต้องทำงาน 3 อย่างพร้อมกัน และด้วยความนึกสนุกก็เลยไปเปิดคอร์สออนไลน์ที่ ClassStart.org ทำให้ผมต้องเร่งทำ Material ข้างต้นให้เร็วขึ้น เพราะเดี๋ยวจะไม่ทันเปิดคอร์สที่ ClassStart.org เอาเป็นว่าเป็น 3 อาทิตย์ที่ทรหดมาก วันนี้เป็นวันสุดท้ายที่จะต้องทำให้เสร็จ ซึ่งช้ากว่ากำหนด 1 สัปดาห์ ผลลัพท์ที่ได้คือ

  • Presentation : Android Mobile App Development จำนวน 8 ตอน
  •  Video Tutorial สอนทำ Workshop จำนวน 60 เรื่อง
  • Source Code เฉลย Workshop เป็น Web Service จำนวน 6 ตัว เป็น Mobile App อีก 47 ตัว
  • คอร์สออนไลน์ที่ ClassStart.org ตอนนี้มีคนลงทะเบียน 65 คน

เครื่องไม้เครื่องมือทั้งหมดที่ใช้ ได้แก่

  • Google Drive
  • Youtube
  • GitHub
  • Git
  • GEdit
  • GIMP
  • Inkscape
  • Shutter
  • Chrome
  • OpenShot
  • Eclipse PDT
  • Eclipse ADT
  • XAMPP
  • Screen capture with Gnome 3

 

มัดรวมเครื่องมือสำหรับออกแบบ UI บน Android

เนื่องจากการออกแบบ UI และทำ UI Prototype ใน Android ใช้พลังงานมหาศาลในการออกแบบ ซึ่งต้องใช้เวลามากกว่า 70% ในการทำซึ่งเป็นช่วงเวลาโหดร้ายมาก เพราะ Android Application ที่ดีจะต้องแสดงผลได้ในทุกขนาดของหน้าจอ ซึ่งอุปกรณ์ที่ใช้ระบบปฏิบัติการ Android มีหน้าจอต่างกันเกือบร้อยแบบซึ่งมีทั้งมือถือ, แท็บเล็ต และหน้าจอโทรทัศน์ T_T ทำให้การออกแบบหน้าจอกินเวลามาก ถ้าต้องการแก้ไข UI นี่แทบจะกระอักเลือดกันเลยทีเดียว ครั้งนี้จะมาแนะนำเครื่องมือที่ใช้สำหรับออกแบบและทำ UI Protype ให้เราเห็นภาพและตัดสินใจได้ว่าจะเอา UI แบบไหนแสดงผลในอุปกรณ์ใด และยังสามารถสร้างภาพ Mockup สำหรับแสดงผลบนหน้าจออุปกรณ์ตระกูล Nexus ได้ด้วย เครื่องมือต่างๆ มีดังนี้

  • Android Asset Studio เป็นเครื่องมือสำหรับสร้าง icon, Action bar
  • Android Action Bar Style Generator เป็นเครื่องมือสร้าง theme สำหรับ Action Bar
  • Android Holo Colors Generator สำหรับสร้าง theme
  • Device frame generator เป็นเครื่องมือสร้างภาพอุปกรณ์+ภาพหน้าจอที่เราต้องการเอาไปใส่ สำหรับตระกูล Nexus
  • Pencil GUI Prototyping Tools เป็นเครื่องมือสร้างภาพหน้าจอ (ตัวนี้เป็นโปรแกรมจากเพื่อนบ้านของเรานี่เอง-เวียดนาม)
  • Fluid UI เป็นเครื่องมือสร้างภาพหน้าจอมีหลายระบบปฏิบัติการให้เลือกทั้ง Windows, Windows Mobile, iPhone, iPad และ Android Phone, Android Tablet แถมมีเครื่องมือที่เรียกว่า Fluid Player สำหรับเล่นตัวอย่าง UI บนอุปกรณ์ต่างๆ ได้ เอาไว้ทดสอบ Flow และนำเสนองานได้

ปิดท้ายด้วยเว็บรวม UI สวยๆ เอาไว้เป็นตัวอย่างสำหรับผู้ที่พัฒนา Mobile App อย่าง Android Patterns สำหรับท่านที่สงสัยว่าหน้าจอสวยๆ แปลกๆ ที่ไม่มีเครื่องมือใน ADT นั้นทำยังไงให้องไปค้นหากันได้ที่ Android View รวบรวมเอาเครื่องมือและไลบรารีต่างๆ ไว้มากมายสามารถไปศึกษากันได้ สุดท้ายเป็นเอกสารแนะนำการออกแบบ UI Guideline บน Android จาก nuuneoi แห่งบริษัท หัวลำโพง จำกัด ผู้พัฒนา App MOLOME

Problem-based Learning กับ Android หลักสูตร Web Services

ผมโดนทาบทามให้ไปสอน Android หลักสูตร Web Services จริงๆ มีหลายคนยุให้ไปสอน Android หลายรอบแล้ว ซึ่งผมไม่ค่อยชอบสอนเท่าไรนัก เพราะเป็นคนพูดไม่ค่อยรู้เรื่อง แต่ครั้งนี้ดูท่างทางอาจจะได้ไปสอนจริงๆ ก็ได้ หลักสูตรที่สอนไม่มีครับ เพราะคอร์สในลักษณะนี้เผลอๆ ไม่มีในโลก ผมไม่เคยเห็นใครสอนเรื่อง Web Services กันนะ เพราะประสบการณ์มันจะพาไปเอง ไม่จำเป็นต้องไปนั่งเรียนก็ได้ แต่ก็แปลกดีที่มีคนทาบทามให้สอนเรื่องนี้ จากที่ได้สอบถามจากความต้องการของผู้เรียน ก็ไม่ค่อยได้ข้อมูลสักเท่าไร สงสัยได้ร่างหลักสูตรเองแล้วล่ะครับ T_T

จากการสอบถามที่มาที่ไปของหลักสูตรประหลาดนี้ เกิดจากแนวคิดในการอัดฉีดความรู้ให้กับนักศึกษาเพื่อให้มีความพร้อมในการไปทำงานหรือทำธุรกิจ ไม่ใช่เป็นการบ่มเพาะแต่เป็นการฉีดยาแรง เพื่อให้เกิดประสบการณ์จากการแก้ปัญหาจากการทำงาน โครงการต้นแบบ หรือ Case Study ซึ่งนักศึกษาจะได้เล่นของจริง สไตล์ Problems Based Learning ผมว่าแนวความคิดแบบนี้ใช้ได้ และคนที่วางแผนการเรียนการสอนแบบนี้ได้ต้องเป็นคนที่รอบรู้จริงๆ ผมเองก็ใช้วิธีการนี้ในการฝึกที่จะเรียนรู้อะไรใหม่ๆ ตั้งปัญหาหรือสิ่งที่อยากทำและหาทางแก้ปัญหานั้นเป็นขั้นตอนไป แต่การที่จะแก้ปัญหาเหล่านั้นได้ จะต้องเข้าใจปัญหาและมีประสบการณ์มากพอที่จะหาวิธีการแก้ปัญหานั้นๆ ซึ่งสิ่งนี้เป็นจุดแข็งและจุดอ่อนในการเรียนรู้ในลักษณะนี้ หากล้มเลิกกลางทางก็แทบจะไม่ได้อะไรเลย ถ้ากัดฟันสู้ก็จะได้เรียนรู้สิ่งใหม่ที่เราอยากเรียนรู้ แต่ฐานความรู้นั้นจะแคบและเฉพาะทางมากๆ ดังนั้นการเรียนรู้ในลักษณะนี้ต้องมีเวลาเหลือพอที่จะเรียนสิ่งรอบตัวหรือบางสิ่งบางอย่างที่เกี่ยวข้องบ้าง จึงจะเป็นการเติมเต็มความรู้ในส่วนที่ขาดหายไป

วิเคราะห์ตลาดซอฟต์แวร์บน Play Store

ผมเอาตัวเองเป็นหนูทดลองเพื่ออยากรู้อะไรบางอย่างในการทำตลาดซอฟต์แวร์บน Android Market แบบซื่อๆ ไม่ได้มี Business Model อะไรซับซ้อน ผมพยายามเขียน App เอาไปวางได้ประมาณ 12 ตัว ตอนนี้กระจายอยู่ในกลุ่ม การศึกษา, เอนเตอร์เทนเม้น โดยตั้งกลุ่มประเทศเป้าหมายแบบรวมๆ ไม่ได้เจาะไปยังกลุ่มเป้าหมายประเทศใดประเทศหนึ่ง เลยเอา App ที่มีสถิติยอดดาวน์โหลดมากกว่า 10,000 ครั้ง เอามาให้ดูซัก 2 App ผลออกมาดังนี้

การศึกษา

เอนเตอร์เทนเม้น

เนื่องจากยอดดาวน์โหลดในกลุ่มเกมส์ยังมีน้อยมาก เลยยังไม่มีตัวเลขมาให้ดู อ้อลืมบอกไปว่าให้ดูช่องสุดท้ายนะครับ สรุปประเด็นง่ายๆ

  • ถ้ามีสถิติเบื้องต้น ในแต่ละกลุ่ม Education เช่น ลูกค้าที่เกาหลีเยอะกว่าญี่ปุ่น การเลือกตลาด/เลือกทำ App ได้ง่ายมากขึ้น ในกรณีไม่รู้จะทำ App อะไรขาย ซึ่งมีประโยชน์มาก
  • Business Model, Innovation, Idea เป็นสิ่งจำเป็นมากในการทำตลาดบน Online Store อื่นๆ ไม่ว่าจะเป็น Play Store, Windows Store, App World หรือแม้กระทั่ง App Store

ทิ้งท้ายอีกหน่อย เพราะว่ายังรู้สึกเสียใจที่คนไทยยังค่าบัญชีเป็น “คนขาย” ไม่ได้ดังนั้น Business Model จึงต้องเปลี่ยนเป็นลักษณะอื่นมากกว่าการขาย App ซึ่งถ้าคิดจากยอดดาวน์โหลด App ของผม โดยรวมมากกว่า 80,000 ครั้ง ก็น่าจะได้เงิน (แบบตรง) ประมาณ 80,000×30=2,400,000 บาท หัก 30% เหลือสุทธิที่จะได้ 1,680,000 บาท แต่ตอนนี้ผมได้เงินจาก App (Business Model แบบโง่ๆ) แค่ 4,539.36 บาท ห่างไกลจากความเป็นจริงมาก :P