很長一段時間，我對AdobeIllustrator最不滿意的一點，就是AI中沒有內(nèi)陰影效果，只能使用內(nèi)發(fā)光效果大致模擬。不過內(nèi)發(fā)光效果不能設置效果的偏移量，因此用起來有局限性。不過，最近，在網(wǎng)上找到了一種方法，能在AI中快速方便地創(chuàng)建內(nèi)陰影效果，教程介紹地比較詳細，希望能通過本教程大家可以掌握Ai這方面的知識。

創(chuàng)建內(nèi)陰影效果方法：

首先，新建一個文檔，用圓角矩形工具，或者矩形工具+圓角效果，畫出這樣的圖形：

然后，執(zhí)行菜單命令「效果」-›「SVG濾鏡」-›「應用SVG濾鏡」命令，在彈出的對話框中，新建一個SVG濾鏡：

然后，把下面的代碼復制、粘貼替換掉文本框里的內(nèi)容，點擊確定：

最后，點「確定」應用效果，內(nèi)陰影效果就出來了，帶有(5，5)方向的偏移：

如果發(fā)現(xiàn)圖形帶有鋸齒，類似這樣：

那么，執(zhí)行命令「效果」-›「文檔柵格效果設置」，勾選「消除鋸齒」，即可以了。

Done.如果希望調整內(nèi)陰影的偏移，調整dx,dy的值即可。改變內(nèi)陰影的顏色和透明度，可以通過調整

標簽里的flood-color和flood-opacity屬性來做到。這個方法應該是在AI中創(chuàng)建內(nèi)陰影最省力，效果還不錯的辦法了。不過要注意，這個濾鏡通常應該放到「效果」面板的最后邊，因為圖形在應用這個濾鏡后就被柵格化了。

注：這個方法來自StackExchange上的討論：InnershadowissueinIllustratorCS5，更早的出處是源自：SVGQuickRef，不過這個站點的域名當前已經(jīng)過期，不能正常訪問了==

2.以及其他(Howitworks)

在上面的例子里，我們使用AI的SVG濾鏡功能，自己寫了一個濾鏡，應用到了圓角矩形上，生成了內(nèi)陰影效果。出于好奇，我研究了一下howitworks，發(fā)現(xiàn)這一塊兒水還挺深。下面，就說說AI里的SVG濾鏡功能。下面的這部分，就當拓展閱讀好了，可能有些晦澀難懂，所以不要求掌握。不過，掌握SVG濾鏡的應用后，就可以自己寫一些簡單的濾鏡在AI里來用了。

首先，說說SVG是什么。SVG的全稱是ScalableVectorGraphic，即可縮放矢量圖形。SVG實際上是純文本XML格式，通過XML定義圖形的形狀、填充顏色、描邊等。在維基百科中，就大量應用了SVG格式作為國旗國徽、地圖、信息圖應用。

SVG除了可以描述矢量圖形的形狀、填充顏色、描邊等，還可以使用濾鏡對圖形進行進一步的修飾。這里的濾鏡就是SVG濾鏡（SVGFilters）。網(wǎng)上有關于SVG濾鏡的資料少的可憐，無論中文還是英文。不過，還是根據(jù)現(xiàn)有有限的資料，大概了解了一下SVG濾鏡到底是什么樣的玩意兒，以及怎樣來用。

SVG濾鏡同以SVG格式描述矢量圖一樣，也是純文本XML格式。SVG濾鏡以<filter>標簽開始，以</filter>標簽結束。在<filter>和</filter>標簽之內(nèi)的部分為濾鏡的定義。在AI里，<filter>標簽里的id屬性，即為顯示在SVG濾鏡面板中的濾鏡名。

SVG濾鏡的一個重要概念是基礎濾鏡（filterprimitives），每個基礎濾鏡可以執(zhí)行某個特定的修飾功能，例如顏色變換等。所有的基礎濾鏡命名都以“fe”為開頭，應該是filtereffect或filterelement的縮寫，如上面的<feFlood>，<feGaussianBlur>這些。一個SVG濾鏡可以由一個基礎濾鏡或多個基礎濾鏡的組合來完成。知道這些后，回過頭來看一下，上面的內(nèi)陰影效果是怎樣一步一步地實現(xiàn)的。為方便查看，把畫板的背景設置為這樣的網(wǎng)格：

首先，執(zhí)行第一步操作：

這一步，基礎濾鏡讓原始圖形向下和向右兩個方向平移均五個像素(注意和上圖的邊界框與背景網(wǎng)格做比較)：

然后是

<feGaussianBlur>基礎濾鏡的作用正如它的名字那樣，為圖形做高斯模糊，其中，stdDeviation參數(shù)為高斯模糊的標準差，決定模糊半徑。在為上面的圖形做高斯模糊后，將結果暫存在緩沖區(qū)，名稱為“offset-blur”：

接下來是<feComposite>基礎濾鏡：

<feComposite>命令的作用是將兩個圖按一定規(guī)則拼為一個圖。需要指定一個混合模式，混合模式有arithmetic,over,in,out,atop,xor六種。arithmetic為算數(shù)模式，有四個參數(shù)，k1,k2,k3,k4需要手工指定;拼合規(guī)則是對[R,G,B,A]每一個通道做這樣的變換：result=k1*in*in2+k2*in+k3*in2+k4,in和in2為兩張圖每個像素的每個單獨通道分量的大小，result就是合成圖像的某顏色通道值。over,in,out,atop,xor六種混合模式如圖所示：

<feComposite> 需要指定兩個圖像作為輸入。在這個示例中，輸入圖像一，即in參數(shù)指定的，即是源圖像，SourceGraphic;輸入圖像二，即in2參數(shù)所指定的，為上一步<feComposite> 基礎濾鏡放在緩沖區(qū)的輸出結果offset-result。然后讓這兩個圖像做out運算，得到這樣的結果：

最后，將上面的拼合結果存入緩沖區(qū)，命名為inverse。

最新評論