我們現(xiàn)在來開發(fā)一個圖片查看原圖的功能乍钻。主要功能如下:
1肛循、點擊圖片進入查看原圖頁面。
2银择、在原圖頁面可以對圖片進行操作:
2.1多糠、單擊任意位置/上滑下滑手勢,則退出查看原圖頁面浩考。
2.2巡李、雙擊任意位置汁展,第一次雙擊放大圖片炸枣、第二次雙擊縮小圖片踊挠。
2.3、支持縮放手勢袜瞬,對圖片進行縮放怜俐。
2.4、左右滑動進行圖片的切換邓尤。
2.5拍鲤、圖片放大時可以對圖片進行拖動,以查看全圖汞扎。
2.6季稳、首次加載時,會有加載中動畫澈魄,加載失敗景鼠,再次進入會重新加載。
好痹扇,我們現(xiàn)在就開始吧莲蜘!
一、創(chuàng)建項目帘营,完成初始界面。
1逐哈、創(chuàng)建項目芬迄。(這里不做陳述了)
2、創(chuàng)建初始界面昂秃。(一個圖片展示列表禀梳,點擊每個圖片可以進入查看原圖頁面)。
效果圖:
二肠骆、創(chuàng)建原圖查看頁面
1算途、創(chuàng)建查看原圖控制器,添加collectionView和pageControlLabel蚀腿。
其中collectionView用于顯示圖片嘴瓤,pageControlLabel用于顯示第幾張圖片扫外。
collectionView設(shè)置為橫向滑動。
2廓脆、創(chuàng)建collectionViewCell筛谚。里面添加ScrollView和UIImageView。
3停忿、給scrollView和imageView添加手勢驾讲。(單擊、雙擊席赂、上下滑動吮铭、左滑、右滑颅停、長按谓晌、雙指展開捏合)
其中單擊、雙擊便监、上下滑動扎谎、左滑、右滑烧董、雙指展開捏合毁靶,這些手勢都是任意位置都可以使用,因此我把這些手勢添加到了scrollView上面逊移;而長按手勢预吆,我給添加到了imageView上面。
注意:單擊和雙擊手勢想要共存胳泉,需要添加一句代碼:
?[tapBySingleClickrequireGestureRecognizerToFail:tapByDoubleClick];//點擊手勢和雙擊手勢共存拐叉,當沒有檢測到doubleTapGestureRecognizer 或者 檢測doubleTapGestureRecognizer失敗,singleTapGestureRecognizer才有效
4扇商、雙擊手勢凤瘦、雙指捏合展開手勢的特殊處理。
雙擊手勢:
雙擊手勢需要判斷是連續(xù)多次點擊的情況案铺。只有連續(xù)兩次點擊的時候蔬芥,才可以執(zhí)行放大和縮小功能;連續(xù)3次點擊的話控汉,不執(zhí)行笔诵。
首先設(shè)置一個全局變量,用于判斷是連續(xù)兩次點擊還是連續(xù)3次點擊姑子。
雙指捏合展開手勢:
因為我們將放大縮小手勢添加到了scrollView乎婿,所以,我們需要在scrollView的代理方法-(UIView*)viewForZoomingInScrollView:(UIScrollView*)scrollView中街佑,指定放大縮小的對象谢翎。并且在動畫結(jié)束時捍靠,讓圖片居中顯示。
5岳服、添加block回調(diào)方法剂公,用于處理退出、左滑吊宋、右滑纲辽、長按等操作。
完成璃搜!看一下效果如何拖吼。