????????端午節(jié)到了，先祝大家節(jié)日快樂。

? ? ? ? 今天我們學(xué)習(xí)如何做一個(gè)b站直播間里的粽子gif動(dòng)畫，見圖1，目標(biāo)效果見圖2。我會(huì)寫得盡量簡(jiǎn)明、詳盡和清晰（其實(shí)做成視頻比較好）。之所以選擇軟糯白糖粽而非飄香大肉粽是因?yàn)槲腋矚g吃豆沙粽。

????????用到的工具：電腦，瀏覽器，photoshop

????????

一、獲取粽子圖片

????????以Chrome瀏覽器為例（其他瀏覽器類似）：打開任意直播間，按F12打開調(diào)試窗口，選擇網(wǎng)絡(luò)（Network）選項(xiàng)卡，按F5刷新頁面，找到粽子圖片，右鍵-在新標(biāo)簽打開，下載這個(gè)png圖片，見圖3和圖4。

二、分割圖片

????????下載的圖片是一個(gè)大小3220×140像素的透明PNG圖片，由23個(gè)小圖片組成，見圖5。因此，我們需要先把它分成23個(gè)小圖片。

????????打開photoshop（我的版本是CS4 11.0.1），打開此圖片，選擇切片工具，見圖6。在圖片上右鍵-劃分切片，見圖7。選擇垂直劃分為，23個(gè)切片，點(diǎn)擊確定。見圖8。點(diǎn)擊文件-存儲(chǔ)為Web和設(shè)備所用格式，見圖9。將圖片縮放以便用鼠標(biāo)全部選中，格式改為PNG透明，雜邊選無，然后點(diǎn)存儲(chǔ)，見圖10。起個(gè)數(shù)字名字然后保存，見圖11。在保存位置會(huì)生成image文件夾，里邊是23個(gè)png圖片，見圖12。

三、把圖片們制作成gif

????????點(diǎn)擊文件-腳本-將文件載入堆棧，點(diǎn)擊瀏覽，選擇剛才保存的23張圖片，點(diǎn)確定，圖片會(huì)按順序加載進(jìn)當(dāng)前圖層，見圖13、14、15。點(diǎn)擊窗口-動(dòng)畫，打開動(dòng)畫窗格。見圖16。點(diǎn)擊動(dòng)畫窗格右上角，選擇從圖層建立幀，見圖17。之后，圖片會(huì)導(dǎo)入動(dòng)畫窗格，但是是反向的，所以再選擇反向幀，見圖18。用Shift和鼠標(biāo)選擇全部圖片，設(shè)置時(shí)長(zhǎng)0.1秒。見圖19。然后文件-存儲(chǔ)為Web和設(shè)備所用格式，見圖9。選擇gif格式，雜邊選"無"，存儲(chǔ)，見圖20。這樣就做好gif圖片了，更多選項(xiàng)大家可以自己摸索。

四、結(jié)語

????????建議大家試一試，馬上就會(huì)了。

????????PS版本不同選項(xiàng)可能不同，但是都差不多。

by?讓人微笑的光景

200624