android特效,android特效list

android卡片上下切換特效

實(shí)現(xiàn)了在android實(shí)現(xiàn)左右滑動(dòng)切換界面的效果?

創(chuàng)新互聯(lián)是由多位在大型網(wǎng)絡(luò)公司、廣告設(shè)計(jì)公司的優(yōu)秀設(shè)計(jì)人員和策劃人員組成的一個(gè)具有豐富經(jīng)驗(yàn)的團(tuán)隊(duì)，其中包括網(wǎng)站策劃、網(wǎng)頁美工、網(wǎng)站程序員、網(wǎng)頁設(shè)計(jì)師、平面廣告設(shè)計(jì)師、網(wǎng)絡(luò)營銷人員及形象策劃。承接：成都網(wǎng)站建設(shè)、成都做網(wǎng)站、網(wǎng)站改版、網(wǎng)頁設(shè)計(jì)制作、網(wǎng)站建設(shè)與維護(hù)、網(wǎng)絡(luò)推廣、數(shù)據(jù)庫開發(fā),以高性價(jià)比制作企業(yè)網(wǎng)站、行業(yè)門戶平臺(tái)等全方位的服務(wù)。

這是實(shí)現(xiàn)了在android實(shí)現(xiàn)左右滑動(dòng)切換界面的效果，該效果的源碼下載，請(qǐng)到源碼天堂下載吧，喜歡的朋友可以研究一下。?

布局文件??

xml?version="1.0"?encoding="utf-8"? LinearLayout?xmlns:android="; android:id="@+id/layContain" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="horizontal" android:background="@drawable/bg" !--?android:background="#FFC0CB"-- FrameLayout android:layout_width="fill_parent" android:layout_height="fill_parent" LinearLayout android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="horizontal" LinearLayout android:id="@+id/layFirst" android:layout_width="400px" android:layout_height="fill_parent" android:orientation="vertical" android:layout_marginBottom="50dp" /LinearLayout LinearLayout android:id="@+id/laySec" android:layout_width="400px" android:layout_height="fill_parent" android:orientation="vertical"? /LinearLayout LinearLayout android:id="@+id/layThird" android:layout_width="400px" android:layout_height="fill_parent" android:orientation="vertical"? /LinearLayout LinearLayout android:id="@+id/layFourth" android:layout_width="400px" android:layout_height="fill_parent" android:orientation="vertical"? /LinearLayout /LinearLayout LinearLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal|bottom" android:layout_marginBottom="40dp" TextView android:id="@+id/roll_dot1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="." android:textSize="50dp" android:textColor="#ffffff" / TextView android:id="@+id/roll_dot2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="." android:textSize="50dp" android:textColor="#000000" / TextView android:id="@+id/roll_dot3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="." android:textSize="50dp" android:textColor="#000000" / TextView android:id="@+id/

Android在canvas中實(shí)現(xiàn)高性能的煙花/粒子特效

新年到了，本文將展示通過自定義view繪制煙花效果的案例，同時(shí)介紹一種優(yōu)化canvas繪制時(shí)的性能的方法.

每點(diǎn)擊一下屏幕會(huì)產(chǎn)生一枚煙花，煙花飛到最上空會(huì)炸裂成60~100個(gè)碎片，

同屏可能有上千個(gè)粒子在不停更新它的位置.

github

這時(shí)候功能基本實(shí)現(xiàn)了，剩下的就是將每一個(gè)煙花繪制在canvas上，通常我們會(huì)這樣寫

然而你會(huì)發(fā)現(xiàn)性能很糟糕,幀數(shù)隨著粒子數(shù)的增加直線下降直到個(gè)位數(shù)，優(yōu)化如下

some codes were from Daniel Shiffman

Android自定義View——從零開始實(shí)現(xiàn)書籍翻頁效果（一）

前言 ：本篇是系列博客的第三篇，這次我們要研究 書籍翻頁效果 。不知道大家平時(shí)有沒用過iReader、掌閱這些小說軟件，里面的翻頁效果感覺十分的酷炫。有心想研究研究如何實(shí)現(xiàn)，于是網(wǎng)上找了找，發(fā)現(xiàn)這方面的教學(xué)資料非常少，所幸能找到 何明桂大大 的 Android 實(shí)現(xiàn)書籍翻頁效果----原理篇 這樣的入門博客（感謝大大 Orz），我們就以這篇博客為切入點(diǎn)從零實(shí)現(xiàn)我們自己的翻頁效果。由于這次坑比較深，預(yù)計(jì)會(huì)寫好幾期，感興趣的小伙伴可以點(diǎn)下關(guān)注以便及時(shí)收到更新提醒，謝謝大家的支持 ~

