1，android電子書(shū)實(shí)現(xiàn)整屏翻頁(yè)功能2，android怎么實(shí)現(xiàn)ibook的翻頁(yè)頁(yè)面很長(zhǎng)可以上下拖動(dòng)3，android自定義view從零開(kāi)始實(shí)現(xiàn)書(shū)籍翻頁(yè)效果一1，android電子書(shū)實(shí)現(xiàn)整屏翻頁(yè)功能
這種實(shí)現(xiàn)效果就不涉及scrollview了1.view在上面繪制出一個(gè)屏幕大小的視圖，并繪制出文字(ondraw drawtext)2.捕獲屏幕手勢(shì)，當(dāng)有向上或向下移動(dòng)的手勢(shì)觸發(fā)時(shí)(ontouch())3.動(dòng)畫(huà)效果改變視圖(viewfipper).
2，android怎么實(shí)現(xiàn)ibook的翻頁(yè)頁(yè)面很長(zhǎng)可以上下拖動(dòng)
之前看到像ipad上的ibook的模擬書(shū)籍翻頁(yè)的特效感覺(jué)很炫，在android上也有像laputa和ireader等應(yīng)用實(shí)現(xiàn)有這個(gè)特效，在網(wǎng)上搜索了一下好像也沒(méi)有現(xiàn)成的例子，所以自己動(dòng)手實(shí)現(xiàn)了一個(gè)，現(xiàn)在將實(shí)現(xiàn)的過(guò)程記錄下來(lái)。實(shí)現(xiàn)真實(shí)的翻頁(yè)效果，為了能在翻頁(yè)的過(guò)程中看到下一頁(yè)的內(nèi)容，在翻頁(yè)之前必須準(zhǔn)備兩張頁(yè)面，一張是當(dāng)前頁(yè)，另一張是下一頁(yè)。翻頁(yè)的過(guò)程就是對(duì)這兩張頁(yè)面的剪切，組合過(guò)程。用戶看到的可以分為3部分：當(dāng)前頁(yè)的可見(jiàn)部分(下圖綠色部分)，把書(shū)頁(yè)翻起來(lái)后看到的背面區(qū)域(下圖黃色部分)，把書(shū)頁(yè)翻起來(lái)后看到的下一頁(yè)的一角(下圖綠色部分)。?假設(shè)我們已經(jīng)求得了包含黃色區(qū)域和藍(lán)色區(qū)域的path, 假設(shè)為mpath0,那么綠色區(qū)域則可以使用canvas.clippath(mpath0, region.op.xor)來(lái)剪裁繪制；而藍(lán)色區(qū)域則可以通過(guò)使用(假設(shè)黃色區(qū)域的path為mpath1)[java] view plaincopycanvas.clippath(mpath0);canvas.clippath(mpath1, region.op.difference); //繪制第一次不同于第二次的區(qū)域?qū)lippath不是很熟的童鞋可以去復(fù)習(xí)下 自帶apidemo的clipping例子。下面我們來(lái)研究如何求取mpath0：上圖黃色和藍(lán)色區(qū)域的mpath0，可以通過(guò)以下獲?。篬java] view plaincopympath0.moveto(jx, jy);mpath0.quadto(hx, hy, kx, ky);mpath0.lineto(ax, ay);mpath0.lineto(bx, by);mpath0.quadto(ex, ey, cx,cy);mpath0.lineto(fx, fy);mpath0.close();接著就是要求出繪制path0所需的各個(gè)頂點(diǎn)。我們已知的條件是：a點(diǎn)坐標(biāo)(觸摸點(diǎn))，f點(diǎn)坐標(biāo)(顯示界面的大小)，直線eh是af的垂直平分線。剩下的就變成數(shù)學(xué)問(wèn)題啦~~先來(lái)求出g點(diǎn)坐標(biāo)因?yàn)間為af中點(diǎn)：顯然gx=(ax+fx)/2; gy=(ay+fy)/2;e點(diǎn)坐標(biāo)：添加補(bǔ)助線gm，m點(diǎn)坐標(biāo)為(gx, mheight);由相似垂直三角形egm和gmf可知：em=gm*gm/mf;這樣e點(diǎn)坐標(biāo)為：(gx-em, mheight)同理可以求出h點(diǎn)坐標(biāo)。c點(diǎn)坐標(biāo)：為簡(jiǎn)化計(jì)算，我們令n點(diǎn)為ag中點(diǎn)，這樣有三角形cjf和ehf得：cx=ex- ef/2 ;c點(diǎn)坐標(biāo)為:（ex- ef/2, mheight）同理求得j點(diǎn)坐標(biāo)。以下推導(dǎo)需要較多的數(shù)學(xué)知識(shí)，不記得的童鞋，自覺(jué)復(fù)習(xí)去~~一條直線的函數(shù)為：y=ax+b;通過(guò)已知兩點(diǎn)求直線： a = (y2-y1)/(x2-x1);b = (x2*y1-y2*x1)/(x2-x1);兩條相交直線交點(diǎn)的坐標(biāo)為：x= (b2-b1)/(a1-a2);y=a1x+b1或者y=a2x+b2綜上，4點(diǎn)相交的直線的交點(diǎn)為：x=( (x4*y3-y4*x3)/(x4-x3)-(x2*y1-y2*x1)/(x2-x1)) /((y2-y1)/(x2-x1)- (y4-y3)/(x4-x3) )= ( (x4*y3-y4*x3) (x2-x1)- (x2*y1-y2*x1) (x4-x3) ) /( (y2-y1) (x4-x3)- (y4-y3) (x2-x1) )將之前求得的 a,e,c,j四個(gè)點(diǎn)帶入上式則可以求出 b. 同理可求k點(diǎn)。d點(diǎn)坐標(biāo)：d為pe的中點(diǎn)，所以：dx=((cx+bx)/2+ex)/2dy=((cy+by)/2+ey)/2同理 可求 i 點(diǎn)。通過(guò)上述求解，繪制翻頁(yè)效果的各個(gè)頂點(diǎn)均已得出，剩下的就是貼圖，繪制陰影。這部分將在于后的文章中介紹，嘻嘻，喜歡研究的童鞋可以自己試試。轉(zhuǎn)載，僅供參考。
3，android自定義view從零開(kāi)始實(shí)現(xiàn)書(shū)籍翻頁(yè)效果一
前言 ：本篇是系列博客的第三篇，這次我們要研究 書(shū)籍翻頁(yè)效果 。不知道大家平時(shí)有沒(méi)用過(guò)ireader、掌閱這些小說(shuō)軟件，里面的翻頁(yè)效果感覺(jué)十分的酷炫。有心想研究研究如何實(shí)現(xiàn)，于是網(wǎng)上找了找，發(fā)現(xiàn)這方面的教學(xué)資料非常少，所幸能找到 何明桂大大 的 android 實(shí)現(xiàn)書(shū)籍翻頁(yè)效果----原理篇 這樣的入門(mén)博客（感謝大大 orz），我們就以這篇博客為切入點(diǎn)從零實(shí)現(xiàn)我們自己的翻頁(yè)效果。由于這次坑比較深，預(yù)計(jì)會(huì)寫(xiě)好幾期，感興趣的小伙伴可以點(diǎn)下關(guān)注以便及時(shí)收到更新提醒，謝謝大家的支持 ~ 本篇只著重于思路和實(shí)現(xiàn)步驟，里面用到的一些知識(shí)原理不會(huì)非常細(xì)地拿來(lái)講，如果有不清楚的api或方法可以在網(wǎng)上搜下相應(yīng)的資料，肯定有大神講得非常清楚的，我這就不獻(xiàn)丑了。本著認(rèn)真負(fù)責(zé)的精神我會(huì)把相關(guān)知識(shí)的博文鏈接也貼出來(lái)（其實(shí)就是懶不想寫(xiě)那么多哈哈），大家可以自行傳送。為了照顧第一次閱讀系列博客的小伙伴，本篇會(huì)出現(xiàn)一些在之前 系列博客 就講過(guò)的內(nèi)容，看過(guò)的童鞋自行跳過(guò)該段即可 國(guó)際慣例，先上效果圖，本次主要實(shí)現(xiàn)了 基本的上下翻頁(yè)效果 與 右側(cè)最大翻頁(yè)距離的限制 在看這篇博客之前，希望大家能先了解一下書(shū)籍翻頁(yè)的實(shí)現(xiàn)原理，博客鏈接我已經(jīng)貼出來(lái)了。通過(guò)原理講解我們知道，整個(gè)書(shū)籍翻頁(yè)效果界面分成了三個(gè)區(qū)域， a 為當(dāng)前頁(yè)區(qū)域， b 為下一頁(yè)區(qū)域， c 為當(dāng)前頁(yè)背面，如圖所示 書(shū)籍翻頁(yè)效果的實(shí)現(xiàn)就是要以我們 觸摸屏幕位置的坐標(biāo) 為基礎(chǔ)繪制出這三個(gè)區(qū)域，形成模擬翻頁(yè)的特效。要繪制這三個(gè)區(qū)域，我們需要通過(guò)一組 特定的點(diǎn) 來(lái)完成，這些點(diǎn)的坐標(biāo)需要通過(guò)兩個(gè)已知的點(diǎn)（ 觸摸點(diǎn) 、 相對(duì)邊緣角 ）計(jì)算得到，下圖我將各個(gè)特定點(diǎn)的位置和計(jì)算公式貼出來(lái)，大家對(duì)照著原理一起理解（渣畫(huà)工望體諒 ╮(╯▽╰)╭ ），其中 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)和線劃分開(kāi)來(lái)。我們將這些點(diǎn)稱(chēng)為標(biāo)識(shí)點(diǎn)，下一步就是模擬設(shè)定 a 和 f 點(diǎn)的位置，將這組標(biāo)識(shí)點(diǎn)繪制到屏幕上來(lái)驗(yàn)證我們的計(jì)算公式是否正確，創(chuàng)建 bookpageview 實(shí)體類(lèi) mypoint 用來(lái)存放我們的標(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 的 二階貝塞爾曲線 。通過(guò)觀察分析得知， 區(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)，我們沒(méi)辦法直接從 d 出發(fā)通過(guò) path 繪制路徑連接 b 點(diǎn)（ i , k 同理），也就不能只用 path 的情況下直接繪制出 區(qū)域c ，我們需要用 porterduffxfermode 方面的知識(shí)“曲線救國(guó)”。我們?cè)囍葘Ⅻc(diǎn) a , b , d , i , k 連接起來(lái)，觀察閉合區(qū)域與 區(qū)域a 之間的聯(lián)系。修改 bookpageview 效果如圖 我們將兩條曲線也畫(huà)出來(lái)對(duì)比觀察 觀察分析后可以得出結(jié)論， 區(qū)域c 是 由直線ab,bd,dj,ik,ak連接而成的區(qū)域 減去 與區(qū)域a交集部分 后剩余的區(qū)域。于是我們?cè)O(shè)置 區(qū)域c 畫(huà)筆 xfermode 模式為 dst_atop 效果如圖 最后是 區(qū)域b ，因?yàn)?區(qū)域b 處于最底層，我們直接將 區(qū)域b 畫(huà)筆 xfe