天天看點

Android 使用ViewPager結合PhotoView開源元件實作網絡圖檔線上浏覽功能

  在實際的開發中,我們市場會遇到這樣的情況:點選某圖檔,浏覽某清單(某清單詳情)中的所有圖檔資料,當然,這些圖檔是可以放大和縮小的,比如我們看下百度貼吧的浏覽大圖的效果:

Android 使用ViewPager結合PhotoView開源元件實作網絡圖檔線上浏覽功能

 連結

  這種功能,在一些app中是必不可少的!那如何實作呢?接下來,我将介紹通過ViewPager結合PhotoView開源元件,實作這麼樣的經典效果!

  關于ViewPager如何使用,此文不多介紹,網絡上太多相關的知識了;而PhotoView,因為它是一個開源的元件,是以如果你不深入研究它的話,隻需要掌握它基本的用法即可!

  何為PhotoView?

  PhotoView特性:

    支援單點/多點觸摸,即時縮放圖檔;

    支援平滑滾動;

    在滑動父控件下能夠運作良好;(例如:ViewPager)

    當使用者的觸點改變時可以觸發通知。

  當你了解了基本的知識後,下面直接帶你進入執行個體:

1. 先定義網絡請求,實作圖檔清單:

 1.1 清單樣式

Android 使用ViewPager結合PhotoView開源元件實作網絡圖檔線上浏覽功能

 1.2 擴充卡

  注; Adapter中主要添加了一個回調接口,當你單機圖檔的時候,進入下一級圖檔浏覽頁面!

2. 清單邏輯實作,及點選某一個圖檔,進入下一級頁面,該頁面即為圖檔浏覽頁面:

3. 圖檔浏覽頁面,使用ViewPager實作突破浏覽:

 3.1 ViewPager定義

注: ViewPager為圖檔滑動浏覽容器,ImageView為傳回按鈕(傳回到上一級頁面)

 3.2 ViewPager邏輯實作:

注: 設定ViewPager基本資訊,并通過viewPager.setCurrentItem來定義目前顯示哪一個圖檔,(位置的資訊由上一級頁面傳遞過來); 

 3.3 在ViewPager擴充卡PagerAdapter中實作網絡圖檔的加載浏覽:

注: 此處重點是兩個方法,instantiateItem主要是加載View,在此處,通過ImageLoader加載網絡圖檔;destroyItem中需要移除該View,避免View重複加載。

  基本上,通過以上方法,就可以實作網絡圖檔線上浏覽功能了,讓我們看下效果吧:

Android 使用ViewPager結合PhotoView開源元件實作網絡圖檔線上浏覽功能

繼續閱讀