本篇只著重于思路和實(shí)現(xiàn)步驟，里面用到的一些知識(shí)原理不會(huì)非常細(xì)地拿來講，如果有不清楚的api或方法可以在網(wǎng)上搜下相應(yīng)的資料，肯定有大神講得非常清楚的，我這就不獻(xiàn)丑了。本著認(rèn)真負(fù)責(zé)的精神我會(huì)把相關(guān)知識(shí)的博文鏈接也貼出來（其實(shí)就是懶不想寫那么多哈哈），大家可以自行傳送。為了照顧第一次閱讀系列博客的小伙伴，本篇會(huì)出現(xiàn)一些在之前 系列博客 就講過的內(nèi)容，看過的童鞋自行跳過該段即可

國際慣例，先上效果圖，本次主要實(shí)現(xiàn)了 基本的上下翻頁效果 與 右側(cè)最大翻頁距離的限制

在看這篇博客之前，希望大家能先了解一下書籍翻頁的實(shí)現(xiàn)原理，博客鏈接我已經(jīng)貼出來了。通過原理講解我們知道，整個(gè)書籍翻頁效果界面分成了三個(gè)區(qū)域， A 為當(dāng)前頁區(qū)域， B 為下一頁區(qū)域， C 為當(dāng)前頁背面，如圖所示

書籍翻頁效果的實(shí)現(xiàn)就是要以我們 觸摸屏幕位置的坐標(biāo) 為基礎(chǔ)繪制出這三個(gè)區(qū)域，形成模擬翻頁的特效。要繪制這三個(gè)區(qū)域，我們需要通過一組 特定的點(diǎn) 來完成，這些點(diǎn)的坐標(biāo)需要通過兩個(gè)已知的點(diǎn)（ 觸摸點(diǎn) 、 相對(duì)邊緣角 ）計(jì)算得到，下圖我將各個(gè)特定點(diǎn)的位置和計(jì)算公式貼出來，大家對(duì)照著原理一起理解（渣畫工望體諒 ╮(╯▽╰)╭ ），其中 b 點(diǎn)是由 ae 和 cj 的交點(diǎn)， k 點(diǎn)是由 ah 和 cj 的交點(diǎn)

簡(jiǎn)單總結(jié)一下， a 是觸摸點(diǎn)， f 是觸摸點(diǎn)相對(duì)的邊緣角， eh 我們?cè)O(shè)置為 af 的垂直平分線，則 g 是 af 的中點(diǎn)， ab 、 ak 、 dj 是 直線 ； 曲線cdb 是起點(diǎn)為 c ，控制點(diǎn)為 e ，終點(diǎn)為 b 的 二階貝塞爾曲線 ； 曲線kij 是起點(diǎn)為 k ，控制點(diǎn)為 h ，終點(diǎn)為 j 的 二階貝塞爾曲線 ，區(qū)域 A 、 B 、 C 就由這些點(diǎn)和線劃分開來。我們將這些點(diǎn)稱為標(biāo)識(shí)點(diǎn)，下一步就是模擬設(shè)定 a 和 f 點(diǎn)的位置，將這組標(biāo)識(shí)點(diǎn)繪制到屏幕上來驗(yàn)證我們的計(jì)算公式是否正確，創(chuàng)建 BookPageView

實(shí)體類 MyPoint 用來存放我們的標(biāo)識(shí)點(diǎn)坐標(biāo)

界面布局：

在Activity中進(jìn)行注冊(cè)

效果如圖

前文我們提到 ab 、 ak 、 dj 是 直線 ； 曲線cdb 是起點(diǎn)為 c ，控制點(diǎn)為 e ，終點(diǎn)為 b 的 二階貝塞爾曲線 ； 曲線kij 是起點(diǎn)為 k ，控制點(diǎn)為 h ，終點(diǎn)為 j 的 二階貝塞爾曲線 。通過觀察分析得知， 區(qū)域A 是由View 左上角 ， 左下角 ， 曲線cdb ， 直線 ab 、 ak ， 曲線kij ， 右上角 連接而成的區(qū)域，修改 BookPageView ，利用 path 繪制處 區(qū)域A

