Silverlight图形学习笔记（五）：三维效果（透视转换）

<UserControl x:Class="_3DDemo.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">

    <!--   
    三维效果（透视转换）
    PlaneProjection ：表示对象的透视转换（类似三维效果）
    PlaneProjection 具有以下 12 个可用于控制对象的旋转和位置的属性
    (一)旋转对象
        (1)沿轴旋转
           RotationX ：获取或设置围绕旋转的 X 轴旋转对象的角度。
           RotationY: 获取或设置围绕旋转的 Y 轴旋转对象的角度。
           RotationZ: 获取或设置围绕旋转的 Y 轴旋转对象的角度。
       （2）移动旋转中心
       CenterOfRotationX :获取或设置所旋转对象的旋转中心X坐标(默认值0.5,典型值介于0 和1之间，值为0对应于对象的一个边缘，值为 1 对应于相对边缘)
       CenterOfRotationY :获取或设置所旋转对象的旋转中心Y坐标（默认值0.5,典型值介于 0 和 1 之间，值为 0 对应于对象的一个边缘，值为 1 对应于相对边缘）。
       CenterOfRotationZ :获取或设置所旋转对象的旋转中心Z坐标(默认值为 0。值大于 0 对应于高于对象平面的坐标，负值对应于低于对象平面的坐标)
    （二）定位对象
         （1）本地偏移量:LocalOffsetX、LocalOffsetY 和 LocalOffsetZ 属性在对象已旋转后沿对象平面的相应轴平移对象(对象的旋转确定对象平移的方向)         
                        LocalOffsetX 沿旋转对象平面的 x 轴平移对象。
                        LocalOffsetY 沿旋转对象平面的 y 轴平移对象。
                        LocalOffsetZ 沿旋转对象平面的 z 轴平移对象。
         (2)全局偏移量:GlobalOffsetX、GlobalOffsetY 和 GlobalOffsetZ 属性相对于屏幕沿轴平移对象
                        GlobalOffsetX 沿屏幕对齐的 x 轴平移对象。
                        GlobalOffsetY 沿屏幕对齐的 y 轴平移对象。
                        GlobalOffsetZ 沿屏幕对齐的 z 轴平移对象。    
    -->
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="400"></RowDefinition>
            <RowDefinition Height="27" ></RowDefinition>
            <RowDefinition Height="27" ></RowDefinition>
            <RowDefinition Height="27" ></RowDefinition>
            <RowDefinition Height="27" ></RowDefinition>
            <RowDefinition Height="27" ></RowDefinition>
        </Grid.RowDefinitions>
        <StackPanel Margin="35" Background="Gray" Grid.Row="0" HorizontalAlignment="Center">
            <StackPanel.Projection>
                <PlaneProjection
                    RotationX="{Binding Path=Value,ElementName=rotationX,Mode=OneWay}"
                    RotationY="{Binding Path=Value,ElementName=rotationY,Mode=OneWay}"
                    RotationZ="{Binding Path=Value,ElementName=rotationZ,Mode=OneWay}"
                    CenterOfRotationX="{Binding Path=Value,ElementName=centerOfRotationX,Mode=OneWay}"
                    CenterOfRotationY="{Binding Path=Value,ElementName=centerOfRotationY,Mode=OneWay}"
                    CenterOfRotationZ="{Binding Path=Value,ElementName=centerOfRotationZ,Mode=OneWay}"
                    LocalOffsetX="{Binding Path=Value,ElementName=localOffsetX,Mode=OneWay}"
                    LocalOffsetY="{Binding Path=Value,ElementName=localOffsetY,Mode=OneWay}"
                    LocalOffsetZ="{Binding Path=Value,ElementName=localOffsetZ,Mode=OneWay}"
                    GlobalOffsetX="{Binding Path=Value,ElementName=globalOffsetX,Mode=OneWay}"
                    GlobalOffsetY="{Binding Path=Value,ElementName=globalOffsetY,Mode=OneWay}"
                    GlobalOffsetZ="{Binding Path=Value,ElementName=globalOffsetZ,Mode=OneWay}"
                    />
            </StackPanel.Projection>
            <TextBlock Margin="10"> 三维效果</TextBlock>       
            <Image Source="/3DDemo;component/0745160.jpg" Height="200" Width="250"></Image>
            <Button Margin="10" x:Name="btnTest" Content="点击我" Width="100" Click="btnTest_Click" />
        </StackPanel>
        <StackPanel Grid.Row="1" Orientation="Horizontal" HorizontalAlignment="Center">
            <TextBlock  Width="100" Text="X"  Margin="200,0,0,5" />
            <TextBlock  Width="100" Text="Y"  Margin="5,0,0,5" />
            <TextBlock  Width="100" Text="Z"  Margin="5,0,0,5" />

        </StackPanel>
        <StackPanel Grid.Row="2" Orientation="Horizontal" HorizontalAlignment="Center">
            <TextBlock Text="Rotation(旋转):" Width="150"></TextBlock>
            <Slider x:Name="rotationX" Width="100" Value="5"  Margin="20,0,0,5" Minimum="0" Maximum="360"/>
            <Slider x:Name="rotationY" Width="100" Value="5"  Margin="5,0,0,5" Minimum="0" Maximum="360"/>
            <Slider x:Name="rotationZ" Width="100" Value="5"  Margin="5,0,0,5" Minimum="0" Maximum="360"/>
        </StackPanel>
        <StackPanel Grid.Row="3" Orientation="Horizontal" HorizontalAlignment="Center">
            <TextBlock Text="CenterOfRotation(旋转中心):" Width="150"></TextBlock>
            <Slider x:Name="centerOfRotationX" Width="100"  Margin="20,0,0,5"  Minimum="0" Maximum="1"/>
            <Slider x:Name="centerOfRotationY" Width="100"  Margin="5,0,0,5"  Minimum="0" Maximum="1"/>
            <Slider x:Name="centerOfRotationZ" Width="100"  Margin="5,0,0,5"  Minimum="-100" Maximum="100"/>
        </StackPanel>
        <StackPanel Grid.Row="4" Orientation="Horizontal" HorizontalAlignment="Center">
            <TextBlock Text="LocalOffset(本地偏移量):" Width="150"></TextBlock>
            <Slider x:Name="localOffsetX" Width="100"  Margin="20,0,0,5"  Minimum="0" Maximum="400"/>
            <Slider x:Name="localOffsetY" Width="100"  Margin="5,0,0,5"  Minimum="0" Maximum="400"/>
            <Slider x:Name="localOffsetZ" Width="100"  Margin="5,0,0,5"  Minimum="0" Maximum="400"/>
        </StackPanel>
        <StackPanel Grid.Row="5" Orientation="Horizontal" HorizontalAlignment="Center">
            <TextBlock Text="LocalOffset(全局偏移量):" Width="150"></TextBlock>
            <Slider x:Name="globalOffsetX" Width="100"  Margin="20,0,0,5"  Minimum="0" Maximum="400"/>
            <Slider x:Name="globalOffsetY" Width="100"  Margin="5,0,0,5"  Minimum="0" Maximum="400"/>
            <Slider x:Name="globalOffsetZ" Width="100"  Margin="5,0,0,5"  Minimum="0" Maximum="400"/>
        </StackPanel>
    </Grid>
</UserControl>

下载地址

在线演示

在线演示