단계별 안내 추가

Compose를 사용하여 더 효과적으로 빌드
Android TV OS용 Jetpack Compose를 사용하여 최소한의 코드로 멋진 UI를 만드세요.
<ph type="x-smartling-placeholder"></ph> TV용 Compose → 를 통해 개인정보처리방침을 정의할 수 있습니다.

애플리케이션에는 사용자가 여러 단계로 수행해야 할 작업이 있을 수 있습니다. 예를 들어 앱이 추가 콘텐츠 구매, 복잡한 구성 설정 설정 또는 의사 결정을 내리는 데 도움이 됩니다 이러한 모든 작업을 수행하려면 사용자에게 주문한 항목을 하나 이상 도움이 됩니다.

androidx.leanback 라이브러리는 다단계 사용자 작업을 구현하는 클래스를 제공합니다. 이 페이지 인코더-디코더 아키텍처를 GuidedStepSupportFragment 클래스 를 사용하여 사용자가 작업을 수행하기 위한 일련의 결정을 안내할 수 있도록 합니다. GuidedStepSupportFragment TV UI 권장사항을 사용하여 TV 기기에서 여러 단계의 작업을 쉽게 이해하고 탐색할 수 있도록 합니다.

단계 세부정보 제공

GuidedStepSupportFragment는 계열의 단일 단계를 나타냅니다. 단계를 거칩니다. 시각적으로는 안내 뷰와 함께 단계에 대해 가능한 작업 또는 결정의 목록입니다.

그림 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)
    )
}

자바

@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()는 사용자가 시청할 때 TV 리모컨의 뒤로 버튼을 누르는지 확인하는 데 도움이 됩니다. 첫 번째 GuidedStepSupportFragment, GuidedStepSupportFragment 및 상위 활동이 닫힙니다.

참고: GuidedStepSupportFragment 객체를 프로그래매틱 방식으로 찾을 수 없습니다.

사용자 작업 생성 및 처리

재정의를 통해 사용자 작업 추가 onCreateActions() 재정의에서 각각에 새 GuidedAction를 추가합니다. 작업 항목을 검색하고 작업 문자열, 설명, ID를 제공하세요. 사용 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())
    ...

자바

@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가 true이면 사용자가 작업을 선택할 수 없습니다.
  • 설정을 통해 수정 가능한 텍스트 작업을 추가합니다. editable(true) editable가 true인 경우 사용자는 키보드로 조작할 수 있습니다. 재정의 onGuidedActionEditedAndProceed(): 사용자가 입력한 수정된 텍스트를 가져옵니다. onGuidedActionEditCanceled()를 재정의하여 사용자가 입력을 취소한 시점도 알 수 있습니다.
  • 다음을 사용하여 선택 가능한 라디오 버튼처럼 작동하는 일련의 작업을 추가합니다. checkSetId() 를 사용하여 작업을 세트로 그룹화합니다. 동일한 목록에 있는 모든 작업이 선택된 ID는 연결된 것으로 간주됩니다. 사용자가 그 집합 내에서 작업 중 하나를 선택하면 작업이 선택되고 다른 모든 작업은 선택 해제됩니다.
  • 다음을 사용하여 날짜 선택기 작업을 추가합니다. GuidedDatePickerAction.Builder 를 onCreateActions()에서 GuidedAction.Builder 재정의 onGuidedActionEditedAndProceed(): 사용자가 입력한 수정된 날짜 값을 가져옵니다.
  • 사용자가 확장된 목록에서 선택할 수 있도록 하위 작업을 사용하는 작업을 추가합니다. 선택할 수 있습니다 하위 작업은 하위 작업 추가 섹션에 설명되어 있습니다.
  • 작업 목록의 오른쪽에 표시되는 버튼 작업을 쉽게 추가할 수 있습니다. 있습니다. 버튼 작업은 추가 버튼에 설명되어 있습니다. 작업 섹션을 참조하세요.

작업을 선택하는 것을 나타내는 시각적 표시기를 추가할 수도 있습니다. 새로운 단계로 이어집니다. hasNext(true)

설정할 수 있는 다른 모든 속성에 대해서는 다음을 참조하세요. GuidedAction

작업에 응답하려면 재정의하세요. onGuidedActionClicked(): 전달된 GuidedAction입니다. 다음을 통해 선택한 작업을 식별합니다. GuidedAction.getId() 검사 중입니다.

하위 작업 추가

일부 작업의 경우 사용자에게 추가 선택 옵션을 제공해야 할 수 있습니다. 가 GuidedAction는 하위 작업 메뉴로 표시되는 하위 작업입니다.

그림 2. 단계별 안내의 하위 작업

하위 작업 목록에는 일반 작업이나 라디오 버튼 작업이 포함될 수 있지만 날짜 선택기나 편집 가능한 텍스트 작업이 아닙니다. 또한 하위 액션은 이는 시스템에서 둘 이상의 하위 작업 수준을 지원하지 않기 때문입니다.

