向初次使用的用户介绍您的应用

使用 Compose 构建更出色的应用
使用适用于 Android TV OS 的 Jetpack Compose,只需极少的代码即可创建精美的界面。
<ph type="x-smartling-placeholder"></ph> Compose for TV →

要向初次使用的用户展示如何充分利用您的应用,请向其 应用启动时的新手入门信息。下面是一些新手入门示例 信息:

  • 提供关于用户可观看的频道的详细信息 用户首次访问频道应用。
  • 提醒用户关注您的应用中值得注意的功能。
  • 说明 。

androidx.leanback 库提供 OnboardingSupportFragment 类 来展示初次使用的用户信息本指南将介绍如何使用 要演示的 OnboardingSupportFragment 门课程 应用首次启动时显示的介绍信息 。

OnboardingSupportFragment 使用 TV 界面 以符合 TV 界面样式的方式呈现信息的最佳实践 在电视设备上易于导航。

图 1. 示例 OnboardingSupportFragment

OnboardingSupportFragment 并非适用于所有用例。 如果必须添加,请勿使用 OnboardingSupportFragment 需要用户输入的界面元素,例如按钮和字段。 此外,请勿将 OnboardingSupportFragment 用于用户会执行的任务 。最后,如果您需要呈现一个 请考虑使用 GuidedStepSupportFragment

添加 OnboardingSupportFragment

添加 OnboardingSupportFragment 实现一个类,用于扩展 OnboardingSupportFragment 类。将 将此 fragment 与 activity 相关联(使用 activity 的布局 XML 或 以编程方式请确保 activity 或 fragment 使用派生自 Theme_Leanback_Onboarding, 如自定义主题背景部分中所述。

onCreate() 调用 startActivity() 具有一个指向Intent OnboardingSupportFragment 的父级 activity。 这有助于确保您的 “OnboardingSupportFragment”显示为 应用启动后就开始计时

为了确保 OnboardingSupportFragment 只会显示 当用户首次启动您的应用时,使用 SharedPreferences 个对象 来跟踪用户已经查看了 OnboardingSupportFragment。定义布尔值 在用户观看完 OnboardingSupportFragment。查看 该值在您的主 activity 的 onCreate() 方法,并且仅启动 OnboardingSupportFragment 项家长活动(如果 则值为 false。

以下示例展示了 onCreate() 的替换方法,用于检查 SharedPreferences 值,如果未设置为 true,则调用 startActivity() 以显示 OnboardingSupportFragment

Kotlin

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_main)
    PreferenceManager.getDefaultSharedPreferences(this).apply {
        // Check if we need to display our OnboardingSupportFragment
        if (!getBoolean(MyOnboardingSupportFragment.COMPLETED_ONBOARDING_PREF_NAME, false)) {
            // The user hasn't seen the OnboardingSupportFragment yet, so show it
            startActivity(Intent(this@OnboardingActivity, OnboardingActivity::class.java))
        }
    }
}

Java

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    SharedPreferences sharedPreferences =
            PreferenceManager.getDefaultSharedPreferences(this);
    // Check if we need to display our OnboardingSupportFragment
    if (!sharedPreferences.getBoolean(
            MyOnboardingSupportFragment.COMPLETED_ONBOARDING_PREF_NAME, false)) {
        // The user hasn't seen the OnboardingSupportFragment yet, so show it
        startActivity(new Intent(this, OnboardingActivity.class));
    }
}

在用户查看 OnboardingSupportFragment,将其标记为已查看 使用 SharedPreferences 对象。为此,请替换 onFinishFragment() 在您的OnboardingSupportFragment中,并设置您的SharedPreferences 值为 true,如以下示例所示:

Kotlin

override fun onFinishFragment() {
    super.onFinishFragment()
    // User has seen OnboardingSupportFragment, so mark our SharedPreferences
    // flag as completed so that we don't show our OnboardingSupportFragment
    // the next time the user launches the app
    PreferenceManager.getDefaultSharedPreferences(context).edit().apply {
        putBoolean(COMPLETED_ONBOARDING_PREF_NAME, true)
        apply()
    }
}

Java

