三維效果也可以叫透視效果，所以，我干脆叫三維透視效果。理論知識少講，直接用例開場吧，因為這個三維效果其實很簡單，比上一節中的變換更省事，不信？一起來做一做練習吧。

練習一：把對象沿Y軸旋轉45度。

默認情況下，旋轉中心都是在中心位置上，如Y軸中心。而至于旋轉的角度，哪個方向是正值，哪個方向是負值，嘿，你自己動手試一下就知道了，我相信你能理解的，不然，Hello Kitty嘲笑你的。

好的，由于是第一個練習，我們先來說說X、Y、Z三個坐標軸到底在哪，X軸不用說了，就橫著放的那個了，Y軸呢，當然是豎著的，那Z軸呢？你猜？知道這三個軸是互相垂直的，你會猜的，在哪？在圖上看不到？為什么呢？
是啊，Z軸正指向你呢，你怎么會看到呢？對著你那個就是了，所以，在三維透視里面，如果你希望把對象拉遠一點，就把Z值設小一點了，如果希望對象跟你“親密”一點，那就把Z的平移值設置大一點，知道不，Z軸平稱也叫“親密指數”，呵呵。

簡直的透視效果用PlaneProjection類就可以輕松完成，如果要復雜的3D模型，就要求你具備灰常強大的空間思維能力了，建議使用其它的 3D建模軟件如3D Max等，Express Blend支持導入，復雜的三維模型還是推薦使用Express Blend來圖形化操作，這樣會直觀一點，當然，如果你用PlaneProjection類，就沒必要，因為它還算比較簡單的。

好，現在我們就來做做把對象沿X軸旋轉45度吧，也就是上面圖片在的效果，當然，PlaneProjection類可以用于許多UI元素中，不一定是圖片，為了直觀和美觀，我用圖片，也順便找兩位MM來熱鬧一下。

<Image Source="1.jpg" Stretch="Uniform" HorizontalAlignment="Center" VerticalAlignment="Center" 
        Width="320"> 
    <Image.Projection> 
        <PlaneProjection RotationY="45"/> 
    </Image.Projection> 
</Image> 

OK，就這么簡單，可能在設計器里沒有看到效果，沒關系，你現在輕輕按下F5，馬上你就會看到奇跡發生。

這里我提示一下，所有UI元素對PlaneProjection的使用方法都是一樣的，下文的例子中你會看到，就是設置對象的Projection屬性。

練習二：沿X軸旋轉-60度。

<Image Source="1.jpg" Stretch="Uniform" HorizontalAlignment="Center" VerticalAlignment="Center" 
        Width="320"> 
    <Image.Projection> 
        <PlaneProjection RotationX="-60"/> 
    </Image.Projection> 
</Image> 

和上面沒什么區別，只是Y變成X罷了。

練習三：沿Z軸旋轉180度。

<Image Source="1.jpg" Stretch="Uniform" HorizontalAlignment="Center" VerticalAlignment="Center" 
         Width="320"> 
     <Image.Projection> 
         <PlaneProjection RotationZ="180"/> 
     </Image.Projection> 
 </Image> 

剛才說了，Z軸是指向你自己，可能這明顯，現在你把它改為35度，相信效果就明顯了。

<Image Source="1.jpg" Stretch="Uniform" HorizontalAlignment="Center" VerticalAlignment="Center" 
        Width="320"> 
    <Image.Projection> 
        <PlaneProjection RotationZ="35"/> 
    </Image.Projection> 
</Image> 

 別走開，下頁內容更精彩

 #p#

練習四：綜合旋轉。

上面的例子都是單獨旋轉某的軸的，那么能不能X、Y、Z三軸同時干活呢？當然可以了，XYZ搭配，干活不累！

現在，我們把對象沿X軸旋轉15度，沿Y軸旋轉-65度，沿Z軸旋轉40度，看看會如何？

<Image Source="1.jpg" Stretch="Uniform" HorizontalAlignment="Center" VerticalAlignment="Center" 
        Width="320"> 
    <Image.Projection> 
        <PlaneProjection 
            RotationX="15" 
            RotationY="-65" 
            RotationZ="40"/> 
    </Image.Projection> 
</Image> 

練習五：心變中心點位置。

默認中心點位于中對象的中線上，但我們可以通過 CenterOfRotationX，CenterOfRotationY，CenterOfRotationZ三個屬性來改變中心位置，值范圍0到1， 兩個極端，不是在這一側就是那一側，如果是0和1之間的值就按比例計算了，如0.5就是默認的中間位置。

下面我們同時把X軸的中心改為0.2，Y軸中心改為0.7，Z軸中心改為1，看看有什么事情發生。

<Image Source="1.jpg" Stretch="Uniform" HorizontalAlignment="Center" VerticalAlignment="Center" 
        Width="320"> 
    <Image.Projection> 
        <PlaneProjection 
            RotationX="15" 
            RotationY="-65" 
            RotationZ="40" 
            CenterOfRotationX="0.2" 
            CenterOfRotationY="0.7" 
            CenterOfRotationZ="1"/> 
    </Image.Projection> 
</Image> 

明顯看到，位置不在中間了，認真觀察一下，你會發現的。

練習六：本地偏移。

我說的本地平移只是為了相對于屏幕平移，其實這樣翻譯有點難聽。涉及的屬性同樣有三個——LocalOffsetX, LocalOffsetY, LocalOffsetZ，相信不用我多說了，你自己玩幾下就明白，關鍵是多動手，多對比。

<Image Source="2.jpg" Stretch="Uniform" 
       HorizontalAlignment="Center" 
       VerticalAlignment="Center" 
       Height="300"> 
    <Image.Projection> 
        <PlaneProjection 
            LocalOffsetX="12" 
            LocalOffsetY="5" 
            LocalOffsetZ="24" 
            RotationX="10" 
            RotationY="-30" 
            RotationZ="-25"/> 
    </Image.Projection> 
</Image> 

練習七：全局偏移。

這個全局偏就是移動屏幕坐標，如果你愿意去總結的話，你會發現它和解析幾何中的坐標系平移的規律一樣。
即：左加右減，上加下減。
你可以不斷地改變數值來測試，相信你一定能找到規律的，呵呵，放心，Hello Kitty會鼓勵你的。

<Image Source="2.jpg" Stretch="Uniform" 
       HorizontalAlignment="Center" 
       VerticalAlignment="Center" 
       Height="300"> 
    <Image.Projection> 
        <PlaneProjection 
            GlobalOffsetX="8" 
            GlobalOffsetY="55" 
            GlobalOffsetZ="800" 
            RotationX="10" 
            RotationY="-30" 
            RotationZ="-25"/> 
    </Image.Projection> 
</Image> 

研究這個透視效果，還是老方法——亂來，不斷地用數值去測試，想一想，有時候亂來是很有價值的。