朋友們大家好，我是三兒。

之前三兒發(fā)了一篇??[小心新媒體人，他們都很“裝”]

不少朋友紛紛留言詢問，前面模擬微信聊天打字的效果是怎么實現(xiàn)的。

*此案例僅有點擊換圖效果展示，無展開效果

其實這個效果并不難，我們拆開看他就是一個單純的多次點擊換圖（自定義觸發(fā)）+一個展開的組合效果。

我們在SVG編輯器中，搜索關鍵詞[多次點擊換圖]，你會發(fā)現(xiàn)有很多相關效果。

原文我們是用的一個多次點擊換圖展開（自定義觸發(fā)），那么開啟我們今日的學習之路。

在135編輯器左側，找到SVG編輯器的入口。

選中[互動效果]在搜索框中搜索多次點擊換圖展開（自定義觸發(fā)）或組件ID：112

選中組件到編輯器，我們上傳前面需要點擊換圖的部分也就是我們偽微信聊天圖

??左滑查看聊天素材圖

上傳完所有圖片后，我們再手動調(diào)整觸發(fā)區(qū)

設置自動觸發(fā)區(qū)的好處就在于只有點擊預設置的區(qū)域，才會實現(xiàn)換圖，實現(xiàn)“打字”的效果。

在我們完成所有圖片的觸發(fā)熱區(qū)設置后，就可以開始制作展開后的內(nèi)容板塊。

Waring：展開后并不是什么效果都能添加，譬如再添加一次展開。目前所有能添加的效果都已進行展示，大家可以按照分類進行查找，能找到就能添加。

我們展開的內(nèi)容是一個點擊換圖，直接在搜索框輸入點擊換圖或組件ID：6

我們上傳點擊前后的變化圖，設置觸發(fā)熱區(qū)即可。

做完最后別忘了點擊[完成]

你可以選擇[導出]，將內(nèi)容復制到135編輯器或微信公眾號

也可以選擇同步，直接同步到微信公眾號后臺，如果沒有授權公眾號也可以安裝插件直接同步。

打個總結：關于多次點擊換圖，你不僅可以模仿微信聊天，也可以實現(xiàn)輸入密碼等效果，可玩性還是很高的，大家快動手試試吧。

對了還有一件大事忘了告訴你

最近135編輯器有雙旦活動

超多福利好禮

等你來拿

快來掃碼看看吧

??

（廣告）