| ||||
我们已经知道，用来填充的图案具有连续平铺的特性，当在一个较大的范围(大于图案)内填充图案的时候，会产生上下左右彼此衔接的效果。现在我们在Photoshop中建立一个图案填充层(点击图层调板下方
按钮)，将会出现如下图的设置框�
在其中选择我们前面所定义的图案，图像中的平铺效果如下图�
设置框中的“与图层链接”选项如果关闭，那么填充的图案就不能像普�图层那样进行移动。贴紧原点可以让图案与标尺〖CTRL R〗中�0点对齐。
感受无缝平铺图案
上面这个图案平铺后产生的是一种“砌墙”效果，即看得出一块一块图案的拼接，图案间有明显的分界线，就好像用砖头砌墙一样。现在我们选择Photoshop默认图案中的“分子”，效果如下右图。不同于之前，在这个平铺中看不到图案间的边界线，整个图案浑然一体�
这是为什么呢？是不是因为这个图案本身很大，以至于比目前图像的画布还大，所以看不到平铺的图案边界呢？不是的，无论你建立多大的图像，都不会看到图案边界。那究竟是为什么？
现在我们新建一�120×120的白底图像，然后建立一个菱形渐变填充层(黑色至透明)，设定如下左图，产生的效果如下中图。然后将该层栅格化�图层>栅格�>填充内容/图层】，把菱形移动到最左端并只保留一半，复制菱形图层再水�(按住SHIFT)移动到右端且也只保留一半。如下右图。将其定义为图案�
Now，在脑中想象一下，把这个图案进行平铺的效果将是怎样�
接着动手制作，平铺的效果如下左图，我们发现原先被拆散的菱形又被合并在一起了。和你们想象中的是否一致？
正因为图案的连续平铺特性，前一个图案与后一个图案首尾相接，如下右图。才能够形成这样的效果。从严格意义上来说，图案的边界是存在的。但从视觉效果上看却没有边界。正因为图案内容前后衔接。这样的图案就适合用以连续平铺(也称无缝平铺、连续图�)，可以“星火燎原”，用较小的图案来制作较大的区域，且无论区域大或者小，都不会影响平铺的整齐性�
这种图案在网页设计中是经常用到的，因为网页的大小并不是固定的，随着内容的增减可能随时发生变化。比如原先网页中只有20行文字，我们根据�20行的大小制作�背景，但以后如果文字增加�30行，那空余出来的部分怎么办？因此网页背景都是采用一个较小的图案，然后指定为平铺。这样无论网页内容增加或者减少都不会影响背景的效果�
即使网页内容不发生增减，浏览器窗口宽度减少，也会引起高度的增加，因为这样才能够保证总面积不变以显示原先的内容�
那不改变浏览器大小不就没问题了吗？不是的，首先你不可能强制浏览者不去改变浏览器窗口的大小。其次不同的人的显示器分辨率设定也可能不一样。我们在1024×768屏幕分辨率下制作的充满画面的网页，如果在800×600的显示器上显示，即使浏览器窗口最大化，宽度也不可避免地减少�
无缝平铺图案深度分析
现在我们来仔细分析一下刚才定义的菱形图案，为什么它能够无缝平铺呢？因为在图案最左端�1像素部分，与图案最右端�1像素部分有良好的像素承接关系。这种承接关系体现在位置和颜色上。我们可以据此来推断，用一条线段来作为图案的话�
1：线段的两个端点分别位于图案的左右边界，且处在同一水平线上，那么这条线段的平铺效果最好，首尾相连，可以形成无缝平铺�
2：线段的两个端点都没有或只有一个到达边界，那么平铺效果其次，首尾虽不能相连，却也不会产生断接感�
3：线段的两个端点分别位于图案的左右边界，但不在同一水平线上，那么平铺效果最差，因为首尾既不能相连，又产生了断接感�
分别对应下图�3种效果范例�
上面所说的第一种平铺，其实还要一种例外的可能性：如果线段穿越边界时候呈现一定的角度(常见于曲�)，那么位于分界点的两个像�(下图中的A与B)即使不在同一水平线上，却同样能够形成无缝平铺。因为它们之间的落差符合线段的走势。这样的差异通常也就�1像素�2像素的距离，再大就会产生断接感了�
除了位置，边界像素的颜色对于平铺效果也是有影响的。这常见于使用渐变色作为平铺的时候。为了使效果明显，我们使用了模拟渐变的色块，并打上颜色数字来说明问题，如下图�
如果头尾颜色相同，颜色相接会产生一个重复的区域，使得颜�1在平铺中的比例两倍于其他颜色，造成不协调。当减去其中一个后，颜色的过渡就协调了。这可以从数字的变化上看出来�
不过如果渐变图案中的颜色数量较多或所占区域较�(如颜色只�1像素�)，这种重复的效果就不容易被觉察，也就不必过于苛求�
头尾重复的情况也会出现在动画制作中，如下图是一个顺时针旋转箭头的动画过程，每帧的停留时间为1秒。注意第1帧与�9帧的箭头角度相同，这样在播放的时候，箭头在这个角度就会停�2秒，看起来就好像顿了一下似的，造成动画的不连贯�
前面我们所制作的无缝平铺图案又称为2方连续图案，因为只考虑到了横向或竖�(所有例子旋�90度即�)平铺的需要。这样的图案在填充大面积的区域时会显得很单调。下面我们就来看看如何制�4方连续图案，这并不困难，就是把两个方向结合起来考虑而已�
在第一个菱形的基础上，我们再创建一�30%左右的小菱形渐变，按照前面相同的手法处理成如下左图的样子。尽管很简陋，但这就是一个真正的4方连续图案了。平铺效果如下右图�
在制作这个图案的时候，大家最感到没有把握的就是让菱形在边界正好保留一半大小，这个过程中稍有误差就会造成平铺图案断接。所幸菱形具有很明显的棱边可提供视觉参考。但对于一些其他的形状就未必能够准确把握了�
为了准确和快捷地制作平铺图案，可以使�Photoshop的位�滤镜。让我们先制作出早先的那个大菱形并栅格化，确保选择该层，然后�滤镜>其他>位移】，设置如下左图，注意要选择“折回”，就会在图像中看到我们之前手动复制图层并移动到边界的效果。那这个位移滤镜是什么原理呢�
位移滤镜在“折回”方式下就是假定图像已经作为图案并进行了平铺，如下右图，以平铺中心的原图�(下右图红框内)为基准点，向四周移动一定的距离后，用该处的图像替换原先的图像�
我们这个图像的尺寸是120×120，那么按照左图的设置水平移动60(�-60)像素，就相当于横向移动一半，应该停留在下右图的蓝色区域内，正好是左右各端露出菱形的一半。可以预见，如果垂直也设�60(�-60)像素的话，所得到的应该是下右图绿色区域内的图像�
在完成大菱形的水平位移后，再建立并栅格化一个小菱形渐变层，然后进行60(�-60)像素垂直位移，就可以得到与之前相同的效果。使�滤镜前注意正确选择图层�
掌握了位�滤镜的使用后，我们就可以很容易地制作无缝平铺图案。新建一�60×60的图像，新建一�图层，使用自定义形状工具〖U/SHIFT U〗在其中绘制“草2�形状(如找不到可复�形状)，将其与背景层上下居中、左右居中对�(要以背景层作为基准层，方法可参考操作速查0516)，然后复制该�(选择图层后〖CTRL J�)，对复制出来�图层(或原图层)使用位移滤镜，水平及垂直方向均设为图像大小的一�(30�-30像素)。得到如下左图的效果，可将图案的名字起为“紫色小草”之类的。填充效果如下右图�
我们知道平铺的效果关键取决于图案边界，因此首先要保证图案边界的连续性。现在我们来制作较为杂乱的可平铺背景，设定如下笔刷：散布枫叶形状、直�30像素、间�80%、大小抖�100%、角度抖�100%、色相抖�100%�
选一个彩色前景色(不能选择黑、白或灰度，否则没有色相抖动效果)，在一�150×150的图像中绘制一个十字形，注意枫叶不能超出边界，原则上是越贴紧边界越好，但这里先不用强求，后面有办法来弥补�
然后将图案垂直位移一�(也就�75像素)，这样就会露出原先在上下边界留下的空白。用相同的笔刷填补空白处�
接着水平位移、垂直位移一半，就会露出原先在左右边界留下的空白，同画笔填补。最后再垂直位移一半，即可得到可作为无缝平铺图案的边缘�
以上步骤如下左图所示。其中的步骤2和步�6可以替换，也就是说可以先填补水平方向再填补垂直方向�
≡★ 免 责 声 明 ★≡
除本站原创外，本站所提供的所有教程均收集整理自网络，其版权归该教程直原始作者或原始出处所有！
除特别声明外，您可以在保持教程的完整和注明来源的前提下免费复制、转贴本站所提供的所有教程；但是，不可以盗链本站的图片！
除特别声明外，在未经许可的情况下您不得将本站所提供的任何教�(包括资源)用于商业用途；
如果确有需要，请自行与该教程的原始所有权者（即：原始作者或出处）联系，本站不提供相关服务；否则，由此而引发的一切后果由您自负！
