最近,制作一个app,需要模拟一个电池电量的进度条,根据电量多少来设置百分比,进度条不断上下滚动,就像平时手机充电一样的电池电量进度条。我就自定义view实现了电量进度条。修改图片就可以达到自己想要的效果
一、自定义View,Battery.java,循环刷新界面,两张图片上下滚动,达到不断向右移动的效果。挺有意思的
package com.example.battery; import android.content.Context; import android.content.res.Resources; import android.graphics.Bitmap; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.graphics.drawable.BitmapDrawable; import android.os.Handler; import android.os.Message; import android.util.AttributeSet; import android.view.View; public class Battery extends View { public float currentX = 80; public float currentY = 80; private float secondY = 80; private Paint mPaint = new Paint(); private Context mContext; private Handler mHandler; private Bitmap mBmp; private int speedTime = 20; private float with = 200; private float height = 50; private float percentage = 0.5f; public Battery(Context context) { super(context); this.mContext = context; } public Battery(Context context, AttributeSet set) { super(context, set); this.mContext = context; init(); } public void onDraw(Canvas canvas) { super.onDraw(canvas); with = this.getWidth(); height = this.getHeight(); mPaint.setColor(Color.BLUE); Resources res = mContext.getResources(); BitmapDrawable bmpDraw = (BitmapDrawable) res .getDrawable(R.drawable.loading_pic); mBmp = bmpDraw.getBitmap(); canvas.clipRect(0, 0, with*percentage, height); canvas.drawBitmap(mBmp, 0, currentY, mPaint); canvas.drawBitmap(mBmp, 0, secondY, mPaint); } private void init() { percentage = 0; mHandler = new Handler() { public void handleMessage(Message msg) { switch (msg.what) { case 1: currentX ++; currentY ++; if (mBmp != null && currentY > mBmp.getHeight()){ currentY = -mBmp.getHeight(); } if (mBmp != null){ secondY = currentY+mBmp.getHeight(); if (secondY >= mBmp.getHeight()){ secondY = currentY-mBmp.getHeight(); } } percentage = percentage + 0.003f; if (percentage > 1){ percentage = 0; } // 每次计算后都发送消息进入下一次循环,并刷新界面 mHandler.sendEmptyMessageDelayed(1, speedTime); postInvalidate(); break; } super.handleMessage(msg); postInvalidate(); } }; // 首次循环刷新界面 mHandler.sendEmptyMessageDelayed(1, speedTime); } }
二、MainActivity
package com.example.battery; import android.app.Activity; import android.os.Bundle; public class MainActivity extends Activity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); } }
三、activity_main
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_gravity="center" android:gravity="center" > <com.example.battery.Battery android:layout_width="300dp" android:layout_height="10dp" android:layout_gravity="center" android:gravity="center" android:padding="10dp" /> </LinearLayout>
四、附图片效果
五、下载路径
下载:http://download.csdn.net/detail/lqw770737185/7824695</>
本文地址:http://www.cnblogs.com/liqw/p/3938422.html