相信很多從事AndroidTV開發的朋友都對如何展示item的選中效果感到苦惱,電視端開發與移動端最大的不同是用戶只能通過一個遙控器進行控制(當然如果你的電視是觸屏的話除外……),在這個時候,我們需要讓用戶知道當前選中的到底是哪一個項目,通常來說,有幾種常見的實現方法:通過給item的background屬性定義一個selector,為不同狀態下(focused、selected)定義不同的背景樣式來展現選中的效果。
通過定義一個全局的焦點監聽view.getViewTreeObserver().addOnGlobalFocusChangeListener,來定義焦點獲得時的控件行為,比如放大、改變背景等
以上兩種方法雖然不需要另外增加元素,操作起來比較簡單,但是效果比較生硬且單一,如果我們想要更豐富的動畫效果,顯然上面兩種方式不能滿足我們的需求。在這里,給大家介紹一個AndroidTV開發的套件Android-tv-widget。這是一個開源的AndroidTV開發框架,里面有不少為TV端適配的UI控件跟函數,可以方便我們實現不少所需的功能。在其中的com.open.androidtvwidget.view.MainUpView,就是一個可以幫助我們實現飛框選中效果的控件。
實現效果:
簡單的使用:
1.首先可以在我們的頁面根布局下添加這一控件
這里并不需要調整布局,因為飛框一般情況下我們設定為不可見的。在這里綁定了三個屬性,一個是effect_bridge,一個是rect_padding,一個是up_rect_drawable.我們可以看一下這三個屬性的定義。在ViewModel中我們添加如下三個成員(對于databinding的具體內容不在這里細述):@Bindable
public?int?rectDrawable?=?R.drawable.white_light_10;
@Bindable
public?EffectNoDrawBridge?bridge?=?new?EffectNoDrawBridge();
@Bindable
public?Rect?rectPadding?=?new?Rect(0,?10,?0,?10);
effect_bridge是飛框對象,我們控制飛框的聚焦跟移動都是操作這一個對象,rect_padding是飛框的內邊距,可以調整這個Rect對象的大小,來調整飛框離內部四個邊緣的距離,我們可以根據實際的狀態適當調整,而rectDrawable則是具體的飛框樣式,這里推薦使用9-Patch格式的圖片,這樣飛框在縮放的時候不容易變形。
實際需要我們操作的是mainupview本身以及對應的bridge對象。MainUpView?mainUpView?=?(MainUpView)?mainView.findViewById(R.id.mainUpView);
OpenEffectBridge?bridge?=?(OpenEffectBridge)?mainUpView.getEffectBridge();
在首頁中,我們可以獲取mainupview對象,并通過getEffectBridge()方法獲取對應的bridge。
mainUpView.setFocusView(newFocus,?scale);
mainUpView.setFocusView(newFocus,?oldFocus,?scale);
利用這兩個函數,我們可以使mainUpView捕獲當前獲得焦點的View對象,飛框也隨之移動并顯示。傳入的scale參數是飛框捕獲view后的放大系數,用于實現放大的效果。
當然了,當屏幕上view的布局不均勻的時候,飛框效果可能比較突兀,因為可以看到一個白色的框在屏幕上閃過,如果屏幕兩個控件之間的空隙較大,效果并不美觀。我們可以設置飛框的動畫監聽,讓飛框在移到目的控件后才顯示。
bridge.setOnAnimatorListener(new?OpenEffectBridge.NewAnimatorListener()?{
@Override
public?void?onAnimationStart(OpenEffectBridge?bridge,?View?view,
Animator?animation)?{
bridge.setVisibleWidget(true);
}
@Override
public?void?onAnimationEnd(OpenEffectBridge?bridge,?View?view,
Animator?animation)?{
if?(mSaveBridge?==?bridge?&&?view.hasFocus())
bridge.setVisibleWidget(false);
}
});
在這里,setVisibleWidget方法控制bridge是否顯示,傳入為true的時候隱藏。我們的操作是在動畫開始的時候隱藏bridge,動畫結束后再重新顯示。
以上就是使用MainUpView控件的基本方法,當然還有不少拓展的功能,大家可以在熟悉使用后通過閱讀源碼繼續挖掘。希望對大家有所幫助。
原文:http://davidwillo.blog.51cto.com/12613091/1906300