2016/05/09

製作 GIF 動圖的方法(3)

Make an animated GIF from the command line (3)


【前言】

此例敘述用 ImageMagick 製作動圖的一些變化,來源圖是前篇的數字方圖

介紹的變化有漸出漸入、停格、連接、反轉、變速。


【變速】

1. 查出速率。

要改變動圖的播放速率應該要先知道其時間間隔 (delay) 的設定。但不是自製的動圖,通常不知其值。

用以下指令可以查出動圖中每個畫格 (frame) 的間隔:

identify -format "%T " filename.gif

 -format: 顯示的格式。
 "": 格式內容。
 %T: 時間間隔 (delay)

註一:因為不是每個畫格間的間隔都是一樣的,所以會顯示所有的間隔。

註二:若格式只用 %T "%T" 而非 "%T ",顯示的數值是連在一起的,所以要加個空格。

註三:輸出的數值單位是百分之一秒。其值就是在製作動圖時,用 "-delay t" 的格式設定間隔的 t 值。


以本例使用的 numbers.gif 為例:

identify -format "%T_" numbers.gif

輸出:

100_100_100_100_100_100_100_100_100_100_

因為有 10 個畫格,所以會有 10 個數值。100 正是製作時的設定值


2. 改變速率。

假設要將速率加倍,即間隔改為 50

magick convert -delay 50 numbers.gif numbers-50.gif


註一:此指令順序很重要,先設定間隔,次給來源圖,最後為輸出檔名。若來源圖先,則間隔不變。

註二:-delay 是對其後所有的圖都有效,若其後是動圖,則每一畫格皆有效。

註三:查驗。

identify -format "%T_" numbers-50.gif
50_50_50_50_50_50_50_50_50_50_


【反轉】

1. 來源圖製作。

-reverse 選項即可;位置不重要,下面三指令結果相同:

magick convert -delay 100 images\*.png -reverse numbers-r.gif
magick convert -delay 100 -reverse images\*.png numbers-r.gif
magick convert -reverse -delay 100 images\*.png numbers-r.gif


2. 改變現有動圖。

magick convert numbers-50.gif -reverse numbers-50-r.gif
magick convert -reverse numbers-50.gif numbers-50-r.gif

兩指令結果相同。


【連接】

將要連接的圖依序列出,最後給輸出檔名即可。

magick convert numbers-50.gif numbers-50-r.gif numbers-50-join.gif


註一:圖的長寬尺寸要一致。

註二:可以看得出來 0 9 時間較長,因為頭尾的畫格重複一次。


【停格】

1. 永久停在末格。

也就是播放數次後,停在最後一格:

a. 來源圖製作。

此指令會播放 3 次,然後停在最後一格:

magick convert -delay 50 -loop 3 images\*.png numbers-loop3.gif

 -loop: 循環。位置不重要。


註:查驗。

identify -format "%T_" numbers-loop3.gif
50_50_50_50_50_50_50_50_50_50_


b. 改變現有動圖。

magick convert -loop 3 numbers-50.gif numbers-50-loop3.gif


註:查驗。

identify -format "%T_" numbers-50-loop3.gif
50_50_50_50_50_50_50_50_50_50_


2. 末格間隔較長。

將一圖用上述連接的方法接在現有動圖後,但其間隔時間較長,有類似停格的效果,而整個動圖可無限循環。

先另外做一圖:

magick convert -size 100x100 -font Wingdings -gravity SouthEast label:J smile.png

連接:

magick convert numbers-50.gif -delay 300 smile.png numbers-smile.gif


註一:此指令順序很重要

註二:查驗。

identify -format "%T_" numbers-smile.gif
50_50_50_50_50_50_50_50_50_50_300_


若是要將原動圖的最後一畫格延長:

magick convert numbers-50.gif -delay 300 numbers-50.gif[-1] numbers-pause.gif

 [index]: 0 起算,-1 為末格。


註一:末格用 +duplicate -duplicate 1,-1 +clone -clone -1 有時可,有時無效,用上法最保險。

註二:查驗。

identify -format "%T_" numbers-pause.gif
50_50_50_50_50_50_50_50_50_50_300_


淡出淡入

ImageMagick 有一個 morph 的選項,但這不是一般所認知的變體,倒像畫面轉換的淡出淡入。用法是 "-morph 格數"格數是兩畫格間多加的畫格數。-morph 5 是兩畫格間插入 5 個畫格,共 7 個。

1. 用兩個能清楚分辨的來源圖number-1.png number-2.png。做為對照的參考,先看看不用 -morph 選項的結果。

magick convert number-1.png number-2.png n1n2.gif


很明顯是兩圖快速切換。


2. 再比較 -morph 不同位置的差異。

magick convert -morph 5 number-1.png number-2.png n1n2-5a.gif
magick convert number-1.png -morph 5 number-2.png n1n2-5b.gif
magick convert number-1.png number-2.png -morph 5 n1n2-5c.gif


-morph 在最前和在最後的結果一樣,也是預期的結果。在中間則看不到漸次的變化,且兩圖的滯留時間不同,前圖較長。用 identify 查看,前後動圖都是 0_0_0_0_0_0_0_ 七個零,中間六個。結論是 -morph 選項要在最前或最後。依一般指令行的習慣,較常在前。


3. 最後比較不同值的差異。

magick convert -morph 1 number-1.png number-2.png n1n2-1.gif
magick convert -morph 3 number-1.png number-2.png n1n2-3.gif
magick convert -morph 5 number-1.png number-2.png n1n2-5.gif
magick convert -morph 9 number-1.png number-2.png n1n2-9.gif

 
 
 

【後語】

1. 不是每個應用程式都能正常顯示動圖。用瀏覽器試試,因為大部分的動圖都會被上傳到網站。對吧!

2. 本文只是介紹基本用法,後文敘述實際應用。


【附錄】全部五種變化的結合,放在附錄做參考。

1. 新增兩個彩色來源圖。

magick convert -background yellow -fill red -size 100x100 -font Wingdings -gravity SouthEast label:¥ Bullseye.png
magick convert -background yellow -fill green -size 100x100 -font Wingdings -gravity SouthEast label:¤ Fisheye.png

 

2. 兩圖單純做成動圖。

magick convert Bullseye.png Fisheye.png eyes.gif


3. 比較不同的 -morph 設定。

magick convert -morph 1 Bullseye.png Fisheye.png eyes-1.gif
magick convert -morph 5 Bullseye.png Fisheye.png eyes-5.gif
magick convert -morph 9 Bullseye.png Fisheye.png eyes-9.gif

 
 

4. 巡邏式動圖 - 來回緩慢切換並短暫停留。

magick convert -delay 10 eyes-9.gif -delay 100 eyes-9.gif[-1] ( -reverse -delay 10 eyes-9.gif ) -delay 100 eyes-9.gif[0] eyes-9-patrol.gif

( 前:正向變速 + 末格暫停
() 內:反轉變速
) 後:首格暫停


5. 檢驗。

identify -format "%T_" eyes-9-patrol.gif
10_10_10_10_10_10_10_10_10_10_10_100_10_10_10_10_10_10_10_10_10_10_10_100_

沒有留言:

張貼留言