Android Jetpack - Android TV 应用开

2019-01-28 本文已影响22人 Android架构

Android TV 应用开发介绍

目前，我们还没有足够的Android TV应用开发介绍。在本系列教程中，我将介绍如何开发Android TV应用程序。
这篇文章的目的是了解Android“TV”特定的代码实现，特别是关注UI实现。

因为UI是Android手机应用和Android TV应用之间最大的区别之一。我们需要使UI适合电视使用，例如我们应该制作一个应用程序，以便我们可以使用↑↓→←方向键导航应用程序，而不是触摸板导航。因为用户使用遥控器，并且不能用电视机使用“触摸屏”功能。为了实现这一要求，Android开源项目正在提供Leanback支持库（android.support.v17.leanback），以便开发人员可以轻松实现满足这些要求的UI，从而适合电视使用。本教程主要讲述了Leanback库的用法。

这个帖子的目标是那些谁:

之前开发过Android应用，但不熟悉Android TV应用。
开发者 - 中级

Google从2015年底对Eclipse不再支持，所以请用Android studio用于IDE开发Android TV应用程序（如果你还没有使用，请下载并安装Android studio）。请注意，这里介绍的大部分代码来自AOSP android TV示例源代码leanback。本教程基本上只是这个示例源代码的详细说明。让我们开始。

开始编写一个Android TV 应用

1.打开Android studio

New Project

应用名称： AndroidTVappTutoria

指定Android设备

将activity添加到电视

选择“Add No Activity”并完成

Android studio会自动生成源代码。

此阶段的源代码上传到github。

2.添加activity

首先，让我们开展活动。右键单击“com.corochann.androidtvapptutorial”，然后选择

New -> Activity -> Blank activity

点击 “Launcher Activity”。

我将从空白活动开始，名为“MainActivity”。该Activity继承Activity，而不是AppCompatActivity。

Android studio现在生成2个文件，Java class＆layout / activity_main.xml。（我们不使用res / menu / menu_main.xml）

*注意：我们还发现有一个 “Android TV activity”选项。当选择它时，它将同时创建太多的文件。这是一个非常有用的参考，但很难理解每个文件处理什么样的功能。所以我将在这篇文章中从头开始创建这些文件，以便我们能够理解每块代码的责任。这篇文章中的许多实现都是引用这个官方的示例程序。
接下来，我们要通过创建MainFragment来设计MainActivity的UI。

3.添加 fragment

右键单击包名称（在我这里是com.corochann.androidtvapptutorial）
New -> Java Class -> Name: MainFragment
*除了上述过程，如果我们选择New - > Fragment - > Blank fragment，请取消选中“Create layout XML？”，不取消的话会创建太多的样例代码。
首先，修改activity_main.xml，如下所示，只显示mainfragment。

<?xml version="1.0" encoding="utf-8"?>
<fragment xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/main_browse_fragment"
    android:name="com.corochann.androidtvapptutorial.MainFragment"
    android:layout_width="match_parent"
    android:layout_height="match_parent" 
    tools:context=".MainActivity" 
    tools:deviceIds="tv"
    tools:ignore="MergeRootFrame" />

然后，修改MainFragment如下。

我们将这个MainFragment作为BrowseFragment的子类。

BrowseFragment类由Android SDK Leanback库提供，它为Android TV应用程序创建了标准UI，我们将在本教程中看到。

package com.corochann.helloandroidtvfromscrach;

import android.os.Bundle;
import android.support.v17.leanback.app.BrowseFragment;
import android.util.Log;

public class MainFragment extends BrowseFragment {
    private static final String TAG = MainFragment.class.getSimpleName();

    @Override
    public void onActivityCreated(Bundle savedInstanceState) {
        Log.i(TAG, "onActivityCreated");
        super.onActivityCreated(savedInstanceState);

    }
}

4.修改Android Mainifest文件：

