基于安卓操作系統(tǒng)的WebView翻頁特效方法
【專利摘要】本發(fā)明提供一種基于安卓操作系統(tǒng)的WebView翻頁特效方法，包括：截取顯示W(wǎng)ebView當(dāng)前頁面的WebView當(dāng)前界面，生成一張WebView當(dāng)前界面的界面位圖；用界面位圖覆蓋WebView當(dāng)前界面，將WebView當(dāng)前界面拼接到界面位圖的端部位置，然后界面靜止一定的時(shí)間，在該時(shí)間WebView加載部分目標(biāo)頁面，得到WebView新界面；界面位圖和WebView新界面整體平移，界面位圖逐漸移離屏幕，WebView新界面一邊加載目標(biāo)頁面一邊逐漸移動(dòng)，直至顯示目標(biāo)頁面的WebView新界面完全顯不在屏蒂上。切換過程中不會(huì)出現(xiàn)白屏現(xiàn)象，具有操作方便、用戶體驗(yàn)好的優(yōu)點(diǎn)。
【專利說明】基于安卓操作系統(tǒng)的WebView翻頁特效方法

【技術(shù)領(lǐng)域】
[0001] 本發(fā)明屬于信息處理【技術(shù)領(lǐng)域】，具體涉及一種基于安卓操作系統(tǒng)的WebView翻頁 特效方法。

【背景技術(shù)】
[0002] 現(xiàn)有使用安卓操作系統(tǒng)的設(shè)備通過WebView顯示網(wǎng)頁信息時(shí)，通常采用以下兩種 技術(shù)：（1) WebView不分頁，S卩：將所有相關(guān)內(nèi)容全部在同一頁面展示。該種方法存在的主要 問題為：首先，由于需要在同一頁面展示所有內(nèi)容，因此，必須通過網(wǎng)絡(luò)下載所有內(nèi)容，一方 面，從互聯(lián)網(wǎng)用戶特征考慮，用戶在瀏覽網(wǎng)頁內(nèi)容時(shí)候，只有對(duì)自己特別感興趣的內(nèi)容，才 會(huì)查閱所有內(nèi)容，大多數(shù)情況都只是查閱概要，因此，加載全部?jī)?nèi)容會(huì)浪費(fèi)流量；另一方面， 下載所有內(nèi)容，會(huì)延長(zhǎng)加載時(shí)間，延長(zhǎng)了用戶等待時(shí)間。其次，在同一頁面展示所有內(nèi)容時(shí)， 頁面長(zhǎng)度過長(zhǎng)，當(dāng)用戶滑到底端，再需要查閱頂端內(nèi)容時(shí)，需要滑動(dòng)頁面較長(zhǎng)時(shí)間，具有查 看不方便的問題。（2)傳統(tǒng)頁面切換方式：該種方式只是簡(jiǎn)單的先清空WebView原界面，然 后再加載新界面。因此，界面切換沒有自然的過渡效果，具有頁面過渡比較生硬的問題；另 夕卜，在新界面加載顯示之前，屏幕界面空白，降低了用戶的體驗(yàn)。另外，該種頁面切換方式， 必須在界面上添加某個(gè)鏈接或者按鈕，只有點(diǎn)擊了鏈接或者按鈕后才能實(shí)現(xiàn)切換，具有操 作不方便的問題。


【發(fā)明內(nèi)容】

