Line Flex Message 傳送動畫訊息,讓訊息更生動
Flex Message 是 Line 透過 JSON 格式所實現的動態訊息,可以組出各種訊息格式,且比起 Template Message,Flex Message 也支援 Line 電腦版,故現在在寫 Line Bot 的時候,第一考量就會用 Flex 來自訂一些較特別的訊息,官網提供兩個 GUI 工具來快速拉 Flex 的訊息: Bot Designer Flex Simulator 我自己比較常用是第二個,官網已經很多的範本提供套入 且目前支援很方便的功能,可以直接發到手機裝置瀏覽結果 在 Flex 的 image 類型是可支援放入 .APNG 格式圖片的動畫,透過以下網站可以將 Git 轉成 .APNG 格式 https://ezgif.com/gif-to-apng Demo Flex 範例 { "type": "bubble", "body": { "type": "box", "layout": "vertical", "contents": [ { "type": "image", "url": "https://apng.onevcat.com/assets/elephant.png", "size": "full", "aspectMode": "cover", "aspectRatio": "1:1", "gravity": "center" }, { "type": "box", "layout": "vertical", "contents": [], "position": "absolute", "background": { "type": "linearGradient", "angle": "0deg", "endColor": "#00000000", "startColor": "#00000099" }, "width": "100%", "height": "40%", "offsetBottom": "0px", "offsetStart": "0px", "offsetEnd": "0px" }, { "type": "box", "layout": "horizontal", "contents": [ { "type": "box", "layout": "vertical", "contents": [ { "type": "box", "layout": "horizontal", "contents": [ { "type": "text", "text": "APNG Demo", "size": "xl", "color": "#ffffff" } ] } ], "spacing": "xs" } ], "position": "absolute", "offsetBottom": "0px", "offsetStart": "0px", "offsetEnd": "0px", "paddingAll": "20px" } ], "paddingAll": "0px" } } –...