Android自定義控件實(shí)現(xiàn)望遠(yuǎn)鏡效果
Android自定義控件今天要講到的就是望遠(yuǎn)鏡效果,那么什么是望遠(yuǎn)鏡效果,我們不妨看看下方的動(dòng)圖,看完后,相信大家就有一定的認(rèn)識(shí)了。
1.著色器
對(duì)于這種效果來說,其實(shí)實(shí)現(xiàn)起來挺簡(jiǎn)單的,但我們將會(huì)用到在三維軟件中的著色器Shader,它是用來給空白圖形上色的。用過PS的人,相信大家都知道里面有一個(gè)印章工具,印章的樣式可以是圖像,顏色,漸變色等。在Android里面,Shader的效果其實(shí)與他類似。
public Shader setShader(Shader shader)
上面是Shader的專用函數(shù),也是畫筆Paint中的函數(shù),我們今天要用到的是BitmapShader,也即是圖片來填充,它的基本用法如下:
public BitmapShader(Bitmap bitmap,TileMode tileX,TileMode tileY)
tileX用來指定當(dāng)X軸超出單張圖片大小時(shí)所使用的重復(fù)策略
tileY用來指定當(dāng)Y軸超出單張圖片大小時(shí)所使用的重復(fù)策略
而這兩個(gè)值的取值有三種,分別是:
TileMode.CLAMP:用邊緣色彩來填充多余空間,CLAMP就是以X軸填充X邊緣顏色,以Y軸填充Y軸邊緣顏色,而XY非圖片相交區(qū)域以填充Y軸的顏色繼續(xù)填充。(這里估計(jì)博主故意把貓右邊緣填充了黑色,Y邊緣填充了紅色,框起來的地方是原圖)
TileMode.REPEAT:重復(fù)原圖像來填充多余空間,其實(shí)這個(gè)模式最好理解,就是復(fù)制粘貼,X不夠的空白區(qū)域填充原圖,Y不夠的也用原圖像填充。
TileMode.MIRROR:重復(fù)使用鏡像模式的圖像來填充多余空間,有可能有的小伙伴不懂MIRROR鏡像模式,其實(shí)鏡像模式就是想鏡子一樣翻轉(zhuǎn)了圖像,如下圖所示:
2.望遠(yuǎn)鏡效果實(shí)現(xiàn)
原理已經(jīng)剖析清楚了,接著,我們就來實(shí)現(xiàn)開頭的望遠(yuǎn)鏡效果,首先,還是自定義控件,畢竟這一個(gè)專欄都是自定義控件,基本每篇都少不了這個(gè)步驟,代碼如下:
public class BitmapShaderView extends View { private Paint paint;//畫筆工具 private Bitmap bgBitmap,bitmap;//隱藏圖像以及原圖像 private int mX=-1,mY=-1;//捕獲手指的位置坐標(biāo) public BitmapShaderView(Context context) { super(context); } public BitmapShaderView(Context context, @Nullable AttributeSet attrs) { super(context, attrs); this.paint=new Paint();//初始化畫筆工具 this.bitmap= BitmapFactory.decodeResource(getResources(),R.drawable.background);//獲取原圖像 } public BitmapShaderView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); } }
詳細(xì)注解,應(yīng)該可以理解了,這里就不在做過多的贅述,接下來,我們需要捕獲手指下按,移動(dòng)以及離開屏幕的手指所在位置,也就是重寫onTouchEvent()函數(shù):
public boolean onTouchEvent(MotionEvent event) { switch (event.getAction()){ case MotionEvent.ACTION_DOWN://手指按下事件 this.mX=(int)event.getX(); this.mY=(int)event.getY(); postInvalidate();//重繪 return true; case MotionEvent.ACTION_MOVE://手指移動(dòng)事件 this.mX=(int)event.getX(); this.mY=(int)event.getY(); break; case MotionEvent.ACTION_UP://手指抬起 case MotionEvent.ACTION_CANCEL://手指離開事件 this.mX=-1; this.mY=-1; break; } postInvalidate();//重繪 return super.onTouchEvent(event); }
這里捕獲了移動(dòng)以及按下手指的坐標(biāo),這樣就可以定位望遠(yuǎn)鏡的位置,而當(dāng)手指抬起的時(shí)候,望遠(yuǎn)鏡效果就不見了,所以必須設(shè)置他們坐標(biāo)為-1。最后是繪圖代碼,onDraw()實(shí)現(xiàn):
protected void onDraw(Canvas canvas) { super.onDraw(canvas); if(this.bgBitmap==null){ this.bgBitmap=Bitmap.createBitmap(getWidth(),getHeight(),Bitmap.Config.ARGB_8888);//創(chuàng)建一個(gè)新空白位圖 Canvas canvasBg=new Canvas(this.bgBitmap); //然后對(duì)背景圖拉升后,畫到上面的位圖中 canvasBg.drawBitmap(this.bitmap,null,new Rect(0,0,getWidth(),getHeight()),this.paint); } if(this.mX!=-1 && this.mY!=-1){ //填充模式為上面講的第二種,就是復(fù)制粘貼的填充模式,但這里不會(huì)執(zhí)行 //因?yàn)槲覀兩厦鎻?qiáng)制設(shè)置了圖片的大小為整個(gè)屏幕,所以屏幕沒有空白區(qū)域 this.paint.setShader(new BitmapShader(this.bgBitmap, Shader.TileMode.REPEAT,Shader.TileMode.REPEAT)); canvas.drawCircle(this.mX,this.mY,200,this.paint); } }
這里我們首先創(chuàng)建了一個(gè)空白位圖,然后對(duì)原圖像進(jìn)行拉升后畫到這張位圖中,接著,根據(jù)設(shè)置畫筆的填充模式,這里其實(shí)沒用,是因?yàn)槲覀兝藞D像,并沒有空白區(qū)域,最后,我們根據(jù)手指坐標(biāo),將望遠(yuǎn)鏡效果繪制到手機(jī)界面中,這樣望遠(yuǎn)鏡效果的自定義控件完美實(shí)現(xiàn)了。
GitHub源代碼下載地址:點(diǎn)擊下載
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
Android N 7.0中報(bào)錯(cuò):android.os.FileUriExposedException的解決方法
這篇文章主要給大家介紹了關(guān)于在Android N 7.0中報(bào)錯(cuò):android.os.FileUriExposedException的解決方法,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面來一起看看吧2018-05-05Android Studio 3.6中新的視圖綁定工具ViewBinding 用法詳解
這篇文章主要介紹了Android Studio 3.6中新的視圖綁定工具ViewBinding 用法,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-03-03利用Kotlin開發(fā)你的第一個(gè)Android應(yīng)用
Kotlin最近真的是大熱啊,所以下面這篇文章主要給大家介紹了關(guān)于利用Kotlin開發(fā)你的第一個(gè)Android應(yīng)用的相關(guān)資料,文中將實(shí)現(xiàn)的步驟介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面來一起看看吧。2017-10-10Android運(yùn)用BroadcastReceiver實(shí)現(xiàn)強(qiáng)制下線
本篇文章主要介紹了Android運(yùn)用BroadcastReceiver實(shí)現(xiàn)強(qiáng)制下線,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-07-07AndroidStuio插件開發(fā)適用于jetbrains全家桶
這篇文章主要介紹了AndroidStuio插件開發(fā)適用于jetbrains全家桶,本文通過實(shí)例給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-12-12Android編程之SurfaceView實(shí)例詳解
這篇文章主要介紹了Android編程之SurfaceView用法,簡(jiǎn)要分析了View和SurfaceView的區(qū)別,并結(jié)合實(shí)例形式分析了SurfaceView的具體使用步驟與相關(guān)技巧,需要的朋友可以參考下2016-02-02Android中實(shí)現(xiàn)HashMap排序的方法
這篇文章主要介紹了Android中實(shí)現(xiàn)HashMap排序的方法,很經(jīng)典的一種排序算法,需要的朋友可以參考下2014-08-08Android系統(tǒng)關(guān)機(jī)的全流程解析
這篇文章主要介紹了Android系統(tǒng)關(guān)機(jī)的全流程解析,從上層空間一直深入到內(nèi)核全面講解,非常推薦!需要的朋友可以參考下2016-02-02Android實(shí)現(xiàn)分享長(zhǎng)圖并且添加全圖水印
這篇文章主要介紹了Android實(shí)現(xiàn)分享長(zhǎng)圖并且添加全圖水印的相關(guān)資料,需要的朋友可以參考下2017-03-03