【移動(dòng)應(yīng)用開(kāi)發(fā)技術(shù)】Android貝塞爾曲線(xiàn)初步學(xué)習(xí)第二課仿QQ未讀消息氣泡拖拽黏連效果

上一節(jié)初步了解了Android端的貝塞爾曲線(xiàn)，這一節(jié)就舉個(gè)栗子練習(xí)一下，仿QQ未讀消息氣泡，是最經(jīng)典的練習(xí)貝塞爾曲線(xiàn)的東東，效果如下附上github源碼地址：/MonkeyMushroom/DragBubbleView

歡迎star~大體思路就是畫(huà)兩個(gè)圓，一個(gè)黏連小球固定在一個(gè)點(diǎn)上，一個(gè)氣泡小球跟隨手指的滑動(dòng)改變坐標(biāo)。隨著兩個(gè)圓間距越來(lái)越大，黏連小球半徑越來(lái)越小。當(dāng)間距小于一定值，松開(kāi)手指氣泡小球會(huì)恢復(fù)原來(lái)位置；當(dāng)間距超過(guò)一定值之后，黏連小球消失，氣泡小球繼續(xù)跟隨手指移動(dòng)，此時(shí)手指松開(kāi)，氣泡小球消失~1、首先老一套~新建attrs.xml文件，編寫(xiě)自定義屬性，新建DragBubbleView繼承View，重寫(xiě)構(gòu)造方法，獲取自定義屬性值，初始化Paint、Path等東東，重寫(xiě)onMeasure計(jì)算寬高，這里不再啰嗦~2、在onSizeChanged方法中確定黏連小球和氣泡小球的圓心坐標(biāo)，這里我們?nèi)捀叩囊话耄?、經(jīng)分析氣泡小球有以下幾個(gè)狀態(tài)：默認(rèn)、拖拽、移動(dòng)、消失，我們這里定義一下，方便根據(jù)不同的狀態(tài)分析不同情況：4、重寫(xiě)onTouchEvent方法，其中d代表兩圓圓心間距，maxD代表可拖拽的最大間距：如果控件外面有嵌套ListView、RecyclerView等攔截焦點(diǎn)的控件，那就在ACTION_DOWN中請(qǐng)求父控件不攔截事件：然后ACTION_UP再把事件還回去：5、在onDraw方法中畫(huà)圓、畫(huà)貝賽爾曲線(xiàn)、畫(huà)消息個(gè)數(shù)文本：其中計(jì)算二階貝塞爾曲線(xiàn)做需要的起點(diǎn)、終點(diǎn)和控制點(diǎn)坐標(biāo)，順序是moveToA,quadToB,lineToC,quadToD,close

先來(lái)張示意圖：再上代碼6、氣泡復(fù)原的動(dòng)畫(huà)，使用估值器計(jì)算坐標(biāo)7、順便來(lái)個(gè)氣泡狀態(tài)的監(jiān)聽(tīng)器，方便外部調(diào)用監(jiān)聽(tīng)其狀態(tài)：8、關(guān)于氣泡爆炸的動(dòng)畫(huà)，思路就是放幾張圖片到drawable里，然后動(dòng)態(tài)計(jì)數(shù)重繪，在onDraw中調(diào)用canvas.drawBitmap()方法，具體如下：在構(gòu)造方法中：然后在手指抬起的時(shí)候使用如下動(dòng)畫(huà)：最后在onDraw中：9、在布局文件中使用該控件，并使用自定義屬性：其中android:clipChildren=”false”這個(gè)屬性可以使根布局下的子控件超出本身控件范圍的大小，加上這個(gè)屬性就可以滿(mǎn)屏幕隨意拖拽而不必拘泥于它本身的大小了，炒雞方便~還有如果覺(jué)得在屬性中設(shè)置消息個(gè)數(shù)不方便，需要在代碼中動(dòng)態(tài)獲取數(shù)據(jù)并設(shè)置的話(huà)，只要在DragBubbleView中添加一個(gè)方法即可10、在