[Windows 8 App]動畫特效3D特效------旋轉特效

2014-01-03

使用Projection可以實現介面元素的三維效果

它可以使介面上的元素在三維空間中沿著X軸、Y軸或是Z軸旋轉一定的角度

Projection屬性中包含一個PlaneProjection元素，用於聲明3D特效

下面透過範例來介紹3D特效

首先，新增一個專案【3DAnimation】

開啟【MainPage.xaml】

下面是【MainPage.xaml】的完整程式碼：

<Page
    x:Class="_3DAnimation.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:_3DAnimation"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Margin="260,10,100,60" Background="Gray" Width="600" Height="400">
        <Grid.Projection>
            <PlaneProjection RotationX="20" RotationY="-40" RotationZ="10" />
        </Grid.Projection>
        <TextBlock Margin="110,20" Text="3D動畫展示" FontSize="50"/>
        <Image Source="image/LOGO.jpg" Width="300" Height="300" Margin="100,60,200,40" />
    </Grid>
</Page>

在上方的程式碼中，在Grid.Projection元素中添加一個PlaneProjection元素

以定義透視轉換的呈現方式

然後在PlaneProjection元素中分別設置RotationX、RotationY和RotationZ屬性的值

使介面元素可以按照一定的角度旋轉

PlaneProjection設置完畢後，新增一個TextBlock控制項來顯示文字訊息

最後，放置一張圖片來顯示，寬與高均是300像素

這是執行畫面的圖片

回首頁