하위 액션을 추가하려면 먼저 다음 예와 같이 하위 작업 역할을 하는 GuidedAction 객체

Kotlin

subActions.add(GuidedAction.Builder()
        .id(SUBACTION1)
        .title(getString(R.string.guidedstep_subaction1_title))
        .description(getString(R.string.guidedstep_subaction1_desc))
        .build())
...

자바

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())
    ...

자바

@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
}

자바

@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;
}

버튼 작업 추가

단계별 작업에 포함된 작업 목록이 많으면 사용자가 목록을 스크롤해야 할 수도 있습니다. 클릭하여 가장 흔히 사용되는 작업에 액세스할 수 있습니다. 버튼 작업을 사용하여 분리 작업 목록에서 자주 사용하는 작업을 찾을 수 있습니다. 버튼 작업은 쉽게 탐색할 수 있습니다.

그림 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())
    }
}

자바

@Override
public void onGuidedActionClicked(GuidedAction action) {
    FragmentManager fm = getFragmentManager();
    if (action.getId() == CONTINUE) {
       GuidedStepSupportFragment.add(fm, new SecondStepFragment());
    }
...

사용자가 TV 리모컨의 뒤로 버튼을 누르면 기기에 이전 프래그먼트 스택의 GuidedStepSupportFragment 만약 자체 GuidedAction 제공 이전 단계로 돌아가면 getFragmentManager().popBackStack()입니다. 사용자를 시퀀스의 더 이전 단계로 돌아가야 하는 경우 popBackStackToGuidedStepSupportFragment() 프래그먼트 스택의 특정 GuidedStepSupportFragment로 반환됩니다.

사용자가 시퀀스의 마지막 단계를 완료하면 모두 삭제하려면 finishGuidedStepSupportFragments()하세요 인스턴스 GuidedStepSupportFragment개 원래 상위 활동으로 돌아갑니다. 만약 첫 GuidedStepSupportFragment이(가) 추가됨 addAsRoot() 사용, 통화 finishGuidedStepSupportFragments()는 상위 활동도 닫습니다.

단계 프레젠테이션 맞춤설정

GuidedStepSupportFragment 클래스는 커스텀 제목 텍스트 서식 지정 또는 단계 전환과 같은 프레젠테이션 측면을 제어하는 테마 있습니다. 맞춤 테마는 다음에서 상속받아야 합니다. Theme_Leanback_GuidedStep하고 다음을 제공할 수 있습니다. 에 정의된 속성의 값 재정의 GuidanceStylist 및 GuidedActionsStylist입니다.

GuidedStepSupportFragment에 맞춤 테마를 적용하려면 다음 단계를 따르세요. 다음 중 하나를 수행합니다.

  • android:theme 속성을 액티비티 요소를 정의합니다. 이 속성을 설정하면 테마가 모든 하위 요소에 적용됩니다. 이는 상위 활동에 GuidedStepSupportFragment 객체.
  • 활동에 이미 맞춤 테마가 사용되고 있으며 이를 적용하고 싶지 않은 경우 GuidedStepSupportFragment 스타일을 활동의 다른 뷰에 적용 LeanbackGuidedStepTheme_guidedStepTheme 추가 속성을 추가합니다. 이 속성은 GuidedStepSupportFragment 객체만 있습니다.
  • 여러 Google Cloud 제품에서 GuidedStepSupportFragment 객체를 전체 다단계 작업을 일관성 있게 사용하고 싶은 모든 단계의 시각적 테마, 재정의 GuidedStepSupportFragment.onProvideTheme()하고 맞춤 테마를 반환합니다.

스타일과 테마를 추가하는 방법에 대한 자세한 내용은 다음을 참고하세요. 스타일 및 테마.

GuidedStepSupportFragment 클래스는 스타일리스트 클래스를 사용하여 테마 속성에 액세스하고 이를 적용할 수 있습니다. GuidanceStylist 클래스는 테마 정보를 사용합니다. 왼쪽 안내 보기의 표시를 제어하고, GuidedActionsStylist 클래스가 테마 정보를 사용함 올바른 작업 뷰의 표시를 제어할 수 있습니다.

테마 맞춤설정에서 제공하는 것 이상으로 단계의 시각적 스타일을 맞춤설정하려면 GuidanceStylist 또는 GuidedActionsStylist에서 서브클래스를 반환 GuidedStepSupportFragment.onCreateGuidanceStylist() 또는 GuidedStepSupportFragment.onCreateActionsStylist()입니다. 이러한 서브클래스에서 맞춤설정할 수 있는 항목에 관한 자세한 내용은 GuidanceStylist 및 GuidedActionsStylist입니다.

이전
처음 사용하는 사용자에게 앱 소개
다음
앰비언트 모드