แอปพลิเคชันของคุณอาจมีงานที่มีหลายขั้นตอนสำหรับผู้ใช้ เช่น แอปของคุณอาจต้องช่วยแนะนำ ผ่านการซื้อเนื้อหาเพิ่มเติม การตั้งค่าการกำหนดค่าที่ซับซ้อน หรือ เพียงแค่ยืนยันการตัดสินใจ งานทั้งหมดเหล่านี้ต้องแนะนำผู้ใช้เกี่ยวกับลำดับอย่างน้อย 1 รายการ ขั้นตอนหรือการตัดสินใจ
ไลบรารี androidx.leanback มีคลาสสำหรับการใช้งานของผู้ใช้ที่มีหลายขั้นตอน หน้านี้
จะพูดถึงวิธีใช้
GuidedStepSupportFragment
ชั้นเรียน
เพื่อนำทางผู้ใช้ผ่านชุดการตัดสินใจเพื่อทำงานให้สำเร็จ GuidedStepSupportFragment
ใช้แนวทางปฏิบัติแนะนำเกี่ยวกับ UI ทีวีเพื่อให้งานที่มีหลายขั้นตอนเข้าใจง่ายและไปยังส่วนต่างๆ ในอุปกรณ์ทีวีได้
ระบุรายละเอียดขั้นตอน
GuidedStepSupportFragment
แสดงขั้นตอน 1 ขั้นตอนในชุด
หลายขั้นตอน โดยจะแสดงมุมมองคำแนะนำพร้อมด้วย
รายการการดำเนินการหรือการตัดสินใจที่เป็นไปได้สำหรับขั้นตอนนั้นๆ
![](https://developer.android.com/static/images/training/tv/playback/guided-step-screen.png?authuser=0000&hl=th)
รูปที่ 1 ตัวอย่างขั้นตอนที่แนะนำ
สำหรับแต่ละขั้นตอนในงานที่มีหลายขั้นตอน ให้ขยายเวลา
GuidedStepSupportFragment
และให้ข้อมูลบริบทเกี่ยวกับ
ขั้นตอนและการดำเนินการที่ผู้ใช้ทำได้ ลบล้าง
onCreateGuidance()
และส่งคืน
GuidanceStylist.Guidance
ที่มีบริบท
เช่น ชื่อขั้นตอน คำอธิบาย และไอคอน ดังที่ปรากฏในตัวอย่างต่อไปนี้
Kotlin
override fun onCreateGuidance(savedInstanceState: Bundle?): GuidanceStylist.Guidance { return GuidanceStylist.Guidance( getString(R.string.guidedstep_first_title), getString(R.string.guidedstep_first_description), getString(R.string.guidedstep_first_breadcrumb), activity.getDrawable(R.drawable.guidedstep_main_icon_1) ) }
Java
@Override public GuidanceStylist.Guidance onCreateGuidance(Bundle savedInstanceState) { String title = getString(R.string.guidedstep_first_title); String breadcrumb = getString(R.string.guidedstep_first_breadcrumb); String description = getString(R.string.guidedstep_first_description); Drawable icon = getActivity().getDrawable(R.drawable.guidedstep_main_icon_1); return new GuidanceStylist.Guidance(title, description, breadcrumb, icon); }
เพิ่มคลาสย่อย GuidedStepSupportFragment
ตามต้องการ
กิจกรรมโดยการโทร
วันที่ GuidedStepSupportFragment.add()
ในเมธอด onCreate()
ของกิจกรรม
หากกิจกรรมมีเฉพาะ GuidedStepSupportFragment
ออบเจ็กต์ ให้ใช้GuidedStepSupportFragment.addAsRoot()
แทน add()
เพื่อเพิ่ม GuidedStepSupportFragment
แรก การใช้
addAsRoot()
ช่วยให้มั่นใจได้ว่าหากผู้ใช้กดปุ่มย้อนกลับบนรีโมตทีวีขณะดู
GuidedStepSupportFragment
แรก ทั้ง
GuidedStepSupportFragment
และกิจกรรมของผู้ปกครองปิดลง
หมายเหตุ: เพิ่ม
GuidedStepSupportFragment
ออบเจ็กต์แบบเป็นโปรแกรม
ไม่อยู่ในไฟล์ XML เลย์เอาต์ของคุณ
สร้างและจัดการการดำเนินการของผู้ใช้
เพิ่มการดำเนินการของผู้ใช้โดยการลบล้าง
onCreateActions()
ในการลบล้าง ให้เพิ่ม GuidedAction
ใหม่สําหรับแต่ละรายการ
และระบุสตริงการดำเนินการ คำอธิบาย และรหัส ใช้
GuidedAction.Builder
เพื่อเพิ่มการดำเนินการใหม่
Kotlin
override fun onCreateActions(actions: MutableList<GuidedAction>, savedInstanceState: Bundle?) { super.onCreateActions(actions, savedInstanceState) // Add "Continue" user action for this step actions.add(GuidedAction.Builder() .id(CONTINUE) .title(getString(R.string.guidedstep_continue)) .description(getString(R.string.guidedstep_letsdoit)) .hasNext(true) .build()) ...
Java
@Override public void onCreateActions(List<GuidedAction> actions, Bundle savedInstanceState) { // Add "Continue" user action for this step actions.add(new GuidedAction.Builder() .id(CONTINUE) .title(getString(R.string.guidedstep_continue)) .description(getString(R.string.guidedstep_letsdoit)) .hasNext(true) .build()); ...
การกระทำไม่ได้จำกัดเฉพาะการเลือกบรรทัดเดียว ต่อไปนี้คือประเภทอื่นๆ ของ การดำเนินการที่คุณสามารถสร้างได้:
-
เพิ่มการดำเนินการสำหรับป้ายกำกับข้อมูลเพื่อให้ข้อมูลเพิ่มเติมเกี่ยวกับตัวเลือกของผู้ใช้โดยการตั้งค่า
infoOnly(true)
เมื่อinfoOnly
เป็นจริง ผู้ใช้จะเลือกการดำเนินการไม่ได้ -
เพิ่มการดำเนินการกับข้อความที่แก้ไขได้โดยการตั้งค่า
editable(true)
เมื่อeditable
เป็นจริง ผู้ใช้สามารถป้อนข้อความในการดำเนินการที่เลือกโดยใช้ ระยะไกลหรือแป้นพิมพ์ที่เชื่อมต่อ ลบล้างonGuidedActionEditedAndProceed()
เพื่อรับข้อความที่แก้ไขที่ผู้ใช้ป้อน คุณยังลบล้างonGuidedActionEditCanceled()
ได้ด้วยเพื่อให้ทราบเมื่อผู้ใช้ยกเลิกการป้อนข้อมูล -
เพิ่มชุดการดำเนินการที่ทำงานเหมือนกับปุ่มตัวเลือกที่ตรวจสอบได้โดยใช้
checkSetId()
ด้วยค่ารหัสทั่วไปเพื่อจัดกลุ่มการดำเนินการเป็นชุด การดำเนินการทั้งหมดในรายการเดียวกันโดยใช้ รหัสชุดการตรวจสอบจะถือว่าลิงก์กัน เมื่อผู้ใช้เลือกการทำงานอย่างใดอย่างหนึ่งภายในชุดนั้น จะมีการเลือกไว้และการดำเนินการอื่นๆ ทั้งหมดจะถูกยกเลิกการเลือก -
เพิ่มการดำเนินการเลือกวันที่โดยใช้
GuidedDatePickerAction.Builder
แทนที่จะเป็นGuidedAction.Builder
ในonCreateActions()
ลบล้างonGuidedActionEditedAndProceed()
เพื่อรับค่าวันที่ที่แก้ไขที่ผู้ใช้ป้อน - เพิ่มการกระทําที่ใช้การกระทําย่อยเพื่อให้ผู้ใช้เลือกจากรายการเพิ่มเติม ตัวเลือกทั้งหมด คำอธิบายย่อยมีอธิบายไว้ในส่วนเพิ่มการดำเนินการย่อย
- เพิ่มการทำงานของปุ่มที่ปรากฏทางด้านขวาของรายการการทำงานและทำได้อย่างง่ายดาย สามารถเข้าถึงได้ การทำงานของปุ่มจะอธิบายไว้ในปุ่มเพิ่ม การดำเนินการ
คุณยังเพิ่มสัญญาณบอกสถานะซึ่งมองเห็นได้ว่าการเลือกการทำงาน
ไปสู่ขั้นตอนใหม่โดย
hasNext(true)
สำหรับแอตทริบิวต์ต่างๆ ทั้งหมดที่คุณสามารถตั้งค่า โปรดดู
GuidedAction
หากต้องการตอบกลับการดำเนินการ ให้ลบล้าง
onGuidedActionClicked()
และประมวลผลการส่งผ่าน
GuidedAction
ค้นหาการดำเนินการที่เลือกตาม
กำลังตรวจสอบ GuidedAction.getId()
เพิ่มการกระทำย่อย
การทำงานบางอย่างอาจกำหนดให้คุณต้องให้ตัวเลือกชุดเพิ่มเติมแก่ผู้ใช้ ต
GuidedAction
สามารถระบุรายการของ
การดำเนินการย่อยที่แสดงเป็นเมนูการดำเนินการย่อย
![](https://developer.android.com/static/images/training/tv/playback/guided-step-subaction.png?authuser=0000&hl=th)
รูปที่ 2 การดำเนินการย่อยที่แนะนำ
รายการการดำเนินการย่อยอาจมีการทำงานปกติหรือการทำงานของปุ่มตัวเลือก แต่ ไม่ใช่การทำงานของเครื่องมือเลือกวันที่หรือข้อความที่แก้ไขได้ และการกระทำย่อยต้องไม่เป็นของตัวเอง ชุดของการกระทำย่อย เนื่องจากระบบไม่สนับสนุนระดับของการกระทำย่อยมากกว่าหนึ่งระดับ
หากต้องการเพิ่มการดำเนินการย่อย ให้สร้างและป้อนข้อมูลรายการ
GuidedAction
ออบเจ็กต์ที่ทำหน้าที่เป็นการกระทำย่อย ดังที่แสดงในตัวอย่างต่อไปนี้
Kotlin
subActions.add(GuidedAction.Builder() .id(SUBACTION1) .title(getString(R.string.guidedstep_subaction1_title)) .description(getString(R.string.guidedstep_subaction1_desc)) .build()) ...
Java
List<GuidedAction> subActions = new ArrayList<GuidedAction>(); subActions.add(new GuidedAction.Builder() .id(SUBACTION1) .title(getString(R.string.guidedstep_subaction1_title)) .description(getString(R.string.guidedstep_subaction1_desc)) .build()); ...
สร้างระดับบนสุดใน onCreateActions()
GuidedAction
ที่แสดง
รายการการกระทำย่อยเมื่อเลือก
Kotlin
... actions.add(GuidedAction.Builder() .id(SUBACTIONS) .title(getString(R.string.guidedstep_subactions_title)) .description(getString(R.string.guidedstep_subactions_desc)) .subActions(subActions) .build()) ...
Java
@Override public void onCreateActions(List<GuidedAction> actions, Bundle savedInstanceState) { ... actions.add(new GuidedAction.Builder() .id(SUBACTIONS) .title(getString(R.string.guidedstep_subactions_title)) .description(getString(R.string.guidedstep_subactions_desc)) .subActions(subActions) .build()); ... }
สุดท้าย ตอบกลับการเลือกการดำเนินการย่อยโดยการลบล้าง
onSubGuidedActionClicked()
:
Kotlin
override fun onSubGuidedActionClicked(action: GuidedAction): Boolean { // Check for which action was clicked and handle as needed when(action.id) { SUBACTION1 -> { // Subaction 1 selected } } // Return true to collapse the subactions menu or // false to keep the menu expanded return true }
Java
@Override public boolean onSubGuidedActionClicked(GuidedAction action) { // Check for which action was clicked and handle as needed if (action.getId() == SUBACTION1) { // Subaction 1 selected } // Return true to collapse the subactions menu or // false to keep the menu expanded return true; }
เพิ่มการทำงานของปุ่ม
หากขั้นตอนที่แนะนำมีรายการการดำเนินการจำนวนมาก ผู้ใช้อาจต้องเลื่อนดูในรายการ เพื่อเข้าถึงการดําเนินการที่ใช้บ่อยที่สุด ใช้การทำงานของปุ่มเพื่อแยก การดำเนินการที่ใช้กันโดยทั่วไปจากรายการ "การดำเนินการ" การทำงานของปุ่มจะปรากฏถัดจาก รายการการดำเนินการและไปยังส่วนต่างๆ ได้ง่าย
![](https://developer.android.com/static/images/training/tv/playback/guided-step-buttonaction.png?authuser=0000&hl=th)
รูปที่ 3 การทำงานของปุ่มขั้นตอนที่แนะนํา
การดำเนินการกับปุ่มจะสร้างขึ้นและจัดการเช่นเดียวกับการดำเนินการทั่วไป แต่คุณเป็นผู้สร้าง
การทำงานของปุ่มใน
onCreateButtonActions()
แทนที่จะเป็น onCreateActions()
ตอบสนองต่อการทำงานของปุ่มใน
onGuidedActionClicked()
ใช้การทำงานของปุ่มสำหรับการดำเนินการง่ายๆ เช่น การไปยังส่วนต่างๆ ระหว่างขั้นตอน ห้ามใช้การทำงานของเครื่องมือเลือกวันที่หรือการทำงานอื่นๆ ที่แก้ไขได้เป็นการทำงานของปุ่ม นอกจากนี้ การทำงานของปุ่มต้องไม่มีการกระทำย่อย
จัดกลุ่มขั้นตอนที่แนะนําเป็นลําดับที่มีคําแนะนํา
GuidedStepSupportFragment
แสดงถึงขั้นตอนเดียว หากต้องการสร้างลำดับขั้นตอนที่เรียงตามลำดับ ให้จัดกลุ่มหลายรายการ
GuidedStepSupportFragment
ออบเจ็กต์รวมกันโดยใช้
เพิ่ม GuidedStepSupportFragment.add()
ขั้นตอนถัดไปในลำดับไปยังชุดแฟรกเมนต์
Kotlin
override fun onGuidedActionClicked(action: GuidedAction) { val fm = fragmentManager when(action.id) { CONTINUE -> GuidedStepSupportFragment.add(fm, SecondStepFragment()) } }
Java
@Override public void onGuidedActionClicked(GuidedAction action) { FragmentManager fm = getFragmentManager(); if (action.getId() == CONTINUE) { GuidedStepSupportFragment.add(fm, new SecondStepFragment()); } ...
หากผู้ใช้กดปุ่มย้อนกลับบนรีโมตทีวี อุปกรณ์จะแสดง
GuidedStepSupportFragment
บนแฟรกเมนต์สแต็ก หากคุณ
ให้ GuidedAction
ของคุณเองซึ่ง
กลับไปยังขั้นตอนก่อนหน้า คุณสามารถใช้ลักษณะการทำงาน "ย้อนกลับ" ได้โดยเรียกใช้
getFragmentManager().popBackStack()
หากต้องการให้ผู้ใช้ไปยังขั้นตอนก่อนหน้าในลำดับ ให้ใช้
popBackStackToGuidedStepSupportFragment()
เพื่อกลับไปยัง GuidedStepSupportFragment
ที่เฉพาะเจาะจงในกลุ่ม Fragment
เมื่อผู้ใช้ทำขั้นตอนสุดท้ายในลำดับเสร็จ ให้ใช้
finishGuidedStepSupportFragments()
เพื่อนำออกทั้งหมด
อินสแตนซ์ GuidedStepSupportFragment
รายการ
จากสแต็กปัจจุบันและกลับไปยังกิจกรรมระดับบนสุด หาก
เพิ่ม GuidedStepSupportFragment
แรกแล้ว
กำลังใช้ addAsRoot()
กำลังโทร
finishGuidedStepSupportFragments()
จะปิดกิจกรรมของผู้ปกครองด้วย
ปรับแต่งการนำเสนอขั้นตอน
ชั้นเรียน GuidedStepSupportFragment
สามารถใช้ตัวเลือกที่กำหนดเอง
ธีมที่ควบคุมแง่มุมต่างๆ ของการนำเสนอ เช่น การจัดรูปแบบข้อความชื่อหรือการเปลี่ยนขั้นตอน
ภาพเคลื่อนไหว ธีมที่กำหนดเองต้องรับค่าจาก
Theme_Leanback_GuidedStep
และให้
การลบล้างค่าสำหรับแอตทริบิวต์ที่กำหนดไว้ใน
GuidanceStylist
และ
GuidedActionsStylist
หากต้องการใช้ธีมที่กำหนดเองกับ GuidedStepSupportFragment
ทำสิ่งใดสิ่งหนึ่งต่อไปนี้
-
ใช้ธีมกับกิจกรรมระดับบนสุดโดยตั้งค่าแอตทริบิวต์
android:theme
เป็น ในไฟล์ Manifest ของ Android การตั้งค่าแอตทริบิวต์นี้จะใช้ธีมกับผู้เผยแพร่โฆษณาย่อยทั้งหมด และเป็นวิธีที่ง่ายที่สุดในการใช้ธีมที่กำหนดเอง หากกิจกรรมหลักมีเพียง ออบเจ็กต์GuidedStepSupportFragment
รายการ -
หากกิจกรรมใช้ธีมที่กำหนดเองอยู่แล้วและคุณไม่ต้องการใช้ธีมดังกล่าว
GuidedStepSupportFragment
สไตล์ไปยังมุมมองอื่นๆ ในกิจกรรม เพิ่มLeanbackGuidedStepTheme_guidedStepTheme
ลงในธีมกิจกรรมที่กำหนดเองที่มีอยู่ แอตทริบิวต์นี้ชี้ไปยังธีมที่กำหนดเองซึ่ง เฉพาะออบเจ็กต์GuidedStepSupportFragment
รายการใน การใช้กิจกรรม -
หากคุณใช้
GuidedStepSupportFragment
ออบเจ็กต์ในที่ต่างๆ ที่เป็นส่วนหนึ่งของงานแบบหลายขั้นตอนโดยรวม และต้องการใช้ ธีมภาพในทุกขั้นตอน ลบล้างGuidedStepSupportFragment.onProvideTheme()
แล้วส่งคืนธีมที่กำหนดเอง
ดูข้อมูลเพิ่มเติมเกี่ยวกับวิธีเพิ่มสไตล์และธีมได้ที่ สไตล์และธีม
ชั้นเรียน GuidedStepSupportFragment
ใช้แบบพิเศษ
คลาสสไตลิสต์เพื่อเข้าถึงและใช้แอตทริบิวต์ของธีม
ชั้นเรียน GuidanceStylist
ใช้ข้อมูลธีม
เพื่อควบคุมการนำเสนอมุมมองคำแนะนำด้านซ้าย ขณะที่
ชั้นเรียน GuidedActionsStylist
ใช้ข้อมูลธีม
เพื่อควบคุมการนำเสนอมุมมองการดำเนินการที่เหมาะสม
หากต้องการปรับแต่งสไตล์ภาพของขั้นตอนต่างๆ นอกเหนือจากการปรับแต่งธีมที่มีให้ คลาสย่อย
GuidanceStylist
หรือ
GuidedActionsStylist
และส่งคืนคลาสย่อยใน
GuidedStepSupportFragment.onCreateGuidanceStylist()
หรือ
GuidedStepSupportFragment.onCreateActionsStylist()
สำหรับรายละเอียดเกี่ยวกับสิ่งที่คุณปรับแต่งได้ในคลาสย่อยเหล่านี้ โปรดดูเอกสารประกอบที่
GuidanceStylist
และ
GuidedActionsStylist