<?xml version="1.0" encoding="utf-8"?>
<manifest package="com.songwenju.androidtvapptutoria"
          xmlns:android="http://schemas.android.com/apk/res/android">

    <!-- TV app need to declare touchscreen not required -->
    <uses-feature
        android:name="android.hardware.touchscreen"
        android:required="false"/>

    <!--
     true:  your app runs on only TV
     false: your app runs on phone and TV -->
    <uses-feature
        android:name="android.software.leanback"
        android:required="true"/>

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:supportsRtl="true"
        android:theme="@style/Theme.Leanback">
        <activity
            android:name=".MainActivity"
            android:icon="@drawable/app_icon_your_company"
            android:label="@string/app_name"
            android:logo="@drawable/app_icon_your_company">
            <intent-filter>
                <action android:name="android.intent.action.MAIN"/>

                <category android:name="android.intent.category.LAUNCHER"/>
                <category android:name="android.intent.category.LEANBACK_LAUNCHER"/>
            </intent-filter>
        </activity>
    </application>

</manifest>

有以下几点注意事项：
1)这里要设置touchscreen为false，即TV app 不需要触摸。

<uses-feature
        android:name="android.hardware.touchscreen"
        android:required="false"/>

2)设置依赖leanback库相关。

<uses-feature
        android:name="android.software.leanback"
        android:required="true"/>

仅仅在TV上运行设置为true，在TV和phone上运行设置为false。
application的主题

<application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:supportsRtl="true"
        android:theme="@style/Theme.Leanback">

显示Activity icon 在普通桌面和Leanback桌面。在 intent-filter中声明。

  <category android:name="android.intent.category.LAUNCHER"/>
  <category android:name="android.intent.category.LEANBAC

同时添加icon和logo在activity的tag上，

 <activity
            android:name=".MainActivity"
            android:icon="@drawable/app_icon_your_company"
            android:label="@string/app_name"
            android:logo="@drawable/app_icon_your_company">
            ...

到此运行一下应用,运行结果如图：

可以看到BrowseFragment由HeadersFragment＆RowsFragment组成。
在这里，可以在右侧看到HeaderFragment（header）部分，在左侧看到RowsFragment（contents）部分。我们将在下面设计这个Header＆Row组合。

在此之前，让我们来实现这个应用程序的主要颜色和标题的UI。

5.在MainFragment.java上添加setupUIElements()

在MainFragment.java中添加setupUIElements（）方法，以设置应用程序信息。

 @Override
    public void onActivityCreated(Bundle savedInstanceState) {
        LogUtil.i(this,"MainFragment.onActivityCreated.");
        super.onActivityCreated(savedInstanceState);
        setupUIElements();

    }

    private void setupUIElements() {

//        setBadgeDrawable(getActivity()
//                .getResources()
//                .getDrawable(R.drawable.app_icon_your_company));//展示在标题栏上的图片(图片会隐藏标题)

        setTitle("Hello Android TV!");  //设置title

        //HEADERS_ENABLED 显示左侧导航栏，HEADERS_DISABLED 不显示 HEADERS_HIDDEN 隐藏，到边缘按左键还能显示
        setHeadersState(HEADERS_HIDDEN);
        setHeadersTransitionOnBackEnabled(true);

        // 设置快速导航（或 headers) 背景色
        setBrandColor(getResources().getColor(R.color.fastlane_background));
        // 设置搜索的颜色
        setSearchAffordanceColor(getResources().getColor(R.color.search_opaque));
    }

我们已经设置了

应用的title或者图标
左侧颜色

颜色信息是从colors.xml引用的，我们还没有提供。右键单击res / values并选择

新建 - >values资源文件
文件名：colors.xml - >“OK”

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="fastlane_background">#0096e6</color>
    <color name="search_opaque">#ffaa3f</color>
</resources>

运行之后可以看到颜色发生了变化。

你也可以使用setBadgeDrawable（）方法而不是setTitle（）方法，如果使用了setBadgeDrawable（），标题将更改为logo（见下图）。

【附录】

资料图

需要资料的朋友可以加入Android架构交流QQ群聊：513088520

点击链接加入群聊【Android移动架构总群】：加入群聊

获取免费学习视频，学习大纲另外还有像高级UI、性能优化、架构师课程、NDK、混合式开发（ReactNative+Weex）等Android高阶开发资料免费分享。