cordova插件使用(一套流程適用於每個插件使用)

iOS 狀態欄的控制我是這麼實現的:

  1. 訪問http://plugins.cordova.io/, 您可以在其中搜索cordova插件,例如我搜下statusbar:
    插件管理頁面搜索statusbar結果

    會發現有兩個插件。其中下面的名字貌似更官方一點,我們就選擇這個作爲我們需要的插件。

  2. 插件的安裝很簡單。我們需要的只是插件的ID, 也就是org.apache.cordova.statusbar. 然後打開終端,然後到cd到自己的項目根目錄,輸入或粘貼如下代碼:
    cordova plugin add org.apache.cordova.statusbar

    回車,稍等片刻會有類似下面的提示:
    statusbar安裝代碼以及提示

    說明安裝成功。雖說安裝是成功了,但到底該如何使用呢?

  3. 一般這種插件都會在GitHub上開源,Google或Github上搜索org.apache.cordova.statusbar,很快我們就會找到這個插件的Github地址:https://github.com/jonathannaguin/org.apache.cordova.statusbar.

    點擊進入,衆API們引入眼簾,好像黑夜看到了曙光,屌絲看到了女神……

    方法如下:

    • StatusBar.styleDefault 狀態欄默認樣式,也就是電池信號黑色;
    • StatusBar.styleLightContent 狀態欄內容淺色,貌似就是白色,適合深色背景;
    • StatusBar.styleBlackTranslucent 狀態欄黑色半透明,我測了下,跟上面一樣的效果,電池時間都是白色的,適合深色背景;
    • StatusBar.styleBlackOpaque 狀態欄黑色不透明。我測了下,還是白色的,跟上面一樣,適合深色背景;
    • StatusBar.hide 狀態欄隱藏;
    • StatusBar.show 狀態欄顯示;
  4. 只要你使用了Cordova的插件(相機啊,地址位置等),你就得調用自動生成的cordova.js.
    <script src="cordova.js"></script>

    然後,再你自己的JS中,使用類似StatusBar.hide()就可以隱藏狀態欄啦!或者使用StatusBar.styleLightContent()讓狀態欄從黑人變成白人,如下效果:
    頂部的白色狀態欄效果截圖

其他非官方插件的使用也是類似上面的步驟。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章