[0003] 針對(duì)現(xiàn)有技術(shù)存在的缺陷，本發(fā)明提供一種基于安卓操作系統(tǒng)的WebView翻頁特 效方法，采用原界面位圖和WebView新界面整體平移的方式進(jìn)行界面切換，切換過程中不 會(huì)出現(xiàn)白屏現(xiàn)象；采用動(dòng)畫效果，從而提高過渡的自然美觀性；使用翻頁手勢(shì)的方式進(jìn)行 界面切換，具有操作方便的優(yōu)點(diǎn)；具有操作方便、用戶體驗(yàn)好的優(yōu)點(diǎn)。
[0004] 本發(fā)明采用的技術(shù)方案如下：
[0005] 本發(fā)明提供一種基于安卓操作系統(tǒng)的WebView翻頁特效方法，包括以下步驟：
[0006] S1，判斷WebView當(dāng)前頁面是否同時(shí)符合以下三個(gè)翻頁條件：第一，WebView當(dāng)前 頁面位于端部位置；第二，存在與所述端部位置相鄰的目標(biāo)頁面；第三，存在當(dāng)所述當(dāng)前頁 面翻頁到所述目標(biāo)頁面的翻頁手勢(shì)；如果符合，則執(zhí)行S2,否則，保持所述WebView當(dāng)前頁 面，不執(zhí)行后續(xù)翻頁流程；
[0007] S2,判斷所述翻頁手勢(shì)是否達(dá)到預(yù)設(shè)要求，如果符合，則執(zhí)行S3 ;否則，恢復(fù)顯示 所述WebView當(dāng)前頁面，不執(zhí)行后續(xù)翻頁流程；
[0008] S3,截取顯不所述WebView當(dāng)前頁面的WebView當(dāng)前界面，生成一張所述WebView 當(dāng)前界面的界面位圖；
[0009] S4,用所述界面位圖覆蓋所述WebView當(dāng)前界面，將所述WebView當(dāng)前界面拼接到 所述界面位圖的所述端部位置，然后界面靜止一定的時(shí)間，在該時(shí)間所述WebView加載部 分所述目標(biāo)頁面，得到WebView新界面；
[0010] S5,所述界面位圖和所述WebView新界面整體平移，所述界面位圖逐漸移離屏 幕，所述WebView新界面一邊加載所述目標(biāo)頁面一邊逐漸移動(dòng)，直至顯示所述目標(biāo)頁面的 WebView新界面完全顯示在所述屏幕上。
[0011] 優(yōu)選的，S1中，所述三個(gè)翻頁條件具體為：
[0012] 所述端部位置包括所述WebView當(dāng)前頁面的頁面頂端、頁面底端、頁面左端和頁 面右端；
[0013] 與所述端部位置相鄰的目標(biāo)頁面具體為：
[0014] 當(dāng)位于所述頁面頂端時(shí)，所述目標(biāo)頁面為前一個(gè)頁面；
[0015] 當(dāng)位于所述頁面底端時(shí)，所述目標(biāo)頁面為后一個(gè)頁面；
[0016] 當(dāng)位于所述頁面左端時(shí)，所述目標(biāo)頁面為前一個(gè)頁面；
[0017] 當(dāng)位于所述頁面右端時(shí)，所述目標(biāo)頁面為后一個(gè)頁面；
[0018] 所述當(dāng)前頁面翻頁到所述目標(biāo)頁面的翻頁手勢(shì)具體為：
[0019] 當(dāng)位于所述頁面頂端時(shí)，所述翻頁手勢(shì)為下拉手勢(shì)；
[0020] 當(dāng)位于所述頁面底端時(shí)，所述翻頁手勢(shì)為上拉手勢(shì)；
[0021] 當(dāng)位于所述頁面左端時(shí)，所述翻頁手勢(shì)為右拉手勢(shì)；
[0022] 當(dāng)位于所述頁面右端時(shí)，所述翻頁手勢(shì)為左拉手勢(shì)。
[0023] 優(yōu)選的，S2中，判斷所述翻頁手勢(shì)是否達(dá)到預(yù)設(shè)要求，具體為：
[0024] 當(dāng)位于所述頁面頂端時(shí)，判斷所述下拉手勢(shì)的下拉距離是否達(dá)到閾值；
[0025] 當(dāng)位于所述頁面底端時(shí)，判斷所述上拉手勢(shì)的上拉距離是否達(dá)到閾值；
[0026] 當(dāng)位于所述頁面左端時(shí)，判斷所述右拉手勢(shì)的右拉距離是否達(dá)到閾值；
[0027] 當(dāng)位于所述頁面右端時(shí)，判斷所述左拉手勢(shì)的左拉距離是否達(dá)到閾值。
[0028] 優(yōu)選的，S5中，所述界面位圖和所述WebView新界面整體平移具體為：
[0029] 所述界面位圖和所述WebView新界面以動(dòng)畫效果的顯示方式進(jìn)行整體平移。
[0030] 優(yōu)選的，所述動(dòng)畫效果為先加速后減速的平移動(dòng)畫效果。
[0031] 本發(fā)明的有益效果如下：
[0032] 本發(fā)明提供一種基于安卓操作系統(tǒng)的WebView翻頁特效方法，具有以下優(yōu)點(diǎn)：（1) 采用原界面位圖和WebView新界面整體平移的方式進(jìn)行界面切換，切換過程中不會(huì)出現(xiàn)白 屏現(xiàn)象；（2)采用動(dòng)畫效果，從而提高過渡的自然美觀性；(3)使用翻頁手勢(shì)的方式進(jìn)行界 面切換，具有操作方便的優(yōu)點(diǎn)。

