創建TV佈局

編寫:awong1900 - 原文:http://developer.android.com/training/tv/start/layouts.html

TV通常在3米外觀看，並且它比大部分Android設備大的多。這類屏不能達到類似小設備的精細細節和顏色的水平。這些因素需要我們在頭腦中考慮，並設計出對於TV設備更為有用且好用的應用佈局。

這節課程描述了創建有效的TV應用佈局的基本要求和實現細節。

用TV佈局主題

Android主題能給我們的TV應用佈局提供基礎框架。對於打算在TV設備上運行的應用activity，我們應該用一款主題改變它的顯示。這節課程教我們應該用哪個主題。

Leanback主題

支持TV用戶界面的庫叫做v17 leanback libarary，它提供了一個標準的TV activity主題，叫做Theme.Leanback。這一主題為TV應用程序建立了一致的視覺風格。強烈推薦在任何用了v17 leanback類的TV應用中使用這個主題。接下來的代碼展示如何在應用中對給定的activity使用這個主題：

<activity
  android:name="com.example.android.TvActivity"
  android:label="@string/app_name"
  android:theme="@style/Theme.Leanback">

NoTitleBar主題

在手機和平板的Android應用中，標題欄是標準的用戶界面元素。但是在TV應用中是不適合的。如果沒有用v17 leanback類，我們應該在TV activity使用這個主題來隱去標題欄的顯示。接下來的TV應用manifest代碼示範瞭如何應用這個主題來刪除標題欄。

<application>
  ...

  <activity
    android:name="com.example.android.TvActivity"
    android:label="@string/app_name"
    android:theme="@android:style/Theme.NoTitleBar">
    ...

  </activity>
</application>

創建基本的TV佈局

TV設備的佈局應該遵循一些基本的指引確保它們在大屏幕下是可用的和有效率的。遵循這些技巧去創建最優化的TV橫屏佈局。

• 創建橫屏佈局。TV屏幕總是顯示在橫屏模式。
• 把導航控件放置在屏幕的左邊或者右邊，並且保持內容在垂直區間。
• 創建分離的UI，用Fragment，並且用框架如GridView代替ListView獲得屏幕水平方向上更好的使用。
• 用框架如RelativeLayout或者LinearLayout來排列視圖。基於對齊方式，縱橫比，和電視屏幕的像素密度，這個方法允許系統調整視圖大小的位置。
• 在佈局控件之間添加足夠的邊際，以避免成為一個雜亂的UI。

Overscan

由於TV標準的演進，TV的佈局有一個獨特的需求是總是希望給觀眾顯示全屏圖像。因為這個原因，TV設備可能剪掉應用佈局的外邊緣去確保整個顯示器被填滿。這種行為通常簡稱為overscan。

避免屏幕元素由於overscan被剪掉，可以在佈局所有的邊緣增加總共10%的邊際。這換算為在activity的基礎佈局上左右邊緣留48dp的邊際和在上下留27dp的邊際。接下來的佈局例子展示瞭如何在TV應用根佈局上設置這些邊際。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:id="@+id/base_layout"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:orientation="vertical"
  android:layout_marginTop="27dp"
  android:layout_marginLeft="48dp"
  android:layout_marginRight="48dp"
  android:layout_marginBottom="27dp" >
</LinearLayout>

Caution：如果我們正在使用v17 leanback類，不要在佈局中留overscan邊際，諸如BrowseFragment或者相關控件，因為那些佈局已經包含了overscan安全邊際。

創建方便使用的文本和控件

在TV應用佈局中的文本和控件應該在一定距離外是容易查看和導航的。接下來的技巧是確保我們的用戶界面元素在一定距離外更容易查看。

• 分解文本為小塊，用戶可以快速瀏覽。

• 在暗背景下用亮色文字。這種風格在TV中更容易閱讀。

• 避免輕字體或者字體既窄且有非常寬闊的筆觸效果。用簡單的sans-serif字體並且去掉鋸齒效果以增加可讀性。