@Override
protected void onFinishFragment() {
    super.onFinishFragment();
    // User has seen OnboardingSupportFragment, so mark our SharedPreferences
    // flag as completed so that we don't show our OnboardingSupportFragment
    // the next time the user launches the app
    SharedPreferences.Editor sharedPreferencesEditor =
            PreferenceManager.getDefaultSharedPreferences(getContext()).edit();
    sharedPreferencesEditor.putBoolean(
            COMPLETED_ONBOARDING_PREF_NAME, true);
    sharedPreferencesEditor.apply();
}

添加 OnboardingSupportFragment 页面

OnboardingSupportFragment 在一系列有序的页面中显示内容。添加 OnboardingSupportFragment,您需要定义 引导页每个网页可以有标题、说明以及 可包含图像或动画的多个子视图。

图 2. OnboardingSupportFragment 页面元素。

图 2 显示了示例页面,其中包含标注为可自定义页面的标注 您的 OnboardingSupportFragment 能提供哪些优势页面元素包括:

  1. 页面标题。
  2. 页面说明。
  3. 网页内容视图,本例中是一个简单的绿色对勾标记,并显示在灰色方框中。 此视图是可选的。此视图可用于展示网页详细信息。例如,您可以 提供一张屏幕截图,其中突出显示了该页面所介绍的应用功能。
  4. 页面背景视图,本例中为一个简单的蓝色渐变背景。此视图 始终呈现在页面上其他视图的后面。此视图是可选的。
  5. 页面前景视图,本例中为一个徽标。此视图始终会呈现 展示在页面上所有其他视图的前面。此视图是可选的。

在以下情况下,初始化页面信息: OnboardingSupportFragment 是首次创建 或附加到父 activity 中,就像系统请求页面一样 信息。您可以初始化页面 或替换 onAttach()

替换以下每种方法(这些方法提供网页信息) 发送到系统:

替换以下每种方法以提供可选子视图 显示图像或动画:

  • onCreateBackgroundView() 会返回一个 View,你 create 来充当背景视图;如果不需要背景视图,则返回 null。
  • onCreateContentView() 会返回一个 View,你 create 来充当内容视图,如果不需要内容视图,则返回 null。
  • onCreateForegroundView() 会返回一个 View,你 create 来充当前景视图,如果不需要前景视图,则返回 null。

系统会将您创建的 View 添加到页面中 布局。以下示例将替换 onCreateContentView() 并返回 ImageView

Kotlin

private lateinit var contentView: ImageView
...
override fun onCreateContentView(inflater: LayoutInflater?, container: ViewGroup?): View? {
    return ImageView(context).apply {
        scaleType = ImageView.ScaleType.CENTER_INSIDE
        setImageResource(R.drawable.onboarding_content_view)
        setPadding(0, 32, 0, 32)
        contentView = this
    }
}

Java

private ImageView contentView;
...
@Override
protected View onCreateContentView(LayoutInflater inflater, ViewGroup container) {
    contentView = new ImageView(getContext());
    contentView.setScaleType(ImageView.ScaleType.CENTER_INSIDE);
    contentView.setImageResource(R.drawable.onboarding_content_view);
    contentView.setPadding(0, 32, 0, 32);
    return contentView;
}

添加初始徽标屏幕

您的OnboardingSupportFragment可以开始了 屏幕上有一个可选的徽标屏幕,用来介绍您的应用。如果您想展示 Drawable 作为徽标屏幕,调用 setLogoResourceId() (使用您的Drawable的 ID) 在 onCreate() 方法中 OnboardingSupportFragment。 系统会淡入,并短暂显示 Drawable,然后淡出 Drawable 然后再显示 OnboardingSupportFragment 的第一页。

如果您想为徽标屏幕提供自定义动画,而不是 调用 setLogoResourceId(),覆盖 onCreateLogoAnimation() 并返回 Animator 对象,如下例所示:

Kotlin

public override fun onCreateLogoAnimation(): Animator =
        AnimatorInflater.loadAnimator(context, R.animator.onboarding_logo_screen_animation)

Java

@Override
public Animator onCreateLogoAnimation() {
    return AnimatorInflater.loadAnimator(getContext(),
            R.animator.onboarding_logo_screen_animation);
}

自定义页面动画

