基础知识（十二）WPF中ImageBrush画刷工具下对图片处理，Viewport/ TileMode/ ViewportUnits三者之间的关系。

       WPF设计中常常需要用到ImageBrush工具，利用图片作为背景等等，甚至需要对图片进行平铺等等操作。因此针对ImageBrush的三个常用工具Viewport/ TileMode/ ViewportUnits进行简单的说明。

一、Viewport/ TileMode/ ViewportUnits三者的基本功能

Viewport——设置平铺的范围。

TileMode——设置平铺的方式。

ViewportUnits——设置平铺的相对/绝对坐标，即图片在哪平铺。

二、举例（以下例子都是在180*180的矩形框内Rectangle 进行平铺）

例子1——绝对平铺

      <Rectangle Grid.Row="2" Grid.Column="0" Stroke="Black">
                    <Rectangle.Fill>
                         <ImageBrush ImageSource="Icons/p1.jpg"  Viewport="0, 0, 90, 90" ViewportUnits="Absolute"/>
                    </Rectangle.Fill>
                </Rectangle>

例子2——相对平铺

       <Rectangle Grid.Row="2" Grid.Column="0" Stroke="Black">
                    <Rectangle.Fill>
                          <ImageBrush ImageSource="Icons/p1.jpg"  Viewport="0, 0, 0.5, 0.5"  ViewportUnits="RelativeToBoundingBox"/>
                    </Rectangle.Fill>
                </Rectangle>

  其中，  Viewport="0, 0, 0.5, 0.5" 表示要平铺图片在矩形框的位置，（0,0）代表起点坐标，（0.5,0.5）代表重点坐标。

例子1与例子2达到同样的效果：

例子3——X轴水平翻转平铺（自己在TileMode里面试试，也要朝Y轴翻转平铺，也有自动平铺的等等）

   <Rectangle Grid.Row="2" Grid.Column="0" Stroke="Black">
                    <Rectangle.Fill>
                          <ImageBrush ImageSource="Icons/p1.jpg" Viewport="0, 0, 0.2, 0.3" TileMode="FlipX" ViewportUnits="RelativeToBoundingBox"/>
                    </Rectangle.Fill>
                </Rectangle>

效果图：

总结:

1、一般用相对路径ViewportUnits="RelativeToBoundingBox"平铺，因为它对长度单位进行了归一化处理，快速、简介明了。

2、本文QQ联系方式479166938，请多多指教。