開發小程序小半年了，我寫了一個小程序常用開發庫

之前一直在做vue、react開發，年初，因工作需要，學習開發微信小程序，總體下來還是很好學的，只是微信的坑比較多，時不時的要填坑（這裏並不是詆譭微信），相信有很多開發者也會和我有同樣的想法。

我來介紹一下寫的一個小程序常用開發庫，已經全面開源發佈，目前僅有8個常用功能：

項目地址：

giehub: https://github.com/yancekang/wechat-plug
gitee: https://gitee.com/yangon/wechat-plug

1. 小程序分享海報

2. 身份證拍攝取景框

3. 時間線

4. 獲取當前詳細地址

5. 城市選擇

6. 日期選擇

7. 頁面自定義導航左邊按鈕

8. 訂單操作

小程序分享海報

使用場景：用戶分享生成海報，海報中包含用戶信息的小程序碼，這裏的小程序碼是根據用戶動態生成。

實現過程：首先將海報上固定的信息可以完全設計到圖片上，只需要將動態變化的信息由前端去生成，如果生成的元素過多，會使整個生成海報的時間變長，
我們模擬海報上動態變化的信息只有用戶暱稱和小程序碼，這樣我們只需一張海報底圖、暱稱和小程序碼。
通過canvas畫布將這三個素材組合到一起，這裏注意的一點是涉及到圖片的需要利用wx.downloadFile先將圖片緩存到本地

詳細代碼：
https://github.com/yancekang/wechat-plug/blob/master/pages/unit/poster/poster.js

身份證拍攝取景框

使用場景：圖片識別，證件識別等

主要是利用camera組件，添加蒙層實現取景框效果 （這裏就不放效果圖了）。

時間線

時間線主要是css樣式，這裏不做介紹。

獲取定位詳細地址

我們通過微信的接口獲取到的定位信息只有經緯度，給人的感覺不是很直觀，這裏就需要將經緯度轉換爲中文地址，因此需要利用第三方接口，我這裏使用的是騰訊的地理位置信息服務，首先獲取到經緯度，通過經緯度換取具體的中文信息。

wx.getLocation({
  success: function(res) {
    qqmapsdk.reverseGeocoder({
      location: {
        latitude: res.latitude,
        longitude: res.longitude
      },
      success: function (location) {
        that.setData({
          location_city: location.result.address
        })
      },
      fail: function (error) {
      }
    })
  },
})

具體效果請移步到微信小程序體驗。