小程序分享朋友圈目前的做法一般都是保存一個帶有小程序二維碼的海報到本地,網上也有不少相關文章,但是別人的不如自己的,這里記錄一下自己生成海報保存到本地的方法。 本來一開始打算使用離屏 canvas 的,結果搞了半天發現小程序的離屏 canvas 和 通過 canvas 標簽獲取的有很多不 ...
小程序分享朋友圈目前的做法一般都是保存一個帶有小程序二維碼的海報到本地,網上也有不少相關文章,但是別人的不如自己的,這里記錄一下自己生成海報保存到本地的方法。 本來一開始打算使用離屏 canvas 的,結果搞了半天發現小程序的離屏 canvas 和 通過 canvas 標簽獲取的有很多不 ...
View Code ...
項目中遇到需要分享到朋友圈,但是查詢api發現小程序並沒有提供分享到朋友圈的功能,只能實現通過canvas畫一張海報然后保存到本地,讓用戶主動去發朋友圈。 效果圖生成后海報 首先使用微信小程序提供的canvasapi將第二張圖顯示的海報畫出來 然后調用保存本地的接口 ...
使用Canvas繪圖,將圖片保存到本地方法 一、使用HTML5 a標簽的download屬性,將圖片保存到本地,不需要鏈接服務器 關於download屬性:HTML5 <a>標簽download 屬性 特別說明:這種方式只支持Google和FF,IE瀏覽器還不支持。(注:目前測試 ...
目標:在微信小程序中頁面有一個按鈕,點擊后生成一張海報,點擊保存,圖片保存到本地相冊 海報樣式如下: 通過觀摩別人代碼,分析這張海報,難點有四個,一是背景的圓角,canvas並沒有一個api是畫圓角的,二是中間的兩行標題,這里應該是動態的,可能一行可能兩行,三是圓形頭像處理 ...
在一些項目中,使用uniapp前端生成海報是避免不了的,從中也遇到了一些坑。(同理在微信小程序也可以使用的原生) 遇到最大的坑還是圖片生成問題CanvasContext.drawImage; canvas是不可以通過網絡圖片來生成的,可以使用下面的api來緩存到本地 ...
生成海報不難,都知道是用canvas畫,但是在uniapp中會有一些bug,為了解決bug,下面是我的思路: 1.首先定義唯一容器,下面有image和canvas標簽,為什么這樣做呢,解決有些h5頁面canvas畫不出來,所以用image去接收並展示。 2.頁面中的寬高都是 ...