10、TV UI

 TV UI布局

1. 為大螢幕提供适當的布局源檔案。

2. 確定UI在一定距離仍然可以看清。

3. 為高清電視提供高分辨率的圖示和圖像。 

1. 把螢幕上的導航控制菜單放在螢幕的左邊或者右邊,并且将菜單内容 以垂直的方式顯示。

2. 建立那些分段的UI時,通過使用Fragments和GridView來替代 ListView更能充分利用水準空間的視圖。

3. 使用RelativeLayout和LinearLayout進行布局。這兩種布局使 Android系統能夠針對大小,對齊,縱橫比,以及螢幕的像素密度來 比對視圖的位置。

4. 在視圖控制之間提供足夠的餘地來避免一個雜亂的使用者界面。 

左右布局示例 

1 <RelativeLayout 
 2       android:layout_width="fill_parent"    
 3       android:layout_height="fill_parent">
 4      <fragment  
 5           android:id="@+id/leftsidecontrols" 
 6           android:layout_width="0dip"  
 7           android:layout_marginLeft="5dip" 
 8           android:layout_height="match_parent" />
 9      <GridView
10           android:id="@+id/gridview"   
11           android:layout_width="wrap_content" 
12           android:layout_height="wrap_content" />
13 </RelativeLayout>      

 使文字和控制容易看到 

1. 把文本插入使用者能夠快速地掃描到的小塊中。

2. 在一個黑暗的背景中使用明亮的文本.這個風格在一台電視中更友善讀。

3. 避免輕量級的字型以及那些要麼非常窄要麼非常寬的筆畫字型.使用簡 單的無襯線字型和使用抗混疊來提高可讀性。

4. 用密度無關的像素單元而不是絕對的像素單元(dp和sp)。 

 針對高分辨率大螢幕設計 

          普遍的高清電視顯示分辨率是720p 和1080p.把你的UI設定為1080p, 并且允許系統在必要的時候将你的UI分辨率下調到720p.通常下調并不意 味着是縮小你的UI界面(注意反之則不然,你應該避免倍增,因為它會降低 UI品質).

        為了獲得最佳的圖檔顯示,如果可能的話以9-patch image元素來展示。 在你的布局中如果提供低品質或者小圖檔的話,它們将會出現像素化,模糊, 或呈顆粒狀.對使用者來說這不是一個好的使用者體驗.取而代之的是采用高質 量的圖檔. 

 TV UI導航的設計原則 

1. 確定所有的布局都處于按鍵導航控制之下。

2. 為可視化的導航提供清晰的回報。

3. 通過合理的布局,使用每一個UI更容易通路。 

 處理按鍵導航 

在電視上,使用者使用遠端方式導航,例如遙控器或鍵盤,這就限定了 (螢幕光标)移動方式隻有上、下、左、右。是以,要建構一個優秀的應用, 你必須在應用裡提供一套使用者可以快速學會的導航政策。

當你為遙控器設計導航時,遵循以下幾點原則:
      

1. 確定遙控器可以控制界面在所有的控件。

2. 用上下鍵控制清單滾動時,當用确認鍵選中清單的某項時,確定清單 仍然可以滾動。

3. 可控元素之間的移動需要簡潔和可預測。 

 下一個焦點控件 

Android通常會自動處理布局元素中的導航順序,是以通常并不需要 擔心控件獲得焦點的順序。除非布局非常複雜,或者需要在布局元素之間 特殊移動,也是可以的。例如,現在有一個EditText控件,定義他的下一 個獲得焦點的控件,可以設定如下的4個屬性。 

 為焦點和選擇提供清晰的提示 

       使用合适的顔色高亮顯示被選中的元素,這樣讓使用者很容易就知道哪 個可控元素被選中,另外,建議在整個應用程式中使用統一風格的高亮顯 示。 安卓系統針對選中或擷取焦點的控件使用Drawable State List Resources 實作高亮顯示的效果,例如: 

1 <!-- button.xml -->
 2 <?xml version"utf-8"?>
 3 <selector  xmlns:android="http://schemas.android.com/apk/res/android">
 4       <!-- pressed -->
 5       <item android:state_pressed="true"  
 6                android:drawable="@drawable/button_pressed" />
 7       <!-- focused -->
 8       <item android:state_focused="true"  
 9                 android:drawable="@drawable/button_focused" /> 
10       <!-- hovered -->
11       <item android:state_hovered="true"  
12                 android:drawable="@drawable/button_focused" />
13       <!-- default -->
14       <item android:drawable="@drawable/button_normal" /> 
15 </selector>      

1 <Button
2       android:layout_height="wrap_content"      
3       android:layout_width="wrap_content" 
4       android:background="@drawable/button" />      

 設計簡易導航 

      使用者通過按盡可能少的鍵導航到任何一個UI,導航應該簡單易懂,對 于稍顯複雜的操作,需要提供帶幫助功能的按鈕、圖示,使用者一點選就彈 出一個幫助對話框提示使用者。

      預測使用者可能會切換的下一界面,我們可以提供一個(具有展現使用者意 圖)這樣的導航。如果目前界面感覺很稀松,考慮把螢幕分成多面闆,可 以用Fragment組成帶有多個面闆的界面。例如:在螢幕左邊放一個包含 主标題清單的面闆,右邊就放置對應的包含副标題清單的面闆。 

 TV不支援的功能 

 對于不支援功能的解決方案

安卓系統是預設裝置帶有觸摸屏的,是以如果系統在電視上運作,就 得在配置檔案mainfest配置一下,不需要觸摸屏: 

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

因為電視固定的、室内裝置,是以沒有内置GPS。如果你的程式需要 用到地理位置資訊,要麼讓使用者(聯網)查詢,要麼使用"static location provider" 得到這些資訊,這種方式是通過查詢郵編完成的。 

LocationManager locationManager = (LocationManager) this.getSystemService(Context.LOCATION_SERVICE);

Location location = locationManager.getLastKnownLocation("static"); 

 運作時檢測功能可用性 

if (getPackageManager().hasSystemFeature("android.hardware.telephony")) {

             Log.d("Mobile Test", "Running on phone"); }

else if (getPackageManager().hasSystemFeature("android.hardware.touchscreen"))

{

         Log.d("Tablet Test", "Running on devices that don't support telphony but have a

               touchscreen.");

}

else

         Log.d("TV Test", "Running on a TV!");

}