實例解析如何在Android應(yīng)用中實現(xiàn)彈幕動畫效果
在B站或者其他視頻網(wǎng)站看視頻時,常常會打開彈幕效果,邊看節(jié)目邊看大家的吐槽。彈幕看起來很有意思,今天我們就來實現(xiàn)一個簡單的彈幕效果。

從直觀上,彈幕效果就是在一個ViewGroup上增加一些View,然后讓這些View移動起來。所以,整體的實現(xiàn)思路大概是這樣的:
1、定義一個RelativeLayout,在里面動態(tài)添加TextView。
2、這些TextView的字體大小、顏色、移動速度、初始位置都是隨機的。
3、將TextView添加到RelativeLayout的右邊緣,每隔一段時間添加一個。
4、對每個TextView做平移動畫,使得TextView從右向左移動。
5、當(dāng)TextView從左邊移動出屏幕,將TextView從RelativeLayout中移除。
有了思路下面就來看具體的代碼。
首先定義BarrageItem,用來存儲每一個彈幕項的相關(guān)信息,包括字體內(nèi)容、字體大小顏色、移動速度、垂直方向的位置、字體占據(jù)的寬度等。
public class BarrageItem {
public TextView textView;
public int textColor;
public String text;
public int textSize;
public int moveSpeed;//移動速度
public int verticalPos;//垂直方向顯示的位置
public int textMeasuredWidth;//字體顯示占據(jù)的寬度
}
然后定義BarrageView,由于彈幕的字體顏色大小和移動速度都是隨機的,需要定義最大最小值來限定它們的范圍,然后通過產(chǎn)生隨機數(shù)來設(shè)置它們在這個范圍內(nèi)的值。另外還需要定義彈幕的文本內(nèi)容,這里是直接寫死的一些固定值。
private Context mContext;
private BarrageHandler mHandler = new BarrageHandler();
private Random random = new Random(System.currentTimeMillis());
private static final long BARRAGE_GAP_MIN_DURATION = 1000;//兩個彈幕的最小間隔時間
private static final long BARRAGE_GAP_MAX_DURATION = 2000;//兩個彈幕的最大間隔時間
private int maxSpeed = 10000;//速度,ms
private int minSpeed = 5000;//速度,ms
private int maxSize = 30;//文字大小,dp
private int minSize = 15;//文字大小,dp
private int totalHeight = 0;
private int lineHeight = 0;//每一行彈幕的高度
private int totalLine = 0;//彈幕的行數(shù)
private String[] itemText = {"是否需要幫忙", "what are you 弄啥來", "哈哈哈哈哈哈哈", "搶占沙發(fā)。。。。。。", "************", "是否需要幫忙","我不會輕易的狗帶", "嘿嘿", "這是我見過的最長長長長長長長長長長長的評論"};
private int textCount;
// private List<BarrageItem> itemList = new ArrayList<BarrageItem>();
public BarrageView(Context context) {
this(context, null);
}
public BarrageView(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public BarrageView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
mContext = context;
init();
}
如果彈幕顯示的垂直位置是隨機的,就會出現(xiàn)垂直方向上彈幕重疊的情況,所以需要根據(jù)高度對垂直方向按照彈幕高度的最大值等分,然后讓彈幕在這些指定的垂直位置隨機分布。這個值在onWindowFocusChanged里計算,因為在這個方法中通過View的getMeasuredHeight()得到的高度不為空。
@Override
public void onWindowFocusChanged(boolean hasWindowFocus) {
super.onWindowFocusChanged(hasWindowFocus);
totalHeight = getMeasuredHeight();
lineHeight = getLineHeight();
totalLine = totalHeight / lineHeight;
}
通過Handler的sendEmptyMessageDelayed每隔隨機的時間產(chǎn)生一個彈幕項。下面的代碼設(shè)置彈幕項的屬性。
class BarrageHandler extends Handler {
@Override
public void handleMessage(Message msg) {
super.handleMessage(msg);
generateItem();
//每個彈幕產(chǎn)生的間隔時間隨機
int duration = (int) ((BARRAGE_GAP_MAX_DURATION - BARRAGE_GAP_MIN_DURATION) * Math.random());
this.sendEmptyMessageDelayed(0, duration);
}
}
private void generateItem() {
BarrageItem item = new BarrageItem();
String tx = itemText[(int) (Math.random() * textCount)];
int sz = (int) (minSize + (maxSize - minSize) * Math.random());
item.textView = new TextView(mContext);
item.textView.setText(tx);
item.textView.setTextSize(sz);
item.textView.setTextColor(Color.rgb(random.nextInt(256), random.nextInt(256), random.nextInt(256)));
item.textMeasuredWidth = (int) getTextWidth(item, tx, sz);
item.moveSpeed = (int) (minSpeed + (maxSpeed - minSpeed) * Math.random());
if (totalLine == 0) {
totalHeight = getMeasuredHeight();
lineHeight = getLineHeight();
totalLine = totalHeight / lineHeight;
}
item.verticalPos = random.nextInt(totalLine) * lineHeight;
showBarrageItem(item);
}
將每一個彈幕項添加到視圖上,并給View添加一個TranslateAnimation動畫,當(dāng)動畫結(jié)束時,將View從視圖上移除。
private void showBarrageItem(final BarrageItem item) {
int leftMargin = this.getRight() - this.getLeft() - this.getPaddingLeft();
LayoutParams params = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
params.addRule(RelativeLayout.ALIGN_PARENT_TOP);
params.topMargin = item.verticalPos;
this.addView(item.textView, params);
Animation anim = generateTranslateAnim(item, leftMargin);
anim.setAnimationListener(new Animation.AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {
}
@Override
public void onAnimationEnd(Animation animation) {
item.textView.clearAnimation();
BarrageView.this.removeView(item.textView);
}
@Override
public void onAnimationRepeat(Animation animation) {
}
});
item.textView.startAnimation(anim);
}
private TranslateAnimation generateTranslateAnim(BarrageItem item, int leftMargin) {
TranslateAnimation anim = new TranslateAnimation(leftMargin, -item.textMeasuredWidth, 0, 0);
anim.setDuration(item.moveSpeed);
anim.setInterpolator(new AccelerateDecelerateInterpolator());
anim.setFillAfter(true);
return anim;
}
這樣就完成了彈幕的功能,實現(xiàn)原理并不復(fù)雜??梢愿鶕?jù)具體的需求來增加更多的控制,如控制每一行彈幕不重復(fù),控制彈幕移動的Interpolator產(chǎn)生不同的滑動效果等等。
- android開發(fā)之橫向滾動/豎向滾動的ListView(固定列頭)
- Android程序開發(fā)之ListView實現(xiàn)橫向滾動(帶表頭與固定列)
- 詳解Android使GridView橫向水平滾動的實現(xiàn)方式
- Android使用GridView實現(xiàn)橫向滾動效果
- Android開發(fā)實現(xiàn)橫向列表GridView橫向滾動的方法【附源碼下載】
- Android GridView實現(xiàn)橫向列表水平滾動
- Android自定義ViewGroup實現(xiàn)可滾動的橫向布局(2)
- Android實現(xiàn)自定義的彈幕效果
- Android 實現(xiàn)仿網(wǎng)絡(luò)直播彈幕功能詳解及實例
- Android實現(xiàn)橫向無限循環(huán)滾動的單行彈幕效果
相關(guān)文章
Android編程中聊天頁面背景圖片、標(biāo)題欄由于鍵盤引起問題的解決方法
這篇文章主要介紹了Android編程中聊天頁面背景圖片、標(biāo)題欄由于鍵盤引起問題的解決方法,針對鍵盤彈出時標(biāo)題欄及背景圖片異常的相關(guān)解決方法,具有一定參考借鑒價值,需要的朋友可以參考下2015-10-10
Android RadioButton 圖片位置與大小實例詳解
這篇文章主要介紹了Android RadioButton 圖片位置與大小實例詳解的相關(guān)資料,這里提供實例代碼及實現(xiàn)效果圖,需要的朋友可以參考下2016-11-11
Android 中ListView和GridView賦值錯位
這篇文章主要介紹了Android 中ListView和GridView賦值錯位的相關(guān)資料,希望通過本文能幫助到大家,需要的朋友可以參考下2017-10-10
Android自定義PopupWindow仿點擊彈出分享功能
這篇文章主要為大家詳細(xì)介紹了Android自定義PopupWindow仿點擊彈出分享功能,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-02-02
Android 用Time和Calendar獲取系統(tǒng)當(dāng)前時間源碼分享(年月日時分秒周幾)
這篇文章主要介紹了Android 用Time和Calendar獲取系統(tǒng)當(dāng)前時間源碼分享,包括年月日時分秒周幾的源碼,非常不錯,具有參考借鑒價值,需要的朋友參考下2017-01-01
android獲取及監(jiān)聽手機網(wǎng)絡(luò)狀態(tài)
大家好,本篇文章主要講的是android獲取及監(jiān)聽手機網(wǎng)絡(luò)狀態(tài),感興趣的同學(xué)趕快來看一看吧,對你有幫助的話記得收藏一下,方便下次瀏覽2022-01-01
Android onActivityResult和setResult方法詳解及使用
這篇文章主要介紹了Android onActivityResult和setResult方法詳解及使用的相關(guān)資料,這里提供實例,幫助大家學(xué)習(xí)理解,需要的朋友可以參考下2016-12-12

