android tv焦點特效實現淺析

Android TV上的焦點凸顯特效相信大家都看到過，那麼我們就來實現它吧，首先上張效果圖。

先說一下實現原理，主要通過重寫RelativeLayout實現item，之後在其中加入scalanimation動畫效果。剛開始處理時，還是發現了一些問題，比如item放大後會被其他item遮擋，如何添加選中邊框等等，以及動畫的實現等等。下面放上實現細節。

首先是item的代碼：

 <喎?/kf/ware/vc/" target="_blank" class="keylink">vcD4KPHByZSBjbGFzcz0="brush:java;"> 這裡定義了一個自定義view，代碼在後面放上，每個item裡添加了一個img，用於放置內容圖片，一個hover，用於顯示選中的邊框，以及一個text，顯示一些文字說明。

 

hover的src是一個selector drawable，當未focus時，它的背景是tansparent，當focus，放入外框圖片。

自定義的HomeItemContainer 代碼：

 

public class HomeItemContainer extends RelativeLayout {
	
	private Animation scaleSmallAnimation;
	private Animation scaleBigAnimation;
	
	public HomeItemContainer(Context context) {
		super(context);
	}

	public HomeItemContainer(Context context, AttributeSet attrs, int defStyle) {
		super(context, attrs, defStyle);
	}

	public HomeItemContainer(Context context, AttributeSet attrs) {
		super(context, attrs);
	}
	
	@Override
	protected void onDraw(Canvas canvas) {
		super.onDraw(canvas);
	}
	
	@Override
	protected void onFocusChanged(boolean gainFocus, int direction, Rect previouslyFocusedRect) {
		super.onFocusChanged(gainFocus, direction, previouslyFocusedRect);
		if (gainFocus) {
			this.bringToFront();
			getRootView().requestLayout();
			getRootView().invalidate();
			zoomOut();
		} else {
			zoomIn();
		}
	}
	
	private void zoomIn() {
		if (scaleSmallAnimation == null) {
			scaleSmallAnimation = AnimationUtils.loadAnimation(getContext(), R.anim.anim_scale_small);
		}
		startAnimation(scaleSmallAnimation);
	}
	
	private void zoomOut() {
		if (scaleBigAnimation == null) {
			scaleBigAnimation = AnimationUtils.loadAnimation(getContext(), R.anim.anim_scale_big);
		}
		startAnimation(scaleBigAnimation);
	}
	
}

注意onFocusChanged方法，為防止item被其他item遮擋，先調用bringToFront方法，使此item處於最上層，之後調用父view的方法進行重新繪制，其實注意一點，item必須處於同一父view中，否則requestLayout和invalidate可能會不起作用。

 

順便放上一個scaleanimation縮小的效果代碼：

 

裡面的屬性就不詳細介紹了，有興趣的可以自己谷歌。

 

最後放上item的父view：

 

這裡我定義了10個item，注意RelativeLayout的兩個屬性，clipChildren設置false，讓children view可以超出自身所設置的大小，clipToPadding設置為false，讓children view可以使用padding 的位置進行繪制，有了這2個屬性，item就可以實現放大而不被遮擋了。

 

好了，焦點特效的教程就說到這裡了，有問題可以在評論中反饋。