

透明H5(webView)效果的實現(xiàn)
一個完全透明的webView加載H5頁面的效果的實現(xiàn),就相當(dāng)于是一個半透明的遮罩層,上面有一個不透明的圖片,一般原生的帶遮罩層的彈框會采用這種方式,如果是原生代碼實現(xiàn),就簡單的多了,視圖的疊加就可以搞定,但如果整個頁面包括遮罩層都要用webView加載H5來實現(xiàn)的話,就會有點兒復(fù)雜,這一效果還是花費(fèi)了好一番功夫,在實際的開發(fā)過程中,發(fā)現(xiàn)了webView從未接觸過的奇妙的一面:_UIWebViewScrollView、UIWebBrowserView。
起初,是要設(shè)置webView的顏色和透明度(不是整體的alpha),但是發(fā)現(xiàn)無論怎么操作都不可以,中間的那部分區(qū)域也無法改變顏色;于是使用下面遞歸的方式輸出了WebView中所有繼承于UIView的子視圖;
輸出結(jié)果:
WebView 的子視圖 : Optional(_UIWebViewScrollView)
WebView 的子視圖 : Optional(UIWebBrowserView)
結(jié)果就發(fā)現(xiàn)了兩個類:_UIWebViewScrollView、UIWebBrowserView;這是兩個從來沒見過的類,但是從名字也大致能看出來在什么位置;但是我很奇怪的是為什么沒有UIScrollView,或者還是這個_UIWebViewScrollView事實上和我們直接調(diào)用的webView.scrollView有著什么聯(lián)系,但是webView的scrollView屬性繼承于UIScrollView,UIScrollView繼承于UIView,中間的繼承關(guān)系中也并未出現(xiàn)_UIWebViewScrollView;這也是我疑惑的地方;
_UIWebViewScrollView并不是webView中類型為UIScrollView的屬性scrollView中的,而是構(gòu)成webView的一個子視圖;
UIWebBrowserView是在_UIWebViewScrollView上面的一個子視圖;如果傳入?yún)?shù)是webView.scrollView而不是webView,就會發(fā)現(xiàn)只有UIWebBrowserView輸出了,也就是說事實上UIWebBrowserView是webView的屬性scrollView上的一個子視圖
這個關(guān)系理清楚之后就知道為什么設(shè)置不了webView的clearColor了,只要使用遞歸設(shè)置這兩個子視圖的背景色為clearColor,同時,設(shè)置
webView.opaque = false就OK了;當(dāng)然,主要的一點還有加載的H5頁面也要直接使用div做成透明的,沒有背景body.
解決方案:
_webView.opaque = NO;
_webView.backgroundColor = [UIColor whiteColor];