使用TransitionDrawable實現(xiàn)多張圖片淡入淡出效果
歡迎界面想做出廣告頁自動輪播的效果,圖片切換的方式用淡入淡出的方式。這個在h5頁面很容易就實現(xiàn)了,但是在android界面中,很容易就想到了動畫animation動畫來實現(xiàn),但是發(fā)現(xiàn)使用動畫的話,這種方式看起來不會自然,因為在調用statAnimation的時候因為圖片已經(jīng)顯示了,這樣再硬生生的播放一次動畫其實會導致細微的閃爍效果。后來發(fā)現(xiàn)android中自帶了TransitionDrawable類可以很輕松地實現(xiàn)這個效果,但是會有局限性。
先上效果圖:

一、兩張圖片的切換效果,輕松實現(xiàn)
//講需要切換的兩張圖片直接給TransitionDrawable對象
TransitionDrawable transitionDrawable = new TransitionDrawable(new Drawable[]{getResources().getDrawable(R.drawable.advertiseone),getResources().getDrawable(R.drawable.advertisetwo)});
//一樣用
imgAdvertise.setImageDrawable(transitionDrawable);
//切換圖片的時間間隔
transitionDrawable.startTransition(3000);
二、切換多張圖片
實現(xiàn)思路,通過開啟一個線程(死循環(huán)),每隔一段時間發(fā)送消息到UI主線程中替換主線程中的transitionDrawable對象中的圖片就可以了,需要用到handler。這里實現(xiàn)在廣告倒計時中無限循環(huán)圖片切換的次數(shù)
package com.coofond.carservice;
import android.content.Intent;
import android.graphics.drawable.Drawable;
import android.graphics.drawable.TransitionDrawable;
import android.os.Build;
import android.os.Bundle;
import android.os.CountDownTimer;
import android.os.Handler;
import android.os.Message;
import android.support.annotation.Nullable;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.ImageView;
import android.widget.TextView;
import com.coofond.carservice.mine.ui.LoginAct;
/**
* Created by IBM on 2016/10/7.
*/
public class WelcomeAct extends AppCompatActivity {
private TextView tvTimecount;
private ImageView imgAdvertise;
private int adTime = 6000;//倒計時秒數(shù)
private int timeInterval = 1000;//倒計時間隔
private CountDownTimer mTimer;//計時器
private int change = 0;//記錄下標
private int[] ids = new int[]{R.drawable.advertiseone, R.drawable.advertisetwo, R.drawable.advertisethree};
private Drawable[] drawables;//圖片集合
private Thread mThread;//線程
private boolean mThreadFlag = true;//線程結束標志符
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.act_welcome);
initView();
initData();
initEvent();
}
//定義hander
private Handler mHandler = new Handler(new Handler.Callback() {
@Override
public boolean handleMessage(Message msg) {
int duration = msg.arg1;
TransitionDrawable transitionDrawable = new TransitionDrawable(new Drawable[]{drawables[change % ids.length],
drawables[(change + 1) % ids.length]});
change++;//改變標識位置
imgAdvertise.setImageDrawable(transitionDrawable);
transitionDrawable.startTransition(duration);
return false;
}
});
//開啟線程發(fā)送消息,讓transition一直在改變
private class MyRunnable implements Runnable {
@Override
public void run() {
//這個while(true)是做死循環(huán)
while (mThreadFlag) {
int duration = 1000;//改變的間隔
Message message = mHandler.obtainMessage();
message.arg1 = duration;
mHandler.sendMessage(message);
try {
Thread.sleep(duration);
//隔duration秒發(fā)送一次
} catch (InterruptedException e) {
e.printStackTrace();
}
}
}
}
private void initView() {
tvTimecount = (TextView) findViewById(R.id.tv_advert);
imgAdvertise = (ImageView) findViewById(R.id.iv_advetise);
//填充圖片
drawables=new Drawable[ids.length];
for (int i = 0; i < ids.length; i++) {
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
drawables[i] = getDrawable(ids[i]);
} else {
drawables[i] = getResources().getDrawable(ids[i]);
}
}
}
private void initData() {
// 初始化計時器,第一個參數(shù)是共要倒計時的秒數(shù),第二個參數(shù)是倒計時的間隔
mTimer = new CountDownTimer(adTime, timeInterval) {
// 倒計時開始時要做的事情,參數(shù)m是直到完成的時間
@Override
public void onTick(long millisUntilFinished) {
tvTimecount.setText("" + millisUntilFinished / 1000 + "s跳過廣告");
}
// 結束計時后要做的工作
@Override
public void onFinish() {
jumpActivity();
}
};
//開啟計時器
mTimer.start();
//開啟線程,改變transition,切換圖片
mThread= new Thread(new MyRunnable());
mThread.start();
}
private void initEvent() {
tvTimecount.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
mTimer.cancel();
jumpActivity();
}
});
}
// 跳轉頁面
private void jumpActivity() {
//如果還沒結束當前的頁面,就結束
if (!isFinishing()) {
finish();
}
Intent it = new Intent(WelcomeAct.this, LoginAct.class);
startActivity(it);
}
@Override
protected void onDestroy() {
super.onDestroy();
//mThread.stop(); 不推薦使用
mThreadFlag=false;//結束線程
}
}
記錄個小tips:如何比較優(yōu)雅地結束一個線程,只要在while條件中設置自己標識符,在需要結束的地方把標識符改為false就可以了,基礎補上。
總結:transitionDrawable是切換兩張圖片淡入淡出效果的一個類。如果要切換多張圖片,那么就相當于不斷替換它的膠卷就可以了。因為交卷在UI主線程就準備好了,所以需要用到handler進行通信,然后開啟線程輪詢。因為實現(xiàn)的是廣告歡迎頁,倒計時一般只有3-5s,所以輪詢的次數(shù)也不會太多。
以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。
- Android模仿To圈兒個人資料界面層疊淡入淡出顯示效果
- Android使用TransitionDrawable漸變切換多張圖片
- Android實現(xiàn)滑動屏幕切換圖片
- android控件實現(xiàn)多張圖片漸變切換
- Android開發(fā)之使用ViewPager實現(xiàn)圖片左右滑動切換效果
- Android編程單擊圖片實現(xiàn)切換效果的方法
- Android中ViewPager組件的基本用法及實現(xiàn)圖片切換的示例
- Android實現(xiàn)圖片輪播切換實例代碼
- Android自定義ImageView實現(xiàn)點擊兩張圖片切換效果
- Android應用中圖片瀏覽時實現(xiàn)自動切換功能的方法詳解
相關文章
Android開發(fā)之手勢檢測及通過手勢實現(xiàn)翻頁功能的方法
這篇文章主要介紹了Android開發(fā)之手勢檢測及通過手勢實現(xiàn)翻頁功能的方法,結合實例形式分析了Android GestureDetector類實現(xiàn)手勢檢測功能的相關操作技巧,需要的朋友可以參考下2017-09-09
Android開發(fā)實戰(zhàn)之漂亮的ViewPager引導頁
這篇文章主要介紹了Android開發(fā)實戰(zhàn)中漂亮ViewPager引導頁的制作過程,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下2016-08-08
Android開發(fā)設置RadioButton點擊效果的方法
這篇文章主要介紹了Android開發(fā)設置RadioButton點擊效果的方法,詳細分析了Android開發(fā)中RadioButton屬性功能及相關設置技巧,需要的朋友可以參考下2017-06-06

