示波器是在大學(xué)的時(shí)候老師教的，但是出來(lái)工作一直沒(méi)有用到過(guò)，漸漸的也就忘記了，現(xiàn)在重新學(xué)習(xí)一下。來(lái)看看效果圖：
這里是一個(gè)自定義的柱狀圖，然后有一個(gè)按鈕，點(diǎn)擊按鈕的時(shí)候，這里柱子會(huì)不停的運(yùn)動(dòng)，類(lèi)似于音樂(lè)播放器里示波器的跳動(dòng)。
跟前面幾個(gè)自定義view的方式類(lèi)似，重寫(xiě)了onSizeChange()方法和onDraw()方法
先列一下我們要用到的變量：
/**畫(huà)筆*/ private Paint mPaint; /**控件的寬度*/ private float mWidth; /**單個(gè)柱子的寬度*/ private float mRectWidth; /**單個(gè)柱子的高度*/ private float mRectHeight; /**柱子的總個(gè)數(shù)*/ private float mRectCount = 10; /**柱子之間的間隔*/ private int offsets = 2; /**Android中的線性漸變*/ private LinearGradient mLinearGradient; /**隨機(jī)的柱子的高度*/ private double mRandom;
所有的變量都在這里了
下面給畫(huà)筆初始化
/** * 初始化畫(huà)筆 */ private void initView() { mPaint = new Paint(); mPaint.setAntiAlias(true); }然后在onSizeChange()里面給變量賦值
@Override protected void onSizeChanged(int w, int h, int oldw, int oldh) { super.onSizeChanged(w, h, oldw, oldh); mWidth = getWidth(); mRectHeight = getHeight(); mRectWidth = (int) (mWidth * 0.6 / mRectCount); mLinearGradient = new LinearGradient(0, 0, mRectWidth, mRectHeight, Color.YELLOW, Color.BLUE, Shader.TileMode.CLAMP); mPaint.setShader(mLinearGradient); }最后繪制柱狀圖
@Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); for (int i = 0; i < mRectCount; i++) { mRandom = Math.random(); float currentHeight = (float) (mRectHeight * mRandom); canvas.drawRect( (float) (mWidth * 0.4 / 2 + mRectWidth * i + offsets), currentHeight, (float) (mWidth * 0.4 / 2 + mRectWidth * (i + 1)), mRectHeight, mPaint); } }這個(gè)時(shí)候，一個(gè)音樂(lè)播放器的示波器已經(jīng)完成了，但是，這個(gè)是靜態(tài)的，接下來(lái)，向外面暴露一個(gè)方法，用于刷新View，實(shí)現(xiàn)動(dòng)態(tài)的效果。
public void onStart() {
postInvalidateDelayed(300);
}
每間隔300ms對(duì)View進(jìn)行重繪，就可以有一個(gè)比較好的視覺(jué)效果了。
好了，最后我貼上全部的代碼：
public class MusicLine extends View { private Paint mPaint; private float mWidth; private float mRectWidth; private float mRectHeight; private float mRectCount = 10; private int offsets = 2; private LinearGradient mLinearGradient; private double mRandom; public MusicLine(Context context, AttributeSet attrs, int defStyle) { super(context, attrs, defStyle); initView(); } public MusicLine(Context context, AttributeSet attrs) { super(context, attrs); initView(); } public MusicLine(Context context) { super(context); initView(); } /** * 初始化工具類(lèi) */ private void initView() { mPaint = new Paint(); mPaint.setAntiAlias(true); } @Override protected void onSizeChanged(int w, int h, int oldw, int oldh) { super.onSizeChanged(w, h, oldw, oldh); mWidth = getWidth(); mRectHeight = getHeight(); mRectWidth = (int) (mWidth * 0.6 / mRectCount); mLinearGradient = new LinearGradient(0, 0, mRectWidth, mRectHeight, Color.YELLOW, Color.BLUE, Shader.TileMode.CLAMP); mPaint.setShader(mLinearGradient); } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); for (int i = 0; i < mRectCount; i++) { mRandom = Math.random(); float currentHeight = (float) (mRectHeight * mRandom); canvas.drawRect( (float) (mWidth * 0.4 / 2 + mRectWidth * i + offsets), currentHeight, (float) (mWidth * 0.4 / 2 + mRectWidth * (i + 1)), mRectHeight, mPaint); } } public void onStart() { postInvalidateDelayed(300); }}至此，全部完成了。
以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持武林網(wǎng)。
新聞熱點(diǎn)
疑難解答
圖片精選
