คู่มือนี้จะอธิบายองค์ประกอบต่างๆ ที่ประกอบขึ้นเป็น งานต่อเนื่องในรูปแบบของนาฬิกาจับเวลา งานที่กำลังดำเนินอยู่จะแสดงการ์ดแบบสดในไทม์ไลน์ตราบใดที่ผู้ใช้ยังมีส่วนร่วมในงาน และให้ผู้ใช้เข้าถึงและออกจากการ์ดแบบสดได้ตามที่ต้องการ
ระหว่างการเรียนรู้ คุณจะได้เรียนรู้เกี่ยวกับการออกแบบ การพัฒนา และ เคล็ดลับในการเผยแพร่ที่สำคัญในการสร้างกลาสแวร์ของคุณเอง
ก่อนเริ่มต้น
แหล่งข้อมูลทั้งหมดของนาฬิกาจับเวลามีอยู่ใน GitHub โปรดนำเข้ามาใน Android Studio ก่อนเริ่มต้น เนื่องจากคู่มือนี้จะกล่าวถึงรายละเอียด
- จากหน้าจอเริ่มต้นอย่างรวดเร็ว ให้คลิกเช็คเอาต์จากการควบคุมเวอร์ชัน > Git
- คัดลอก URL การโคลนจากนาฬิกาจับเวลา
- วาง URL การโคลนลงใน URL ที่เก็บ Vcs แล้วคลิกโคลน
- คลิก Yes บนหน้าจอถัดไป
- คลิกตกลงบนหน้าจอถัดไป
- สร้างโปรเจ็กต์และเรียกใช้บน Glass ที่เชื่อมต่อโดยคลิกปุ่มเล่น อย่าลืมตรวจสอบ
READMEของตัวอย่างสำหรับรายละเอียดการเรียกใช้
สิ่งที่คุณจะได้เรียนรู้
คุณจะได้เรียนรู้วิธีใช้คอมโพเนนต์จาก Android SDK เพื่อสร้างงานต่อเนื่องของนาฬิกาจับเวลาจำนวนมาก จากนั้นใช้ GDK เพื่อเข้าสู่ประสบการณ์ Glass หัวข้อที่คุณจะได้เรียนรู้มีดังนี้
- การสร้างมุมมองที่กำหนดเองเพื่อวาดลงในการ์ดที่เผยแพร่อยู่
- กำลังสร้างบริการเพื่อจัดการบัตรที่เผยแพร่อยู่
- การแสดงเมนูที่ให้ผู้ใช้นำการ์ดที่เผยแพร่อยู่ออกจากไทม์ไลน์ได้
- กำลังประกาศทริกเกอร์เสียงเพื่อเริ่มนาฬิกาจับเวลาจากเมนูเสียงหลัก
การออกแบบ
ก่อนที่คุณจะเริ่มพัฒนา โปรดใช้เวลา และออกแบบ Glassware ของคุณ การทำเช่นนี้จะทำให้คุณเห็นภาพว่า UI แบบใดทำงานได้ดีที่สุดใน Glass คำสั่งด้วยเสียงที่คุณจะใช้ และการ์ดจะมีหน้าตาเป็นอย่างไร
แน่นอนว่าการออกแบบกลาสแวร์เป็นกระบวนการที่ต้องทำซ้ำๆ และสิ่งต่างๆ ที่คุณออกแบบตอนนี้จะเปลี่ยนแปลงไป แต่การมีส่วนดีๆ จากงานนั้นเริ่มต้นนั้นสำคัญมากต่อการสร้างประสบการณ์ที่ยอดเยี่ยม
โฟลว์ UI
การออกแบบขั้นตอน UI เป็นแบบฝึกหัดง่ายๆ และช่วยให้คุณสามารถแสดงภาพ Glassware ของคุณก่อนที่จะเขียนบรรทัดโค้ด เราผลิตเครื่องแก้วที่เราสร้างอยู่ตลอดเวลา
เรามาดูองค์ประกอบ UI ที่สำคัญของนาฬิกาจับเวลา เพื่อให้คุณเห็นภาพวิธีการทำงานของ UI และเห็นว่ากระบวนการนี้จะ มีประโยชน์อย่างไรเมื่อสร้าง Glassware ของคุณเอง
UI หลัก
นาฬิกาจับเวลามีขั้นตอนหลักเพียงขั้นตอนเดียว เพราะเป็นประสบการณ์ที่ค่อนข้างง่าย
เมื่อผู้ใช้เรียกใช้ Glassware ระบบจะแสดง โฆษณาคั่นระหว่างหน้าที่นับถอยหลัง 3 วินาทีก่อนที่นาฬิกาจับเวลาจริงจะเริ่มขึ้น จากนั้นนาฬิกาจับเวลาจะนับถอยหลังจนกว่าผู้ใช้จะนำออกจากไทม์ไลน์ด้วยรายการในเมนูหยุด
คำสั่งเสียง
คุณควรจะคิดคำสั่งเสียงได้ตั้งแต่เนิ่นๆ ในขั้นตอนการออกแบบ คำสั่งเสียงช่วยให้ผู้ใช้เริ่มใช้ Glassware จากเมนูเสียงของ Glass Home (การ์ดนาฬิกา) ได้หากจำเป็น และเป็นส่วนสำคัญในการออกแบบ Glassware
ตัวอย่างเช่น คำสั่ง Post an update ก็ทำงานได้ดีในโมเดลแบบไม่ต้องดำเนินการใดๆ เลย ซึ่งผู้ใช้จะพูดข้อความและ Glassware จะประมวลผลข้อความนั้นโดยที่ผู้ใช้ไม่ต้องดำเนินการใดๆ เพิ่มเติม ซึ่งจะช่วยให้ผู้ใช้กลับไป สิ่งที่กำลังทำอยู่ได้อย่างรวดเร็ว
ในทางกลับกัน สำหรับฟังก์ชันอย่างเช่นเล่นเกม คุณจะต้องนำผู้ใช้ไปยังหน้าจอแนะนำเพื่อให้พวกเขาเริ่มเกมได้ก่อน เนื่องจากคำสั่งด้วยเสียงนี้มักจะสร้างความรู้สึกได้จริง คุณจึงคาดหวังได้ว่าผู้ใช้จะเห็นด้วยกับการดูหน้าจอและเมนูเพิ่มเติมเมื่อจะเริ่มเล่นเกม การพาผู้ใช้เข้าสู่การเล่นเกมทันทีหลังคำสั่งเสียงมักจะเป็นประสบการณ์ที่ไม่ดีในเกม
นาฬิกาจับเวลาใช้คำสั่งเสียงเริ่มใช้นาฬิกาจับเวลา หลังจากที่ผู้ใช้เรียกใช้คำสั่งเสียง นาฬิกาจับเวลาจะเริ่มทำงานหลังจากหน้าจอนับถอยหลังสั้นๆ แบบคั่นระหว่างหน้า ซึ่งดีกว่าการให้รายการในเมนูเพื่อเริ่มทำงาน สำหรับงานต่อเนื่อง โดยทั่วไปคุณจะต้องเน้นทำให้ผู้ใช้ได้รับประสบการณ์โดยเร็วที่สุดเท่าที่จะเป็นไปได้
เลย์เอาต์แบบการ์ด
ไม่ว่าจะกำลังสร้างการ์ดสมจริงหรือการ์ดสด คุณควรใช้CardBuilderหรือเลย์เอาต์ XML เมื่อเป็นไปได้
บ่อยครั้งคุณจะต้องสร้างเลย์เอาต์ของตัวเอง ดังนั้นโปรดปฏิบัติตามหลักเกณฑ์ UI เพื่อให้ Glassware ของคุณดูดีที่สุด
นาฬิกาจับเวลาทำตามหลักเกณฑ์การออกแบบทั่วไป แต่มีการออกแบบ UI ที่กำหนดเองโดยใช้คอมโพเนนต์ Android มาตรฐาน เช่น มุมมองและเลย์เอาต์
พัฒนา
หากต้องการพัฒนาการ์ดแบบสด ให้ใช้เครื่องมือเดียวกับที่ใช้ในการพัฒนา Android ในการสร้าง Glassware จำนวนมาก จากนั้นใช้ API ในส่วนเสริม GDK เพื่อเข้าถึงฟังก์ชันการทำงานเฉพาะสำหรับ Glass เช่น การ์ดแบบสดและคำสั่งเสียง
คุณจะใช้คอมโพเนนต์ทั่วไปของ Android ในการสร้าง Glassware อยู่บ่อยๆ แต่อย่าลืมว่าแนวคิดบางอย่างอาจแตกต่างออกไป เช่น คุณแสดงผลและจัดการการ์ดแบบสดด้วยบริการของ Android ซึ่งไม่ใช่วิธีทั่วไปที่คุณใช้บริการต่างๆ ในแอป Android แบบดั้งเดิม อีกตัวอย่างหนึ่งคือการ์ดแบบสดไม่ได้เป็นเจ้าของบริบท UI ของตัวเอง คุณจึงต้องใช้กิจกรรม Shell ที่แสดงเมนูสำหรับการ์ดแบบสด คุณจะเรียนรู้วิธีสร้างองค์ประกอบเหล่านี้ ได้ภายหลังในคู่มือนี้
ส่วนอื่นๆ ของ "พัฒนา" จะพูดถึงโครงสร้างของนาฬิกาจับเวลา และองค์ประกอบหลักของโปรเจ็กต์ที่คุณนำเข้าก่อนหน้านี้ คุณควรเพิ่ม Android Studio ไว้ในแอปเพื่อให้ติดตามได้ จะมีการแสดงความคิดเห็นเกี่ยวกับซอร์สโค้ด ดังนั้นส่วนนี้จึงกล่าวถึงวัตถุประสงค์ระดับสูงของแต่ละไฟล์ และเคล็ดลับที่เป็นประโยชน์ซึ่งคุณสามารถนำไปใช้กับ Glassware ของคุณเองได้
คำสั่งเสียง
คุณสร้างคำสั่งเสียงด้วยไฟล์ทรัพยากร XML ที่ระบุคำสั่งที่ใช้อยู่ และระบุทรัพยากร XML ในไฟล์ AndroidManifest.xml
ไฟล์ต่อไปนี้เชื่อมโยงกับคำสั่งเสียงสำหรับนาฬิกาจับเวลา:
res/xml/voice_trigger_start.xml- ประกาศคำสั่งเสียงที่จะใช้AndroidManifest.xml- ประกาศบริการการ์ดสดให้เริ่มทำงานเมื่อมีการพูดคำสั่งเสียง
มุมมองนับถอยหลัง
นาฬิกาจับเวลาจะแสดงการนับถอยหลังก่อนที่จะมีการบันทึกเวลาจริงเพื่อแจ้งให้ผู้ใช้ทราบว่า เวลากำลังจะผ่านไป
ไฟล์ต่อไปนี้เชื่อมโยงกับมุมมองการนับถอยหลัง
res/layout/card_countdown.xml- กำหนดเลย์เอาต์สำหรับผู้ชมนับถอยหลังsrc/com/google/android/glass/sample/stopwatch/CountDownView.java- กำหนดมุมมอง สำหรับการนับถอยหลัง
มุมมองโครโนมิเตอร์
นี่คือมุมมองหลักของนาฬิกาจับเวลา โดยจะแสดงเวลาที่ผ่านไปตั้งแต่การนับถอยหลัง โฆษณาคั่นระหว่างหน้าเสร็จสมบูรณ์ ไฟล์ต่อไปนี้เชื่อมโยงกับมุมมองโครโนมิเตอร์
res/layout/card_chronometer.xml- กำหนดเลย์เอาต์สำหรับมุมมองนาฬิกาจับเวลาsrc/com/google/android/glass/sample/stopwatch/ChronometerDrawer.java- กำหนดวิธีแสดงผลมุมมอง บริการการ์ดสดเรียกใช้คลาสนี้ให้ดึงข้อมูลไปที่บริการการ์ดสดsrc/com/google/android/glass/sample/stopwatch/ChronometerView.java- มุมมองนาฬิกาจับเวลาที่ใช้เลย์เอาต์ก่อนหน้าเป็น UI
บริการนาฬิกาจับเวลา
ซึ่งเป็นบริการที่จัดการวงจรและการแสดงผลของการ์ดแบบสด ไฟล์ต่อไปนี้เชื่อมโยงกับบริการนี้:
src/com/google/android/glass/sample/stopwatch/StopwatchService.java- จัดการการ์ดข้อมูลสดของนาฬิกาจับเวลาและจัดการอายุการใช้งานของบริการ
กิจกรรมเมนู
การ์ดที่แสดงอยู่ไม่มีบริบท UI ของตัวเองที่จะแสดงเมนู เนื่องจากการ์ดแสดงผล UI ของตัวเองในบริบทของไทม์ไลน์
หากต้องการหลีกเลี่ยงข้อจำกัดนี้ คุณต้องสร้างกิจกรรมแบบโปร่งแสงซึ่งปรากฏที่ด้านบนของไทม์ไลน์ แล้วแสดงเมนูของกิจกรรมนั้นทันทีหลังจากที่ผู้ใช้แตะการ์ดถ่ายทอดสด
src/com/google/android/glass/sample/stopwatch/MenuActivity.java- ประกาศกิจกรรมเมนูแบบโปร่งแสงซึ่งจะแสดงเมนูทันทีเมื่อกิจกรรมแสดงขึ้นres/values/styles.xml- กำหนดรูปแบบโปร่งแสงที่ใช้กับเมนูres/menu/stopwatch.xml- ทรัพยากรเมนูที่มีรายการในเมนู Stop ที่จำเป็น
ไฟล์ Manifest ของ Android
ไฟล์ AndroidManifest.xml อธิบายส่วนประกอบหลักๆ
ของ Glassware เพื่อให้ระบบทราบวิธีเรียกใช้ ไฟล์ Manifest สำหรับ Charades ประกาศสิ่งต่างๆ ต่อไปนี้
- ไอคอนและชื่อของ Glassware Glass จะแสดงข้อมูลนี้บนเมนูสัมผัสหลัก หากมีกลาสแวร์มากกว่า 1 รายการที่ตอบสนองต่อคำสั่งเสียงเดียวกัน
- บริการและกิจกรรมทั้งหมดที่เกี่ยวข้องกับนาฬิกาจับเวลา จำเป็นสำหรับระบบที่จะทราบวิธีเริ่มใช้งานส่วนประกอบของ Glassware
- คำสั่งเสียงและตัวกรอง Intent ที่เริ่มต้นบริการ การ์ดสดเมื่อมีการพูดคำสั่งเสียง
- รหัสเวอร์ชันสำหรับ Glassware โค้ดนี้ต้องได้รับการอัปเดต (และมักจะเป็นชื่อเวอร์ชันด้วย) ทุกครั้งที่มีการอัปโหลดเวอร์ชันใหม่ของ APK นี้ไปยัง MyGlass