カスタムView-ボール進捗の実装(360波進捗をシミュレート)
4520 ワード
一般的に最も一般的な方法は、sin線やベッセル曲線を描き、左から右に縦線を描き、円領域を裁断することです.
今日私が画像bitmapを使う方法は、大体の方法の原理は:
(1)まずclipPathでパークエリアを切り取り、
(2)次に4枚の図でキャンバスに描き続け、オフセット量で移動速度を制御して波のダイナミック効果を形成する.
(3)円を裁断する際に用いるclipPathという方法はandroid 4.1や4.2など一部のシステムでは円ではなく矩形に裁断され,これらのシステムに対してmanifestが必要であることに注意すべきである.xmlファイルのactivityでは、デフォルトでオンになっているため、ハードウェアを加速してオフにします.これを追加します:android:hardwareAccelerated="false"
(1)カスタム波Viewの実装:
(2)レイアウトファイルの実現:
今日私が画像bitmapを使う方法は、大体の方法の原理は:
(1)まずclipPathでパークエリアを切り取り、
(2)次に4枚の図でキャンバスに描き続け、オフセット量で移動速度を制御して波のダイナミック効果を形成する.
(3)円を裁断する際に用いるclipPathという方法はandroid 4.1や4.2など一部のシステムでは円ではなく矩形に裁断され,これらのシステムに対してmanifestが必要であることに注意すべきである.xmlファイルのactivityでは、デフォルトでオンになっているため、ハードウェアを加速してオフにします.これを追加します:android:hardwareAccelerated="false"
(1)カスタム波Viewの実装:
/**
*
* @author hjy
*
*/
public class SinkingView extends FrameLayout {
private static final int DEFAULT_TEXTCOLOT = 0xFFFFFFFF;
private static final int DEFAULT_TEXTSIZE = 25;
private float mPercent;
private Paint mPaint = new Paint();
private Bitmap mBitmap;
private Bitmap mScaledBitmap;
private float mLeft;
private int mSpeed = 15;
private int mRepeatCount = 0;
private Status mFlag = Status.NONE;
private int mTextColor = DEFAULT_TEXTCOLOT;
private int mTextSize = DEFAULT_TEXTSIZE;
public SinkingView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public void setTextColor(int color) {
mTextColor = color;
}
public void setTextSize(int size) {
mTextSize = size;
}
public void setPercent(float percent) {
mFlag = Status.RUNNING;
mPercent = percent;
postInvalidate();
}
public void setStatus(Status status) {
mFlag = status;
}
public void clear() {
mFlag = Status.NONE;
if (mScaledBitmap != null) {
mScaledBitmap.recycle();
mScaledBitmap = null;
}
if (mBitmap != null) {
mBitmap.recycle();
mBitmap = null;
}
}
@Override
protected void dispatchDraw(Canvas canvas) {
super.dispatchDraw(canvas);
int width = getWidth();
int height = getHeight();
//
Path path = new Path();
canvas.save();
path.reset();
canvas.clipPath(path);
path.addCircle(width / 2, height / 2, width / 2, Direction.CCW);
canvas.clipPath(path, Op.REPLACE);//UNION REPLACE REVERSE_DIFFERENCE XOR
if (mFlag == Status.RUNNING) {
if (mScaledBitmap == null) {
mBitmap = BitmapFactory.decodeResource(getContext().getResources(), R.drawable.wave4);
mScaledBitmap = Bitmap.createScaledBitmap(mBitmap, mBitmap.getWidth(), getHeight(), false);
mBitmap.recycle();
mBitmap = null;
mRepeatCount = (int) Math.ceil(getWidth() / mScaledBitmap.getWidth() + 0.5) + 1;
}
for (int idx = 0; idx < mRepeatCount; idx++) {
canvas.drawBitmap(mScaledBitmap, mLeft + (idx - 1) * mScaledBitmap.getWidth(), (1-mPercent) * getHeight(), null);
}
// String str = (int) (mPercent * 100) + "%";
// mPaint.setColor(mTextColor);
// mPaint.setTextSize(mTextSize);
// mPaint.setStyle(Style.FILL);
// canvas.drawText(str, (getWidth() - mPaint.measureText(str)) / 2, getHeight() / 2 + mTextSize / 2, mPaint);
mLeft += mSpeed;
if (mLeft >= mScaledBitmap.getWidth())
mLeft = 0;
//
// mPaint.setStyle(Paint.Style.STROKE);
// mPaint.setStrokeWidth(1);
// mPaint.setAntiAlias(true);
// mPaint.setColor(Color.parseColor("#03f0ee"));
// canvas.drawCircle(width / 2, height / 2, width / 2 - 2, mPaint);
postInvalidateDelayed(20);
}
canvas.restore();
}
public enum Status {
RUNNING, NONE
}
}
(2)レイアウトファイルの実現:
（3） View：
private SinkingView sv_menu_pitchs = (SinkingView) findViewById(R.id.sv_menu_pitchs);
private float percent = 0;
percent = 1.50f;
sv_menu_pitchs.setPercent(percent);