1. 程式人生 > >android tv焦點放大特效實現及RecyclerView使用

android tv焦點放大特效實現及RecyclerView使用

如下是tv焦點放大大致分析,具體實現已優化,請檢視demo:https://github.com/lewic1987/tvdemo.git

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



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

首先是item的程式碼:

  1. <viewxmlns:android
    ="http://schemas.android.com/apk/res/android"
  2.     android:id="@+id/item"
  3.     android:layout_width="@dimen/home_channel_item_width"
  4.     android:layout_height="@dimen/home_channel_item_height"
  5.     class="com.eastelsoft.tv.widget.home.HomeItemContainer"
  6.     android:clickable="true"
  7.     android:focusable=
    "true"
  8.     android:focusableInTouchMode="true"
  9.     android:clipChildren="false"
  10.     android:clipToPadding="false">
  11.     <com.eastelsoft.tv.widget.ESImageView
  12.         android:id="@+id/img"
  13.         android:layout_width="fill_parent"
  14.         android:layout_height="fill_parent"
  15.         android:background
    ="@drawable/holder_nor"
  16.         android:duplicateParentState="true"
  17.         android:scaleType="fitXY"/>
  18.     <!-- -->
  19.     <com.eastelsoft.tv.widget.ESImageView
  20.         android:id="@+id/hover"
  21.         android:layout_width="fill_parent"
  22.         android:layout_height="fill_parent"
  23.         android:contentDescription="@string/desc"
  24.         android:duplicateParentState="true"
  25.         android:scaleType="fitXY"
  26.         android:src="@drawable/sl_image_home_navigator"/>
  27.     <TextView
  28.         android:id="@+id/text"
  29.         android:layout_width="fill_parent"
  30.         android:layout_height="wrap_content"
  31.         android:layout_alignParentBottom="true"
  32.         android:layout_marginBottom="@dimen/home_item_text_margin"
  33.         android:layout_marginLeft="@dimen/home_item_text_margin"
  34.         android:layout_marginRight="@dimen/home_item_text_margin"
  35.         android:ellipsize="marquee"
  36.         android:gravity="bottom|right|center"
  37.         android:includeFontPadding="false"
  38.         android:marqueeRepeatLimit="5"
  39.         android:maxWidth="@dimen/px310"
  40.         android:shadowColor="#88333333"
  41.         android:shadowDx="2.0"
  42.         android:shadowDy="2.0"
  43.         android:shadowRadius="2.0"
  44.         android:singleLine="true"
  45.         android:textColor="#ffffffff"/>
  46. </view>
這裡定義了一個自定義view,程式碼在後面放上,每個item裡添加了一個img,用於放置內容圖片,一個hover,用於顯示選中的邊框,以及一個text,顯示一些文字說明。

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