• 用Android標準的字體大小。

  <TextView
        android:id="@+id/atext"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center_vertical"
        android:singleLine="true"
        android:textAppearance="?android:attr/textAppearanceMedium"/>
  

• 確保所有的控件是足夠大，使人們站在屏幕3米外（更大的屏幕這個距離會更大）可以看清楚。做這個最好的方式是用佈局相對大小而不是絕對大小，並且用密度無關像素（dip）單位代替像素單位。例如，設置控件的寬度，用wrap_content代替特定像素值，並且設置控件的邊際，用dip代替px值。 更多關於密度無關像素和創建大尺寸屏幕的佈局，查看Support Mutiple Screens。

管理TV佈局資源

通常的高清晰度TV分辨率是720p，1080i和1080p。假定我們的TV佈局對象是一個1920 x 1080像素的屏幕，然後要允許Android系統必要情況下縮減佈局元素到720p。通常，降低分辨率（刪除像素）不會降低佈局的外觀質量。但是增加分辨率會降低佈局顯示的質量，並且會對用戶體驗造成負面影響。

為了獲得最好的圖像縮放效果，儘可能提供9-patch圖片元素。如果在我們的佈局中使用低質量或者小的圖片，它們將出現馬賽克，模糊或者顆粒，這不是一個好的用戶體驗。用高質量圖片代替它。

更多關於優化佈局和大屏幕的資源文件問題，參考Designing for multiple screens。

避免反模式佈局

有幾種創建佈局的方法我們應該避免使用，因為它們不能在TV設備上很好的工作並且導致不好的用戶體驗。當開發TV佈局時，以下一些用戶界面是我們應該明確不能使用的。

• 重用手機和平板佈局 - 不要重用沒有修改的手機或者平板應用的佈局。為其他Android設備開發的佈局不適合TV設備，並且TV上佈局應該被簡化。
• 狀態欄 - 儘管這種用戶界面習慣是推薦使用在手機和平板上，但是他不適合TV界面。通常，狀態欄選項菜單（或者任何下拉菜單）堅決不要使用，因為用遙控器操作這樣的菜單是困難的。
• ViewPager - 在屏幕之間滑動能很好在手機或平板上工作，但是不要在TV上嘗試！ 更多信息關於設計適合TV的佈局，參考TV Design指導。

處理大圖片

TV設備，像任何其他Android設備，內存有一定限制。如果我們創建的應用中用了很高分辨率的圖片或者用了很多高分辨率圖片，它可能很快達到內存限制，並且導致內存溢出錯誤。避免這些類型的問題，遵循以下方法：

• 僅當圖片顯示在屏幕時才加載。例如，當在GridView或者Gallery中顯示多個圖片時，僅當[getView()](http://developer.android.com/reference/android/widget/Adapter.html#getView(int, android.view.View, android.view.ViewGroup))在視圖的Adapter中被調用時才加載圖片。
• 在Bitmap視圖中調用recycle()不再需要。
• 對存儲在內存中集合中的位圖對象使用弱引用。
• 如果我們從網絡上獲取圖片，用AsyncTask去操作並且存儲它們在設備上以方便更快的存取。絕對不要在應用的主線程操作網絡傳輸。
• 當下載大圖片時，降低圖片到合適的尺寸，否則，下載圖片本身可能導致內存溢出問題。 更多信息關於獲得最好的圖片操作性能，參考 Displaying Bitmaps Efficiently。

提供有效的廣告

Android TV的廣告必須總是全屏。廣告不可以出現在內容的旁邊或者覆蓋內容。用戶應當能用D-pad控制器關閉廣告。視頻廣告在開始時間後的30秒內應當能被關閉。

Android TV不提供網頁瀏覽器。我們的廣告不應該嘗試去啟動網頁瀏覽器或者重定向到Google Play商店。

Note：WebView類用於登入服務器，如Google+和Facebook。

下一節: 創建TV導航 >