Android加载动画系列—— LineWithTextLoadingAnim
有时候我们需要在一条直线上从左向右显示加载百分比,这个需求该怎么实现呢?
让我们先来看看效果图:
1、LineWithTextLoadingAnim.java源码如下:
public class LineWithTextLoadingAnim extends View { private Paint mPaint; private float mWidth = 0f; private float mHeight = 0f; private int mValue = 0; private float mPadding = 5f; public LineWithTextLoadingAnim(Context context) { this(context, null); } public LineWithTextLoadingAnim(Context context, AttributeSet attrs) { this(context, attrs, 0); } public LineWithTextLoadingAnim(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); initPaint(); } @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { super.onMeasure(widthMeasureSpec, heightMeasureSpec); mWidth = getMeasuredWidth(); mHeight = getMeasuredHeight(); } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); String text = mValue + "%"; float textLength = getFontLength(mPaint, text); float textHeight = getFontHeight(mPaint, text); if (mValue == 0) { canvas.drawText(text, mPadding, mHeight / 2 + textHeight / 2, mPaint); canvas.drawLine(mPadding + textLength, mHeight / 2, mWidth - mPadding, mHeight / 2, mPaint); } else if (mValue >= 100) { canvas.drawText(text, mWidth - mPadding - textLength, mHeight / 2 + textHeight / 2, mPaint); canvas.drawLine(mPadding, mHeight / 2, mWidth - mPadding - textLength, mHeight / 2, mPaint); } else { float w = mWidth - 2 * mPadding - textLength; canvas.drawLine(mPadding, mHeight / 2, mPadding + w * mValue / 100, mHeight / 2, mPaint); canvas.drawLine(mPadding + w * mValue / 100 + textLength, mHeight / 2, mWidth - mPadding, mHeight / 2, mPaint); canvas.drawText(text, mPadding + w * mValue / 100, mHeight / 2 + textHeight / 2, mPaint); } } private void initPaint() { mPaint = new Paint(); mPaint.setAntiAlias(true); mPaint.setStyle(Paint.Style.FILL); mPaint.setColor(Color.WHITE); mPaint.setTextSize(dip2px(10)); mPaint.setStrokeWidth(dip2px(1)); } public float getFontLength(Paint paint, String str) { Rect rect = new Rect(); paint.getTextBounds(str, 0, str.length(), rect); return rect.width(); } public float getFontHeight(Paint paint, String str) { Rect rect = new Rect(); paint.getTextBounds(str, 0, str.length(), rect); return rect.height(); } public int dip2px(float dpValue) { final float scale = getContext().getResources().getDisplayMetrics().density; return (int) (dpValue * scale + 0.5f); } public void setValue(int value) { this.mValue = value; invalidate(); } }
2、接下来我们在layout中引用自定义的动画控件,如下所示:
<com.cyril.loadinganim.LineWithTextLoadingAnim android:id="@+id/linewithtext" android:layout_width="match_parent" android:layout_height="10dp" />
3、然后在Activity中实现动画的播放和停止,使用事例如下:
首先我们需要用到Handler来更新动画
private LineWithTextLoadingAnim lineWithTextLoadingAnim; private int mValueLinWithText = 0; private Timer mTimerLineWithText = new Timer();
private void startLineWithText() { mValueLinWithText = 0; if (mTimerLineWithText != null) { mTimerLineWithText.cancel(); } mTimerLineWithText = new Timer(); timerTaskLineWithText(); } public void timerTaskLineWithText() { mTimerLineWithText.schedule(new TimerTask() { @Override public void run() { if (mValueLinWithText < 100) { mValueLinWithText++; Message msg = mHandler.obtainMessage(2); msg.arg1 = mValueLinWithText; mHandler.sendMessage(msg); } else { mTimerLineWithText.cancel(); } } }, 0, 50); }
private Handler mHandler = new Handler() { @Override public void handleMessage(Message msg) { super.handleMessage(msg); if (msg.what == 2) { lineWithTextLoadingAnim.setValue(msg.arg1); } } };
然后在onCreate方法中调用相应的方法
lineWithTextLoadingAnim = (LineWithTextLoadingAnim) findViewById(R.id.linewithtext); startLineWithText();
4、 戳这里,小编带你去源码的下载地址:http://download.csdn.net/detail/zhimingshangyan/9582830