自定義的HomeItemContainer 程式碼:

  1. publicclass HomeItemContainer extends RelativeLayout {  
  2.     private Rect mBound;  
  3.     private Drawable mDrawable;  
  4.     private Rect mRect;  
  5.     private Animation scaleSmallAnimation;  
  6.     private Animation scaleBigAnimation;  
  7.     public HomeItemContainer(Context context) {  
  8.         super(context);  
  9.         init();  
  10.     }  
  11.     public HomeItemContainer(Context context, AttributeSet attrs, int defStyle) {  
  12.         super(context, attrs, defStyle);  
  13.         init();  
  14.     }  
  15.     public HomeItemContainer(Context context, AttributeSet attrs) {  
  16.         super(context, attrs);  
  17.         init();  
  18.     }  
  19.     protectedvoid init() {  
  20.         setWillNotDraw(false);  
  21.         mRect = new Rect();  
  22.         mBound = new Rect();  
  23.         mDrawable = getResources().getDrawable(R.drawable.poster_shadow_4);//nav_focused_2,poster_shadow_4
  24.         setChildrenDrawingOrderEnabled(true);  
  25.     }  
  26.     @Override
  27.     protectedvoid onAttachedToWindow() {  
  28.         super.onAttachedToWindow();  
  29.     }  
  30.     @Override
  31.     publicvoid draw(Canvas canvas) {  
  32.         super.draw(canvas);  
  33.     }  
  34.     @Override
  35.     protectedvoid onDraw(Canvas canvas) {  
  36.         if (hasFocus()) {  
  37.             System.out.println("HomeItemContainer focus : true ");  
  38.             super.getDrawingRect(mRect);  
  39.             mBound.set(-39+mRect.left, -39+mRect.top, 39+mRect.right, 39+mRect.bottom);  
  40.             mDrawable.setBounds(mBound);  
  41.             canvas.save();  
  42.             mDrawable.draw(canvas);  
  43.             canvas.restore();  
  44.         }  
  45.         super.onDraw(canvas);  
  46.     }  
  47.     @Override
  48.     protectedvoid onFocusChanged(boolean gainFocus, int direction, Rect previouslyFocusedRect) {  
  49. 相關推薦

    android tv焦點放大特效實現RecyclerView使用

    如下是tv焦點放大大致分析,具體實現已優化,請檢視demo:https://github.com/lewic1987/tvdemo.git Android TV上的焦點凸顯特效相信大家都看到過,那麼我們就來實現它吧,首先上張效果圖。

    Android TV 焦點移動飛框的實現

    目前國內傳統廠商和網際網路廠商所開發的Android智慧電視的UI都很類似,其中最常見的就是獲得焦點的選中項飛框動畫效果的實現了,看上去動畫效果很炫酷,能夠正確的導航使用者當前所選擇的條目。Android電視和Android手機有很大的區別,Android手機帶

    Android系統聯絡人全特效實現 下 ,字母表快速滾動

                    在上一篇文章中,我和大家一起實現了類似於Android系統聯絡人的分組導航和擠壓動畫功能,不過既然文章名叫做《Android系統聯絡人全特效實現》,那麼沒有快速滾動功能顯然是稱不上"全"的。因此本篇文章我將帶領大家在上篇文章的程式碼基礎上改進,加入快速滾動功能。其實ListVi

    ionic中滑動縮放的焦點特效實現

    在之前專案整理中,實現過這樣一個特效:當用手指滑動時,焦點圖隨著滑動的距離而成比例的縮放的效果,常見於一些App上,主要是用於展示資訊的卡片,相關技術棧版本,ionic1, angular1, 這裡再來說一下:技術棧不同,但實現的思路是想通的,僅供開發參考。

    android 螢幕的放大縮小實現

                           ios中UIScrollView能很好的實現放大縮小功能,在anroid這裡,scrollview並不能很好的支援放大縮小,而對於簡單的圖片放大,縮小,android可以使用ZoomControls控制元件來實現一些簡單圖片放大縮

    Android自動化基於UIAutomator的實現程式碼生成

    Android UI自動化測試這塊一直是google忽略或者技術薄弱的地方,以至於他沒有提供一套完整的自動化測試框架。國內公司做UI自動化測試一般都藉助於第三方測試框架如robotium,淘寶測試(TMTS),Robolectric等。但這些測試框架或多或少都存在一些跨應

    Android TV端的(RecyclerView)水平滾動焦點錯亂問題

    boolean uestc spa cas roi enabled ati pix eve package com.hhzt.iptv.ui.customview;import android.content.Context;import android.content.r

    Android ListView動畫特效實現原理源代碼

    stat 每一個 應該 所有 ner haar .get tde pri Android 動畫分三種,當中屬性動畫為我們最經常使用動畫,且能滿足項目中開發差點兒所有需求,google官方包支持3.0+。我們能夠引用三方包nineoldandr

    Android TV開發總結(三)構建一個TV app的焦點控制遇到的坑

    uio pow enter amp 鏈接 sheet 是否 base 用戶 原文:Android TV開發總結(三)構建一個TV app的焦點控制及遇到的坑 版權聲明:我已委托“維權騎士”(rightknights.com)為我的文章進行維權

    Android TV開發NO.2--RecyclerView 焦點控制

    Android TV中使用RecyclerView 焦點自動換行 android TV使用 RecyclerView ,用焦點控制item 首先在item中的xml中,的最外層新增 android:focusable="true",此句是為Recycler

    android 自己定義dialog並實現失去焦點(背景透明)的功能

    super 效果 andro 教程 his 布局 .com tle near 前言:因為在項目中須要用到更新顯示動畫的需求,所以想到了dialog,自己定義dialog不難。網上教程非常多,可是在實現dialog背景透明的需求時,遇到了一點問題。網上的一些方法在我的機器

    android 開發 將view保存為image的實現將html保存為pdf格式

    開發 eight red media try todo file per text 一、將view保存為image public class ImageHelper {   ///將view保存到bitmap中 public Bitmap createBitm

    Android TV開發中所有的遙控器按鍵監聽註意事項,新增home鍵監聽

    char 技術分享 ces num block eas article 分享 iou 原文:Android TV開發中所有的遙控器按鍵監聽及註意事項,新增home鍵監聽 簡單記錄

    TextView+SpannableString實現Android中富文字的顯示點選衝突解決

    前言 最近專案中需要實現一個文章跟讀效果的顯示,還要能夠點選文章中的單詞能夠彈出對話方塊顯示單詞的英美髮音,那麼如何實現這樣的需求呢?當然是利用SpannableString啦,下面就結合專案中使用到的和參考其他部落格的成果,整理一下常用的用法吧。 SpannableString其

    Android TV開發-按鍵焦點

    寫在前面 按鍵焦點過程瞭解 2.1 dispatchKeyEvent 過程瞭解 2.2 焦點查詢請求過程瞭解 1.2.1 第一次獲取焦點 1.2.3 按鍵焦點 焦點控制 焦點記憶 應用場景 參考資料 [TOC] 1. 寫在前面 工欲善其事必先利其器,瞭解按鍵的流程,焦點的搜

    Android TV利用viewPager實現輪播圖,並通過handler進行邏輯控制

        公司要求實現一個輪播圖,滾動圖片及其對應文字。共有五張圖,包含小圓點。     最初的實現是參考了https://blog.csdn.net/zhaoxiaojian1213/article/details/78280132,使用ViewPager實現,新開一個執行

    Android滑動選單特效實現,仿人人客戶端側滑效果,史上最簡單的側滑實現

                    人人客戶端有一個特效還是挺吸引人的,在主介面手指向右滑動,就可以將選單展示出來,而主介面會被隱藏大部分,但是仍有左側的一小部分同選單一起展示。據說人人客戶端的這個特效是從facebook客戶端模仿來的,至於facebook是不是又從其它地方模仿來的就不得而知了。好,今天我們就一

    Android沉浸式狀態列與EditText問題【沉浸式狀態列實現遇到的坑】

    Android4.4以前的版本,狀態列都是一塊黑色的,個人認為還是比較醜的。自4.4開始,Android已經支援透明狀態列了(俗稱沉浸式狀態列)。個人認為支援沉浸式狀態列的app逼格還是比較高的,為了緊跟潮流,我們專案中也準備加入沉浸式狀態列。在實現沉浸式狀態列的過程中踩了不

    Android TV 開發-listview(GridView)使用鍵盤獲取焦點時,選中上次失去焦點時的item,而不是就近的item

    在電視上開發Android應用時,經常要做有二級選單的應用,例如: 但當我們按左鍵的時候,左邊listview的最近的item會被選中,即如下效果: 但是在電視上開發應用的時候,我們希望是上一次被選中的item重新被選中,即希望是“日期和時間”被重新選中。 為了實現這個

    Android框架之路——Banner實現輪播圖(RecyclerView新增Header)

    一、簡介 Banner能實現迴圈播放多個廣告圖片和手動滑動迴圈等功能。因為原生ViewPager並不支援迴圈翻頁, 要實現迴圈還得需要自己去動手。Banner框架可以進行不同樣式、不同動畫設定, 以及完善的api方法能滿足大部分軟體首頁輪播圖效果的需求。