mPaaS 小程式新手指南 ｜ 《mPaaS 小程式自定義開發》

第三篇：《mPaaS 小程式自定義開發》

親愛的開發者們，這裡是《mPaaS 小程式新手訓練營》。通過這門訓練營課程，我們将帶您手把手了解 mPaaS 小程式的核心原理及接入流程。

上一節課《預覽和調試 mPaaS 小程式》，我們帶大家已完成 mPaaS 小程式的預覽和調試的功能實作。這意味着，大家已經不僅僅隻是接入 mPaaS 小程式那麼簡單，而是針對 mPaaS 小程式有了更強的自定義開發能力。

那麼這堂課，我們就帶着大家一窺其二，通過“自定義小程式導航欄”和“自定義小程式雙向通道”兩個能力的學習，幫助大家進一步了解 mPaaS 小程式自定義開發的真正魅力。

接下來，讓我們快速開始。

自定義小程式導航欄

前提條件：

• 因 mPaaS 目前有 60 及 68 版本差別，在此我們僅讨論 68 基線下的接入步驟。
• 小程式和 H5 共用導航欄的實作，在進行自定義導航欄的開發時應将 H5 和小程式使用導航欄的情況都考慮在内，除非确定使用場景不包含 小程式或 H5。
• 自定義導航欄必須符合容器調用的标準流程，請仔細閱讀本文檔并按照要求進行開發。
• 小程式導航欄預設使用内置導航欄，如需開啟自定義導航欄，詳情請參考 容器配置 。
• 由于導航欄的顔色可以動态設定，為達到最佳體驗效果，您應當準備兩套主題配置并根據不同場景進行切換。

安卓開發者請看：

1、繼承AbsTitleView抽象類并實作自定義導航欄。

2、實作

H5ViewProvider

，在

createTitleView

方法中建立并傳回自定義導航欄執行個體。

3、在合适的地方，比如應用啟動時，設定

H5ViewProvider

至容器。

4、如果工程是基于 Portal&Bundle 架構，需額外設定。

iOS 開發者請看：

1、全局自定義導航欄背景和标題。

2、自定義某一頁面導航欄背景和标題。

3、動态修改目前頁面的導航欄背景和标題。

4、自定義導航欄傳回按鈕。

5、導航欄右側設定和關閉按鈕。

自定義小程式雙向通道

[小程式調用原生自定義 API]

1、用戶端自定義 API 并注冊。

2、調用小程式調用。

[原生向小程式發送自定義事件]

1、小程式注冊事件。

2、用戶端發送事件。

iOS 開發者請看：

至此，恭喜你！你已基本掌握針對現有 App 接入 mPaaS 小程式并實作運作，同時掌握基于 mPaaS 小程式 IDE 工具實作預覽和調試，更可自定義開發小程式。

一款 DIY 的小程式很快就可以跑在你的 App 中了。是否很興奮？

不止于此，下一堂課，我們将和你分享我們最新的能力，結合 mPaaS 小程式 IDE，幫助你隻用寫一次小程式代碼，便可投放至自有 App 内，更可快速建構打包，投放到支付寶及微信。

敬請關注～