Android自定義View實現(xiàn)數(shù)字雨效果的全過程
效果圖
在安卓中多種類型的動畫,有幀動畫、補間動畫、屬性動畫,除此之外,使用自定義的View結(jié)合數(shù)學(xué)公式,就可以繪制出復(fù)雜的界面或者動畫。這篇文章記錄的是仿照黑客帝國的數(shù)字雨,來看看效果吧。
實現(xiàn)步驟
準備工作,常量的配置信息
// 文字的顏色值 final int DEFAULT_TEXT_COLOR = Color.argb(255, 0, 255, 70); // 文字大小 final int TEXT_SIZE = 24; // 普通畫筆 Paint mPaint; // 高亮畫筆 Paint mPaintLight; // 改變文字的間隔時間 int switchInternal = interval[random.nextInt(interval.length)]; // 數(shù)字落下的速度 int speed;
構(gòu)建顯示文本的內(nèi)容,因為計算機都是由0和1組成,所以這里用0和1代表它的內(nèi)容數(shù)據(jù)。
// 構(gòu)建0和1的字符串 if (contentArray == null) { contentArray = new String[2]; contentArray[0] = "0"; contentArray[1] = "1"; }
由于是隨機顯示,所以使用隨機數(shù)獲取內(nèi)容
private String getChar() { return contentArray[random.nextInt(2)]; }
由于是自定義View,所以入口就在自定義View的構(gòu)造函數(shù)中。
public NumberView(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); init(); }
在init方法中對上面的配置信息進行初始化,比如創(chuàng)建具體的畫筆顏色,文字大小等
private void init() { mPaint = new Paint(Paint.ANTI_ALIAS_FLAG); mPaint.setARGB(255, 0, 255, 70); mPaint.setTextSize(TEXT_SIZE); a = textColor >> 24 & 0xff; r = textColor >> 16 & 0xff; g = textColor >> 8 & 0xff; b = textColor & 0xff; mPaint.setARGB(a, r, g, b); mPaintLight = new Paint(Paint.ANTI_ALIAS_FLAG); mPaintLight.setARGB(255, 140, 255, 170); mPaintLight.setTextSize(TEXT_SIZE); }
在onMeasure方法中測量View的大小,View本身大小多少,這由onMeasure()決定的。
@Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { super.onMeasure(widthMeasureSpec, heightMeasureSpec); int widthSize = MeasureSpec.getSize(widthMeasureSpec); int widthMode = MeasureSpec.getMode(widthMeasureSpec); int heightSize = MeasureSpec.getSize(heightMeasureSpec); int heightMode = MeasureSpec.getMode(heightMeasureSpec); if (widthMode == MeasureSpec.EXACTLY) { mWidth = widthSize; } if (heightMode == MeasureSpec.EXACTLY) { mHeight = heightSize; } setMeasuredDimension((int) mWidth, (int) mHeight); }
onDraw()定義了如何繪制這個View,所以在onDraw方法中,必須要進行繪制操作,這樣才能顯示出來動畫。
@Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); render(canvas); rain(); } private void rain() { for (int j = 0; j < streams.length; j++) { Symbol[] symbols = (Symbol[]) streams[j]; for (int i = 0; i < symbols.length; i++) { Symbol symbol = symbols[i]; symbol.y = symbol.y >= mHeight ? 0 : symbol.y + symbol.speed; } } }
無論是怎樣的操作,自定義View總是離不開onMeasure onLayout onDraw的核心方法。比如我們要繪制一幅畫,也需要這樣設(shè)計,它的大小、位置、和繪制成什么樣。就像這些代碼的方法。 onMeasure:決定視圖的大小 onLayout:決定視圖的位置 onDraw:絕對如何畫視圖 本文章心血來潮想到了黑客帝國的動畫,就在github上參考了這個項目,參考的代碼在傳送門,致敬。
總結(jié)
到此這篇關(guān)于Android自定義View實現(xiàn)數(shù)字雨效果的文章就介紹到這了,更多相關(guān)Android自定義View實現(xiàn)數(shù)字雨內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
Android 開發(fā)中根據(jù)搜索內(nèi)容實現(xiàn)TextView中的文字部分加粗
最近遇到一個需求,需要做一個搜索功能。搜索的內(nèi)容需要加粗顯示。實現(xiàn)方法很簡單,下面通過本文給大家分享Android 開發(fā)中根據(jù)搜索內(nèi)容實現(xiàn)TextView中的文字部分加粗樣式,非常不錯,需要的朋友參考下2017-03-03Android如何獲取子View的位置及坐標(biāo)詳解
這篇文章主要給大家介紹了關(guān)于Android如何獲取子View的位置及坐標(biāo)的相關(guān)資料,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-10-10Kotlin實現(xiàn)網(wǎng)絡(luò)圖片下載和保存功能
根據(jù)Android多線程和網(wǎng)絡(luò)編程的知識講解和案例使用,使用Handler消息機制實現(xiàn)網(wǎng)絡(luò)圖片下載,并且保存到模擬器中,強化對Android多線程編程、網(wǎng)絡(luò)編程和文件讀寫的理解,這篇文章主要介紹了Kotlin實現(xiàn)網(wǎng)絡(luò)圖片下載和保存功能,需要的朋友可以參考下2023-02-02