在显示您的网页的第一页时,系统会使用默认动画 OnboardingSupportFragment,以及 会转到其他网页。你可以自定义这些动画 覆盖方法(位于 OnboardingSupportFragment

要自定义显示在第一页的动画,请执行以下操作: 覆盖 onCreateEnterAnimation() 并返回 Animator。 以下示例会创建一个可缩放内容视图的 Animator 水平:

Kotlin

override fun onCreateEnterAnimation(): Animator =
    ObjectAnimator.ofFloat(contentView, View.SCALE_X, 0.2f, 1.0f)
            .setDuration(ANIMATION_DURATION)

Java

@Override
protected Animator onCreateEnterAnimation() {
    Animator startAnimator = ObjectAnimator.ofFloat(contentView,
            View.SCALE_X, 0.2f, 1.0f).setDuration(ANIMATION_DURATION);
    return startAnimator;
}

如需自定义用户导航到其他页面时使用的动画,请执行以下操作: 覆盖 onPageChanged()。 在 onPageChanged() 方法中,创建 Animator 对象 移除上一页并显示下一页,请将这些内容添加到 AnimatorSet,然后演奏这组乐曲。以下 使用淡出动画移除上一页,更新 内容视图图片,并使用淡入动画显示下一页:

Kotlin

override fun onPageChanged(newPage: Int, previousPage: Int) {
    // Create a fade-out animation for previousPage and, once
    // done, swap the contentView image with the next page's image
    val fadeOut = ObjectAnimator.ofFloat(mContentView, View.ALPHA, 1.0f, 0.0f)
            .setDuration(ANIMATION_DURATION)
            .apply {
                addListener(object : AnimatorListenerAdapter() {

                    override fun onAnimationEnd(animation: Animator) {
                        mContentView.setImageResource(pageImages[newPage])
                    }
                })
            }
    // Create a fade-in animation for nextPage
    val fadeIn = ObjectAnimator.ofFloat(mContentView, View.ALPHA, 0.0f, 1.0f)
            .setDuration(ANIMATION_DURATION)
    // Create AnimatorSet with fade-out and fade-in animators and start it
    AnimatorSet().apply {
        playSequentially(fadeOut, fadeIn)
        start()
    }
}

Java

@Override
protected void onPageChanged(final int newPage, int previousPage) {
    // Create a fade-out animation for previousPage and, once
    // done, swap the contentView image with the next page's image
    Animator fadeOut = ObjectAnimator.ofFloat(mContentView,
            View.ALPHA, 1.0f, 0.0f).setDuration(ANIMATION_DURATION);
    fadeOut.addListener(new AnimatorListenerAdapter() {
        @Override
        public void onAnimationEnd(Animator animation) {
            mContentView.setImageResource(pageImages[newPage]);
        }
    });
    // Create a fade-in animation for nextPage
    Animator fadeIn = ObjectAnimator.ofFloat(mContentView,
            View.ALPHA, 0.0f, 1.0f).setDuration(ANIMATION_DURATION);
    // Create AnimatorSet with fade-out and fade-in animators and start it
    AnimatorSet set = new AnimatorSet();
    set.playSequentially(fadeOut, fadeIn);
    set.start();
}

如需详细了解如何创建 Animator 对象和 AnimatorSet 对象,请参阅 <ph type="x-smartling-placeholder"></ph> 属性动画概览

自定义主题

任何OnboardingSupportFragment 必须使用 Theme_Leanback_Onboarding主题 或从 Theme_Leanback_Onboarding 继承的主题。将 执行以下操作之一,为您的 OnboardingSupportFragment 配置主题背景:

  • 设置 OnboardingSupportFragment 的父 activity,以使用 所需的主题。以下示例展示了如何设置要使用的 activity Theme_Leanback_Onboarding
    <activity
       android:name=".OnboardingActivity"
       android:enabled="true"
       android:exported="true"
       android:theme="@style/Theme.Leanback.Onboarding">
    </activity>
    
  • 使用 LeanbackOnboardingTheme_onboardingTheme 属性。将此属性指向另一个 自定义主题,只有 OnboardingSupportFragment 对象。如果您的 activity 已在使用 而您又不想应用 将 OnboardingSupportFragment 个样式更改为其他样式 activity 中的视图。
  • 替换 onProvideTheme() 并返回所需的主题。如果您遇到以下情况,请使用此方法 有多个活动使用您的 OnboardingSupportFragment 或者父 activity 无法使用所需的主题。 以下示例会替换 onProvideTheme() 并返回 Theme_Leanback_Onboarding

    Kotlin

    override fun onProvideTheme(): Int = R.style.Theme_Leanback_Onboarding
    

    Java

    @Override
    public int onProvideTheme() {
       return R.style.Theme_Leanback_Onboarding;
    }