Hybrid-iOS『下拉顯示網(wǎng)頁來源特性的添加』

『下拉顯示網(wǎng)頁來源』的實(shí)現(xiàn)

在最開始先簡單介紹一下該效果的實(shí)現(xiàn)方式。

這個(gè)功能我們在微信中打開鏈接時(shí)、一些手機(jī)瀏覽器中會經(jīng)??吹?,效果如下圖:

下拉顯示網(wǎng)頁來源
下拉顯示網(wǎ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ī)一般選擇在webviewrequest加載完成之后。注意對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更新。
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • Spring Cloud為開發(fā)人員提供了快速構(gòu)建分布式系統(tǒng)中一些常見模式的工具(例如配置管理,服務(wù)發(fā)現(xiàn),斷路器,智...
    卡卡羅2017閱讀 136,569評論 19 139
  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 179,063評論 25 709
  • 果然,會鬧的孩子有糖吃。 我是家里的姐姐,下面還有一個(gè)比我小四歲的弟弟。小時(shí)候,爸媽每次離開家的時(shí)候都會囑咐說:“...
    小貓?jiān)谔?/span>閱讀 555評論 1 1
  • 一到兩歲的幼兒,體能發(fā)展迅速,他們有能力到處跑,到處走動,還喜歡碰碰這個(gè),摸摸那個(gè),表現(xiàn)的很淘氣。孩子淘氣好還是不...
    旦暮朝夕閱讀 432評論 0 0
  • 因?yàn)榻?jīng)常在朋友圈跑步打卡,很多人都問我,小杏子,你居然愛上跑步了?(懷疑臉) 嗯,對,我也懷疑自己,那么懶,又說話...
    南杏18閱讀 474評論 1 2

友情鏈接更多精彩內(nèi)容