Introduction to Android TV Application Development

This article will introduce you to the development of a simple Android TV application. First of all, it is focused on those who have already had any experience in developing applications for Android, so I will not explain here what Activity, Fragments, etc. is.



On the Internet there is a lot of Russian-language information on the development of applications for Android and not a few articles on writing HelloWord for him. Interested in developing applications for Android TV, I immediately began to study this topic on English-language sites. To my surprise, the material was not so much, and I decided to see what is in Russian. I could not find anything in Russian (I was probably looking bad). In general, I intend to correct this situation.



Since the interface of applications for phones and Android TV has significant differences, we must create an application interface suitable for interaction on TV. For example, we should create applications with which we can interact using only the keys - ↑ ↓ → ←. In implementing such an interface, LeanbackSupport library can help us, making it quite easy to create a UI that will be convenient when working with applications on Android TV.

Creating a project in Android Studio

Running Android Studio, you need to create a new project. When creating, select the TV platform and specify the minimum version of the SDK. Android Studio will offer us to create an “Android TV Activity”, but at the moment we should choose “Add No Activity”, because if you choose to create an Activity, the AS will create a lot of classes and files that are initially harder to understand.

')

Creating an Activity

First you need to create a new XML file called activity_main.xml, which will contain markup for our Activity. We will change the markup code later.



Now you should create a class inherited from the Activity. To do this, create a new class called MainActivity and inherit it from the Activty class. Predefine the onCreate (Bundle SIS) method and set the content for the Activity from the generated markup file.

public class MainActivity extends Activity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); } } 

Activity declaration in the application manifest file

If you try to start the application at this stage, then it naturally will not start, since we have not announced a single Activity in the AndroidManifest.xml file.



Add the following code to the manifest file.

 <?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.simpletvapp"> <uses-feature android:name="android.hardware.touchscreen" android:required="false" /> <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.LEANBACK_LAUNCHER" /> </intent-filter> </activity> </application> </manifest> 

Now let's look at some points. Part of the code below disables the touch.

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

In this part, you specify that the application should run only on Android TV. If you are developing an application not only for TV, then you should set the value to false.

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

When declaring an Activity, we indicate in intent-filter that the Activity should run on Android TV.

 <category android:name=”android.intent.category.LEANBACK_LAUNCHER/> 

Creating a fragment

Now we need to create a Java class named MainFragment and inherit from the BrowseFragment class from the LeanbackSupport library. BrowseFragment allows you to create a standard Android TV application interface.



Now we can bind the created fragment to our Activity. To do this, put the following markup code in the Activity markup file (in my case, this activity_main.xml).

 <?xml version="1.0" encoding="utf-8"?> <fragment xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/main_browse_fragment" android:name="com.simpletvapp.MainFragment" android:layout_width="match_parent" android:layout_height="match_parent" /> 

Application launch

To run the application, you need to create an Android TV emulator. It can be created in Android Virtual Device Manager.



After creating the emulator, you can run our application on it. At the moment it has the following form.







Here you see an empty BrowseFragment. You can see the RowsFragment on the left side of the application (the fragment is responsible for displaying the list of headings) and HeaderFragment on the right side of the screen (responsible for displaying the content of headings).



Next, we fill in HeaderFragment, RowsFragment and consider them in more detail. Before this, set the primary UI colors and title for the application.

Setting the style of the application

Here I added the setupUI () method to MainFragment.java and called it in the predefined onActivityCreated method.

  @Override public void onActivityCreated(Bundle savedInstanceState) { super.onActivityCreated(savedInstanceState); setupUI(); } private void setupUI() { setTitle("Hello Android TV!"); int color = ContextCompat.getColor(getActivity(), R.color.fastlane_background); setBrandColor(color); } 

If you run the application at this stage, then you should see this UI.

Fill BrowseFragment

Let's first look at the example of the finished Android TV application content BrowseFragment. Each header on the left of the snippet (HeaderItem) has a row with content on the right. The combination “header (HeaderItem) + content in the right part of the application” contains the ListRow class. Content BrowseFragment is a list of ListRow. The title and list with content on the right side is one to one.







Let's consider ListRow in more detail. ArrayObjectAdapter is responsible for the list with content. In this case, CardInfo is a content item. CardInfo can be any object. How to create and display CardInfo, we consider later.







Now we can draw the following conclusions:



ArrayObjectAdapter - responsible for the list of ListRow

ListRow = HeaderItem (header) + ArrayObjectAdapter (content list on the right side)

Class presenter

Filling content elements is determined using the Presenter class from the LeanbackSupport library library. It defines the display of the content item. Presenter is an abstract class, so we have to create a new class and inherit it from Presenter. When you create a new class, you must define at least 3 methods:

 onCreateViewHolder(ViewGroup parent); onBindViewHolder(ViewGolder, viewHolder, Object item); onUnbindViewHolder(ViewHolder viewHolder); 

Presenter contains an internal ViewHolder class that allows you to reference a View (content item). We can access the View through the ViewHolder for specific events, for example, in the methods of the class Presenter onBind () or onUnbind ()

Filling HeadersFragment and RowsFragment

Let's get down to business. Here we create a class GridItemPresenter inherited from the class Presenter. In this application, the Object (content item) displays a string, and the ViewHolder contains a TextView to display this string. View is created in the onCreateViewHolder () method, and its filling is done in the onBindViewHolder () method.

 public class GridItemPresenter extends Presenter { private static final int WIDTH_ITEM = 300; private static final int HEIGHT_ITEM = 200; @Override public ViewHolder onCreateViewHolder(ViewGroup parent) { TextView view = new TextView(parent.getContext()); view.setLayoutParams(new ViewGroup.LayoutParams(WIDTH_ITEM, HEIGHT_ITEM)); view.setFocusable(true); view.setFocusableInTouchMode(true); view.setGravity(Gravity.CENTER); view.setBackgroundColor(ContextCompat.getColor(parent.getContext(), R.color.default_background)); view.setTextColor(Color.WHITE); return new ViewHolder(view); } @Override public void onBindViewHolder(ViewHolder viewHolder, Object item) { TextView textView = (TextView) viewHolder.view; String str = (String) item; textView.setText(str); } @Override public void onUnbindViewHolder(ViewHolder viewHolder) { } } 

Add the loadRows () method to the MainFragment class and call it in the predefined onActivityCreated () method.

  private void loadRows() { // ,   ListRow (ListRow =  + ) ArrayObjectAdapter rowsAdapter = new ArrayObjectAdapter(new ListRowPresenter()); //    ,         , //      " 1" HeaderItem headerItem = new HeaderItem(0, " 1"); //  ,      GridItemPresenter itemPresenter = new GridItemPresenter(); // ,        ArrayObjectAdapter gridAdapter = new ArrayObjectAdapter(itemPresenter); //     gridAdapter.add(0, " 1"); gridAdapter.add(1, " 2"); gridAdapter.add(2, " 3"); //  ,   ListRows,  ListRow. //    ,     ,   //    rowsAdapter.add(new ListRow(headerItem, gridAdapter)); setAdapter(rowsAdapter); } 

Now you can run the application and see the screen below.







That's all for now. In this article, I tried to explain some of the basic principles of creating an application for Android TV.



The basis of this article was taken this and this manuals.