效果如圖

區(qū)域C 理論上應(yīng)該是由點(diǎn) a , b , d , i , k 連接而成的閉合區(qū)域,但由于 d 和 i 是曲線上的點(diǎn)，我們沒辦法直接從 d 出發(fā)通過 path 繪制路徑連接 b 點(diǎn)（ i , k 同理），也就不能只用 path 的情況下直接繪制出 區(qū)域C ，我們需要用 PorterDuffXfermode 方面的知識(shí)“曲線救國”。我們?cè)囍葘Ⅻc(diǎn) a , b , d , i , k 連接起來，觀察閉合區(qū)域與 區(qū)域A 之間的聯(lián)系。修改 BookPageView

效果如圖

我們將兩條曲線也畫出來對(duì)比觀察

觀察分析后可以得出結(jié)論， 區(qū)域C 是 由直線ab,bd,dj,ik,ak連接而成的區(qū)域 減去 與區(qū)域A交集部分 后剩余的區(qū)域。于是我們?cè)O(shè)置 區(qū)域C 畫筆 Xfermode 模式為 DST_ATOP

效果如圖

最后是 區(qū)域B ，因?yàn)?區(qū)域B 處于最底層，我們直接將 區(qū)域B 畫筆 Xfermode 模式設(shè)為 DST_ATOP ，在 區(qū)域A、C 之后繪制即可，修改 BookPageView

效果如圖

翻頁可以從右下方翻自然也可以從右上方翻，我們將 f 點(diǎn)設(shè)在右上角，由于View上下兩部分是呈 鏡像 的，所以各標(biāo)識(shí)點(diǎn)的位置也應(yīng)該是鏡像對(duì)應(yīng)的，因?yàn)?區(qū)域B和C 的繪制與 f 點(diǎn)沒有關(guān)系，所以我們只需要修改 區(qū)域A 的繪制邏輯，新增 getPathAFromTopRight() 方法

效果如圖

之前由于測(cè)試效果沒有對(duì)View的大小進(jìn)行重新測(cè)量，在實(shí)現(xiàn)觸摸翻頁之前先把這個(gè)結(jié)了。重寫View的 onMeasure() 方法

我們的需求是，在上半部分翻頁時(shí) f 點(diǎn)在右上角，在下半部分翻頁時(shí) f 則在右下角，當(dāng)手指離開屏幕時(shí)回到 初始狀態(tài) ，根據(jù)需求，修改 BookPageView

在Activity中監(jiān)聽View的 onTouch 狀態(tài)

注意，要設(shè)置 android:clickable 為 true ，否則無法監(jiān)聽到 ACTION_MOVE 和 ACTION_UP 狀態(tài)

效果如圖

到這里我們已經(jīng)實(shí)現(xiàn)了基本的翻頁效果，但要還原真實(shí)的書籍翻頁效果，我們還需要設(shè)置一些限制條件來完善我們的項(xiàng)目

對(duì)于一般的書本來說，最左側(cè)應(yīng)該是釘起來的，也就是說如果我們從右側(cè)翻頁，翻動(dòng)的距離是 有限制的 ，最下方翻頁形成的曲線起點(diǎn)（ c 點(diǎn)）的x坐標(biāo)不能小于0（上方同理），按照這個(gè)限定條件，修改我們的 BookPageView

效果如圖

至此本篇教程就告一段落了，當(dāng)然還有許多功能需要繼續(xù)完善，例如橫向翻頁、翻頁動(dòng)畫、陰影效果等等，這些都會(huì)在后面的教程中一一解決。如果大家看了感覺還不錯(cuò)麻煩點(diǎn)個(gè)贊，你們的支持是我最大的動(dòng)力~

分享標(biāo)題：android特效,android特效list
本文路徑：http://muchs.cn/article24/phjjje.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供靜態(tài)網(wǎng)站、搜索引擎優(yōu)化、云服務(wù)器、自適應(yīng)網(wǎng)站、網(wǎng)站維護(hù)、標(biāo)簽優(yōu)化

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)