本 文實現的是類似于相冊瀏覽的功能,在這里我準備了六張圖片,僅供參考。
具體來說,就是首頁有六張小圖片(用九宮格做法實現,這里不做詳解),點擊對應的圖片去瀏覽對應的大圖,在大圖頁面顯示當前是第幾張圖片。基本的邏輯就是,當我點擊對應的小圖的時候,我把對應的下標傳到大圖界面,并在大圖顯示。同時,當我滑動大圖界面的時候我先獲取到當前的圖片的位置和偏移量,然后顯示對應的圖片和圖上的當前頁數。
是的,基本的邏輯就是這么簡單,我相信只要去寫就能寫出來。但是為了保證不讓控制器的代碼顯得冗余并讓每個模塊的功能獨立出來,我在這里把代碼進行了抽離,每個view每一個功能,這樣降低了耦合性并能讓控制的代碼減少很多。
具體的代碼如下:
這個是我的demo的層級結構圖。
這是根視圖控制器里面的代碼。
這是PhotoImageVIew的類方法。
對應的類方法的實現。
這對應的是PhotoVIew的代碼。
下面是滾動視圖內的代碼:
為了抽取功能,我建了分類
在這里面我聲明了一個代理,是為了在我滑動的時候把對應的圖片的當前的頁數傳到控制器里面去。
這是滾動視圖控制器的的內容。
為了實現對圖片的縮放功能,我又單獨建了一個繼承自scrollVIew的類,目的是為了實現對大圖的縮放功能,實現雙擊對圖片進行縮放,單機圖片回到九宮格小圖界面。同時,這里實現了另一個效果,就是當我對某一個圖片進行縮放以后,然后滑動到其他圖片,再從其他圖片界面回到被進行過縮放的圖片界面的時候,被縮放的圖片恢復到原狀。為了實現這樣的功能,我得創建一個imageView,目的是記錄我縮放過的圖片,在圖片縮放的時候把它保存起來,然后當我從被縮放的界面劃走的時候我再調用方法,讓被縮放的圖片回到原狀。同時我這里對大圖和小圖做了處理。
我一直覺得,一篇技術文章沒有demo,那就是在耍流氓。在這附上demo地址:
https://github.com/15221532825/picture-browser
以上僅供參考,謝謝。有不足之處歡迎指正,謝謝!親,記得修改里面pch文件路徑哦!
一個喜歡編碼,追求編碼完美的人,努力保持內心的善良與純凈。