自定義輪播消息控件（自定義屬性，onDraw，重寫Animation等）
最近，項(xiàng)目要求，在大屏中，顯示推送的消息，在原聲不支持的情況下，只好自定義了，現(xiàn)在把自己定義的一些基本信息整理出來，方便以后的查看和給各位開發(fā)人員提供方便，如果有什么寫的不對(duì)的地方希望大家提出來，共同學(xué)習(xí)。好了廢話不多說我先把實(shí)現(xiàn)的界面以demo的形式給大家展示出來。有興趣的同學(xué)可以繼續(xù)往下面看。（由于gif上次不成功，上傳了一個(gè)圖片，里面的消息可以上下輪播的）
Paste_Image.png
想看下效果圖的的看下此篇文章。
http://www.itdecent.cn/p/f9396f23a0c4
2首先需要定義下屬性代碼如下
<declare-styleable name="VerticalRollingTextView">
<!--文字顏色-->
<attr name="android:textColor"/>
<!--文字大小-->
<attr name="android:textSize"/>
<!--滾動(dòng)動(dòng)畫時(shí)長-->
<attr name="android:duration"/>
<!--兩次動(dòng)畫之間的間隔-->
<attr name="animInterval" format="integer"/>
</declare-styleable>
此處定義的目的可以在xml文件中使用，但是使用必須在xml加入 xmlns:app="http://schemas.android.com/apk/res-auto" 要不然自定義的 屬性就沒法識(shí)別，切記。
3下一步我們就寫控件了，讓我們集成view此處實(shí)現(xiàn)了一個(gè)構(gòu)造方法，由于自定義了屬性所以選擇第二個(gè)在此處可以初始化，paint對(duì)象，以及一些自定義參數(shù)的初始化，以及動(dòng)畫，代碼如下里面注釋很清楚了不一一解釋了
public VerticalRollingTextView(Context context, AttributeSet attrs) {
super(context, attrs);
/*去除鋸齒的作用*/
mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
mPaint.setColor(Color.BLACK);
mPaint.setTypeface(Typeface.DEFAULT);
/*初始化定義的參數(shù)*/
parseAttrs(context, attrs);
Paint.FontMetricsInt metricsInt = mPaint.getFontMetricsInt();
/*此處是計(jì)算文字頂部和ascent的差距不明白的可以查看此篇博客 http://blog.csdn.net/aigestudio/article/details/41447349*/
mTextTopToAscentOffset = metricsInt.ascent - metricsInt.top;
Log.d("measure-->", "mTextTopToAscentOffset" + mTextTopToAscentOffset);
//設(shè)置動(dòng)畫時(shí)間
mAnimation.setDuration(mDuration);
}
private void parseAttrs(Context context, AttributeSet attrs) {
/*屏幕密度設(shè)置默認(rèn)的字體大小*/
float density = getResources().getDisplayMetrics().density;
TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.VerticalRollingTextView);
mPaint.setColor(typedArray.getColor(R.styleable.VerticalRollingTextView_android_textColor, Color.BLACK));
mPaint.setTextSize(typedArray.getDimensionPixelOffset(R.styleable.VerticalRollingTextView_android_textSize, (int) (density * 14)));
mDuration = typedArray.getInt(R.styleable.VerticalRollingTextView_android_duration, mDuration);
mAnimInterval = typedArray.getInt(R.styleable.VerticalRollingTextView_animInterval, mAnimInterval);
/*注意回收*/
typedArray.recycle();
}
畫筆都已經(jīng)準(zhǔn)備好了，下一步就是需要我們進(jìn)行繪制了 也就是onDraw方法了
protected void onDraw(Canvas canvas) {
// 為了安全起見先判斷adapter是否為空
if (mDataSetAdapter == null || mDataSetAdapter.isEmpty()) {
return;
}
String text1 = mDataSetAdapter.getText(mCurrentIndex);
String text2 = mDataSetAdapter.getText(mNextIndex);
//只需要進(jìn)行一次測量
if (mOrgOffsetY == -1) {
mPaint.getTextBounds(text1, 0, text1.length(), bounds);
mOffset = (getHeight() + bounds.height()) * 0.5f;
Log.d("measure-->", "mOffset" + mOffset);
mOrgOffsetY = mCurrentOffsetY = mOffset - mTextTopToAscentOffset;
Log.d("measure-->", "mOrgOffsetY" + mOrgOffsetY);
if (mDataSetAdapter.getItemCount() == 1) {
} else {
mAnimation.updateValue(mOrgOffsetY, -2 * mTextTopToAscentOffset);
}
}
canvas.drawText(text1, 0, mCurrentOffsetY, mPaint);
Log.d("size-->", "size" + mDataSetAdapter.getItemCount());
//判斷是否一條數(shù)據(jù)
if (mDataSetAdapter.getItemCount() == 1) {
Log.d("size-->", "size" + mDataSetAdapter.getItemCount());
stop();
} else {
canvas.drawText(text2, 0, mCurrentOffsetY + mOffset + mTextTopToAscentOffset, mPaint);
}
}\
圖示輪播的消息，怎么實(shí)現(xiàn)呢 ，無非就是開啟一個(gè)線程不斷地進(jìn)行更新數(shù)據(jù)，此處輪播的那么優(yōu)雅運(yùn)用的平移動(dòng)畫 ##\
/*開啟線程實(shí)現(xiàn)輪播*/
Runnable mRollingTask = new Runnable() {
@Override
public void run() {
mAnimationEnded = false;
startAnimation(mAnimation);
postDelayed(this, mAnimInterval);
}
};
為了方便在外面調(diào)用此處我寫了一個(gè)run方法，可以直接調(diào)用run就可以輪播了
public void run() {
if (isRunning) {
return;
}
isRunning = true;
Log.d("measure-->", "mCurrentOffsetYrun" + mCurrentOffsetY);
Log.d("measure-->", "mTextTopToAscentOffsetrun" + mTextTopToAscentOffset);
if (mDataSetAdapter.getItemCount() == 1) {
} else {
mAnimation.updateValue(mCurrentOffsetY, -2 * mTextTopToAscentOffset);
}
/*調(diào)用View.post()可以保證指定方法的執(zhí)行是在之前調(diào)用的方法處理完成之后的 而不僅僅是方法調(diào)用已經(jīng)返回。*/
post(mRollingTask);
}
在說下動(dòng)畫，我重寫了，Animation 實(shí)現(xiàn)了里面applyTransformation 方法，此處用到了估值器，所以才使消息緩慢的上升
float evaluate(float fraction, float startValue, float endValue) {
return startValue + fraction * (endValue - startValue);
}
class InternalAnimation extends Animation {
float startValue;
float endValue;
@Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
if (mAnimationEnded) return;
mCurrentOffsetY = evaluate(interpolatedTime, startValue, endValue);
Log.d("measure-->", "startValue" + startValue);
Log.d("measure-->", "endValue" + endValue);
Log.d("measure-->", "mCurrentOffsetY" + mCurrentOffsetY);
if (mCurrentOffsetY == endValue) {
animationEnd();
}
postInvalidate();
}
public void updateValue(float startValue, float endValue) {
this.startValue = startValue;
this.endValue = endValue;
}
}
細(xì)心地人一經(jīng)發(fā)現(xiàn)在這里有個(gè)adapter會(huì)懷疑為啥有這個(gè)呢這個(gè)是自定義的一個(gè)方便對(duì)數(shù)據(jù)的管理，也就是一個(gè)抽象的一個(gè)類，此處里面一個(gè)泛型，所以你不管傳入的是數(shù)組還是list都可以
/**
* 作者：Harry.kong
* 郵箱：kongpengcheng@aliyun.com
* 描述：VerticalRollingTextView的數(shù)據(jù)適配器
*/
public abstract class DataSetAdapter<T> {
List<T> data = new ArrayList<>();
public DataSetAdapter() {
}
public DataSetAdapter(List<T> data) {
this.data = data;
}
/**
* @param index 當(dāng)前角標(biāo)
* @return 待顯示的字符串
*/
final public String getText(int index) {
return text(data.get(index));
}
protected abstract String text(T t);
public int getItemCount() {
return null == data || data.isEmpty() ? 0 : data.size();
}
public void setData(List<T> data) {
this.data = data;
}
public boolean isEmpty() {
return null == data || data.isEmpty();
}
}
其實(shí)工作了大家的心情都理解，能自己少寫點(diǎn)就少寫點(diǎn)，不想自己寫的完全可以拷貝我的代碼，我會(huì)詳細(xì)代碼放在我的github上面，下面我就說下具體的如何使用
1，首先在xml里面引入我們剛才定義的那個(gè)view，很簡單不貼代碼了，別忘記在xml加入我前面的提醒的那句話要不然自定義屬性不起作用
2， 實(shí)現(xiàn)adapter傳入數(shù)據(jù) vertical_rolling_textview.setDataSetAdapter(new DataSetAdapter<MessageBean>(messageTrue) {
@Override
protected String text(MessageBean s) {
return s.getMessagName();
}
});`
3，調(diào)用run方便這時(shí)候消息就可以開始輪播了，vertical_rolling_textview.run();
4，停止輪播調(diào)用vertical_rolling_textview.stop();
5，如果消息是一條數(shù)據(jù)不需要輪播vertical_rolling_textview.setOne(false);需要輪播傳入true
6，如果需要點(diǎn)擊消息實(shí)現(xiàn)此接口 vertical_rolling_textview.setOnItemClickListener();