【專利附圖】

【附圖說明】
[0033] 圖1為本發(fā)明提供的基于安卓操作系統(tǒng)的WebView翻頁特效方法的流程示意圖。

【具體實(shí)施方式】
[0034] 以下結(jié)合附圖對(duì)本發(fā)明進(jìn)行詳細(xì)說明：
[0035] 如圖1所示，本發(fā)明提供一種基于安卓操作系統(tǒng)的WebView翻頁特效方法，包括以 下步驟：
[0036] S1，判斷WebView當(dāng)前頁面是否同時(shí)符合以下三個(gè)翻頁條件：第一，WebView當(dāng)前 頁面位于端部位置；第二，存在與所述端部位置相鄰的目標(biāo)頁面；第三，存在當(dāng)所述當(dāng)前頁 面翻頁到所述目標(biāo)頁面的翻頁手勢(shì)；如果符合，則執(zhí)行S2,否則，保持所述WebView當(dāng)前頁 面，不執(zhí)行后續(xù)翻頁流程；
[0037] 本步驟中，目標(biāo)頁面即為需要翻頁定位到的頁面。由于端部位置包括以下四種情 況:WebView當(dāng)前頁面的頁面頂端、頁面底端、頁面左端和頁面右端；因此，與端部位置相鄰 的目標(biāo)頁面具體區(qū)分以下四種情況：
[0038] 當(dāng)位于頁面頂端時(shí)，目標(biāo)頁面為前一個(gè)頁面；
[0039] 當(dāng)位于頁面底端時(shí)，目標(biāo)頁面為后一個(gè)頁面；
[0040] 當(dāng)位于頁面左端時(shí)，目標(biāo)頁面為前一個(gè)頁面；
[0041] 當(dāng)位于頁面右端時(shí)，目標(biāo)頁面為后一個(gè)頁面；
[0042] 與上述四種情況相應(yīng)，當(dāng)前頁面翻頁到目標(biāo)頁面的翻頁手勢(shì)根據(jù)用戶使用習(xí)慣也 區(qū)分為以下四種情況：
[0043] 當(dāng)位于頁面頂端時(shí)，翻頁手勢(shì)為下拉手勢(shì)；
[0044] 當(dāng)位于頁面底端時(shí)，翻頁手勢(shì)為上拉手勢(shì)；
[0045] 當(dāng)位于頁面左端時(shí)，翻頁手勢(shì)為右拉手勢(shì)；
[0046] 當(dāng)位于頁面右端時(shí)，翻頁手勢(shì)為左拉手勢(shì)。
[0047] 以將WebView當(dāng)前頁面滑動(dòng)到頂端為例，判斷與端部位置相鄰的目標(biāo)頁面即 為：判斷前頁是否還存在內(nèi)容，如果沒有內(nèi)容，則頁面無法下拉；如果還有內(nèi)容，則控制 WebView的位置，使得WebView可以繼續(xù)下拉，根據(jù)需要，還可以顯示"下拉進(jìn)入上一頁"的 提示信息。
[0048] 本步驟中，當(dāng)需要翻頁時(shí)，不需要設(shè)置額外的頁面切換按鈕即可，從而簡(jiǎn)化了配置 復(fù)雜度，方便用戶使用。
[0049] S2,判斷所述翻頁手勢(shì)是否達(dá)到預(yù)設(shè)要求，如果符合，則執(zhí)行S3 ;否則，恢復(fù)顯示 所述WebView當(dāng)前頁面，不執(zhí)行后續(xù)翻頁流程；
[0050] 與上述四種情況相應(yīng)，判斷翻頁手勢(shì)是否達(dá)到預(yù)設(shè)要求區(qū)分為以下四種情況：
[0051] 當(dāng)位于頁面頂端時(shí)，判斷下拉手勢(shì)的下拉距離是否達(dá)到閾值；
[0052] 當(dāng)位于頁面底端時(shí)，判斷上拉手勢(shì)的上拉距離是否達(dá)到閾值；
[0053] 當(dāng)位于頁面左端時(shí)，判斷右拉手勢(shì)的右拉距離是否達(dá)到閾值；
[0054] 當(dāng)位于頁面右端時(shí)，判斷左拉手勢(shì)的左拉距離是否達(dá)到閾值。
[0055] 實(shí)際應(yīng)用中，以頁面下拉進(jìn)入上一頁為例，當(dāng)翻頁手勢(shì)符合預(yù)設(shè)要求時(shí)，可以顯示 "松手進(jìn)入上一頁"的提示信息，從而方便用戶使用。
[0056] S3,截取顯不所述WebView當(dāng)前頁面的WebView當(dāng)前界面，生成一張所述WebView 當(dāng)前界面的界面位圖；
[0057] S4,用所述界面位圖覆蓋所述WebView當(dāng)前界面，將所述WebView當(dāng)前界面拼接到 所述界面位圖的所述端部位置，然后界面靜止一定的時(shí)間，在該時(shí)間所述WebView加載部 分所述目標(biāo)頁面，得到WebView新界面；
[0058] 本步驟中，界面靜止一定時(shí)間的主要作用為：一方面，在進(jìn)行后續(xù)頁面平移操作 時(shí)，使動(dòng)畫顯示更自然，連貫性更好；另一方面，在該段時(shí)間內(nèi)，WebView可以加載部分翻頁 頁面，當(dāng)繼續(xù)后續(xù)的操作時(shí)，防止出現(xiàn)白屏現(xiàn)象。
[0059] S5,所述界面位圖和所述WebView新界面整體平移，所述界面位圖逐漸移離屏 幕，所述WebView新界面一邊加載所述目標(biāo)頁面一邊逐漸移動(dòng)，直至顯示所述目標(biāo)頁面的 WebView新界面完全顯示在所述屏幕上。
[0060] 界面位圖和WebView新界面整體平移時(shí)，為提高用戶的使用體驗(yàn)，可以使界面位 圖和WebView新界面以動(dòng)畫效果的顯示方式進(jìn)行整體平移。動(dòng)畫顯示效果可以為平移動(dòng)畫 效果。
[0061] 以上所述僅是本發(fā)明的優(yōu)選實(shí)施方式，應(yīng)當(dāng)指出，對(duì)于本【技術(shù)領(lǐng)域】的普通技術(shù)人 員來說，在不脫離本發(fā)明原理的前提下，還可以做出若干改進(jìn)和潤飾，這些改進(jìn)和潤飾也應(yīng) 視本發(fā)明的保護(hù)范圍。
【權(quán)利要求】
1. 一種基于安卓操作系統(tǒng)的WebView翻頁特效方法，其特征在于，包括以下步驟： S1，判斷WebView當(dāng)前頁面是否同時(shí)符合以下三個(gè)翻頁條件：第一，WebView當(dāng)前頁面 位于端部位置；第二，存在與所述端部位置相鄰的目標(biāo)頁面；第三，存在當(dāng)所述當(dāng)前頁面翻 頁到所述目標(biāo)頁面的翻頁手勢(shì)；如果符合，則執(zhí)行S2,否則，保持所述WebView當(dāng)前頁面，不 執(zhí)行后續(xù)翻頁流程； 52, 判斷所述翻頁手勢(shì)是否達(dá)到預(yù)設(shè)要求，如果符合，則執(zhí)行S3 ;否則，恢復(fù)顯示所述 WebView當(dāng)前頁面，不執(zhí)行后續(xù)翻頁流程； 53, 截取顯示所述WebView當(dāng)前頁面的WebView當(dāng)前界面，生成一張所述WebView當(dāng)前 界面的界面位圖； 54, 用所述界面位圖覆蓋所述WebView當(dāng)前界面，將所述WebView當(dāng)前界面拼接到所述 界面位圖的所述端部位置，然后界面靜止一定的時(shí)間，在該時(shí)間所述WebView加載部分所 述目標(biāo)頁面，得到WebView新界面； 55, 所述界面位圖和所述WebView新界面整體平移，所述界面位圖逐漸移離屏幕，所述 WebView新界面一邊加載所述目標(biāo)頁面一邊逐漸移動(dòng)，直至顯示所述目標(biāo)頁面的WebView 新界面完全顯示在所述屏幕上。
2. 根據(jù)權(quán)利要求1所述的基于安卓操作系統(tǒng)的WebView翻頁特效方法，其特征在于， S1中，所述三個(gè)翻頁條件具體為： 所述端部位置包括所述WebView當(dāng)前頁面的頁面頂端、頁面底端、頁面左端和頁面右 端； 與所述端部位置相鄰的目標(biāo)頁面具體為： 當(dāng)位于所述頁面頂端時(shí)，所述目標(biāo)頁面為前一個(gè)頁面； 當(dāng)位于所述頁面底端時(shí)，所述目標(biāo)頁面為后一個(gè)頁面； 當(dāng)位于所述頁面左端時(shí)，所述目標(biāo)頁面為前一個(gè)頁面； 當(dāng)位于所述頁面右端時(shí)，所述目標(biāo)頁面為后一個(gè)頁面； 所述當(dāng)前頁面翻頁到所述目標(biāo)頁面的翻頁手勢(shì)具體為： 當(dāng)位于所述頁面頂端時(shí)，所述翻頁手勢(shì)為下拉手勢(shì)； 當(dāng)位于所述頁面底端時(shí)，所述翻頁手勢(shì)為上拉手勢(shì)； 當(dāng)位于所述頁面左端時(shí)，所述翻頁手勢(shì)為右拉手勢(shì)； 當(dāng)位于所述頁面右端時(shí)，所述翻頁手勢(shì)為左拉手勢(shì)。
3. 根據(jù)權(quán)利要求2所述的基于安卓操作系統(tǒng)的WebView翻頁特效方法，其特征在于， S2中，判斷所述翻頁手勢(shì)是否達(dá)到預(yù)設(shè)要求，具體為： 當(dāng)位于所述頁面頂端時(shí)，判斷所述下拉手勢(shì)的下拉距離是否達(dá)到閾值； 當(dāng)位于所述頁面底端時(shí)，判斷所述上拉手勢(shì)的上拉距離是否達(dá)到閾值； 當(dāng)位于所述頁面左端時(shí)，判斷所述右拉手勢(shì)的右拉距離是否達(dá)到閾值； 當(dāng)位于所述頁面右端時(shí)，判斷所述左拉手勢(shì)的左拉距離是否達(dá)到閾值。
4. 根據(jù)權(quán)利要求1所述的基于安卓操作系統(tǒng)的WebView翻頁特效方法，其特征在于， S5中，所述界面位圖和所述WebView新界面整體平移具體為： 所述界面位圖和所述WebView新界面以動(dòng)畫效果的顯示方式進(jìn)行整體平移。
5. 根據(jù)權(quán)利要求4所述的基于安卓操作系統(tǒng)的WebView翻頁特效方法，其特征在于，所 述動(dòng)畫效果為先加速后減速的平移動(dòng)畫效果。
【文檔編號(hào)】G06F3/0481GK104216606SQ201310220459
【公開日】2014年12月17日 申請(qǐng)日期:2013年6月5日 優(yōu)先權(quán)日:2013年6月5日
【發(fā)明者】侯禮鵬 申請(qǐng)人:北京齊爾布萊特科技有限公司