『下拉顯示網(wǎng)頁來源』的實(shí)現(xiàn)
在最開始先簡單介紹一下該效果的實(shí)現(xiàn)方式。
這個(gè)功能我們在微信中打開鏈接時(shí)、一些手機(jī)瀏覽器中會經(jīng)??吹?,效果如下圖:

-
UI實(shí)現(xiàn)
在做之前查了一下實(shí)現(xiàn)方式,常見的一種是將
Webview的背景色設(shè)為透明,在Webview下層添加一個(gè)同樣大小的View,用此View的背景色來模擬Webview背景色,在這個(gè)View層上貼一個(gè)Label用于顯示文字。這樣在Webview向下滑動時(shí),就會露出后面的網(wǎng)頁來源文字。上面的方法比較直觀,但是比較繁瑣。我們知道
UIWebView對象有一個(gè)屬性是scrollView,所以可以這樣來實(shí)現(xiàn):使用insertSubview方法,在scrollView下面插入一個(gè)UILabel。即可實(shí)現(xiàn)和上面一樣的效果。UIWebView *webview = [[UIWebView alloc] init]; UILabel *label = [[UILabel alloc] init]; [webview insertSubview:label belowSubview:webview.scrollView];
-
來源文本加載
顯示的文本我們一般都會只截取URL的host部分。這里可以使用
webview的URL中host部分。label.text = webview.request.URL.host;文本的加載時(shí)機(jī)一般選擇在
webview的request加載完成之后。注意對URL字符串進(jìn)行空判斷,如果此時(shí)URL為空,則不為文本賦值,也就是此時(shí)不顯示label。
為Hybrid框架添加此特性
功能實(shí)現(xiàn)之后,就開始重點(diǎn)了,為框架添加此特性。也就是前端在進(jìn)行Hybrid App開發(fā)時(shí),可以通過Schema或者插件Plugin的方式,對自己的Webview設(shè)置是否下拉顯示來源。
關(guān)于Hybrid入門這里有一篇文章,大家可以先閱讀一下。Hybrid入門。
實(shí)現(xiàn)方式是在Webview的基類中暴露一個(gè)屬性,通過調(diào)用該屬性對應(yīng)的setter,來對是否顯示進(jìn)行調(diào)整。
關(guān)于這部分,我總結(jié)了以下幾點(diǎn)收獲。
-
使用枚舉類型表示選項(xiàng)、狀態(tài)、狀態(tài)碼
這是我在《Effective Objective-C 2.0》中讀到過的一個(gè)建議,順便向大家推薦一下這本書,書中講到的52個(gè)方法對于我們培養(yǎng)良好的iOS編碼習(xí)慣有很大的幫助。
在對是否顯示此特性進(jìn)行設(shè)置時(shí),我們會用到一些狀態(tài)碼。
typedef NS_ENUM(NSInteger, WebSourceShowSate) { WebSourceShowSateNo = 1, WebSourceShowSateYes = 2 };使用枚舉類型的狀態(tài)碼,我們可以通過代碼很直觀地表示狀態(tài)。
關(guān)于iOS枚舉類型的學(xué)習(xí),大家可以看這篇 iOS枚舉應(yīng)用。
-
框架接口設(shè)計(jì)時(shí),盡量不對外暴露UI相關(guān)屬性
我們在對框架的接口進(jìn)行設(shè)計(jì)時(shí),應(yīng)該努力追求直觀、清晰,盡量少暴露內(nèi)部實(shí)現(xiàn)細(xì)節(jié)。努力讓使用者只需關(guān)注最簡單最直觀的內(nèi)容。所以在這個(gè)特性中,我們可以選擇將一個(gè)上述的狀態(tài)碼或者BOOL類型的屬性暴露出來,而非將顯示文本的
Label對外暴露。?
-
框架接口設(shè)計(jì)時(shí),單個(gè)參數(shù)暴露為屬性,多個(gè)參數(shù)暴露為方法
在接口中提供對單個(gè)的參數(shù)進(jìn)行設(shè)置時(shí),將其設(shè)置為屬性,使用該屬性的setter。
提供對多個(gè)參數(shù)同時(shí)設(shè)置時(shí),暴露一個(gè)帶多個(gè)參數(shù)的方法。
?
-
利用屬性的setter完成一些操作
有時(shí)候,我們可以通過重寫屬性的setter,在setter中加入一些操作,使得這些操作能在合適的時(shí)機(jī)進(jìn)行。比如本例中,
- 在
Webview實(shí)例化之前,想要對此刻還未實(shí)例化的Label是否顯示進(jìn)行設(shè)置。我們就可以在webview所在類中添加一個(gè)標(biāo)記Label是否進(jìn)行顯示的參數(shù)屬性。在webview實(shí)例化之前,調(diào)用該參數(shù)屬性的setter對其進(jìn)行賦值,然后在webview的初始化部分對該屬性值進(jìn)行檢查,作相應(yīng)的設(shè)置。 - 在
Webview實(shí)例化之后,想要在框架接口中,提供對已經(jīng)實(shí)例化的Label是否顯示進(jìn)行設(shè)置。我們可以利用前文講到過的暴露出來的狀態(tài)碼或BOOL型屬性,重寫該屬性的setter,然后在該方法中加入對Label是否顯示進(jìn)行設(shè)置的代碼。這樣就可以在對該狀態(tài)碼賦值的同時(shí),完成相關(guān)的UI更新。
- 在