Silverlight 3中加入许多新的特性,其中最令人激动的新特性之一就是Plane Projection,利用它可以使任何UIElement元素在3D空间中旋转,实现简单的3D旋转效果。
下面是简单的实现一个图片在3D空间中沿着Y轴旋转的效果,当然只需要简单修改一下即可实现沿着X轴和Z轴旋转的效果。
<
UserControl
x:Class
="PlaneProjDemo.MainPage"
xmlns ="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x ="http://schemas.microsoft.com/winfx/2006/xaml"
Width ="480" Height ="360" >
< Grid x:Name ="LayoutRoot" Background ="White" >
< StackPanel >
< Image Margin ="15,5,15,5" x:Name ="imageFlip" Width ="470" Height ="350" >
< Image.Projection >
< PlaneProjection x:Name ="Rotator" />
</ Image.Projection >
</ Image >
</ StackPanel >
</ Grid >
</ UserControl >
xmlns ="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x ="http://schemas.microsoft.com/winfx/2006/xaml"
Width ="480" Height ="360" >
< Grid x:Name ="LayoutRoot" Background ="White" >
< StackPanel >
< Image Margin ="15,5,15,5" x:Name ="imageFlip" Width ="470" Height ="350" >
< Image.Projection >
< PlaneProjection x:Name ="Rotator" />
</ Image.Projection >
</ Image >
</ StackPanel >
</ Grid >
</ UserControl >
using
System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media.Imaging;
using System.Windows.Threading;
namespace PlaneProjDemo
{
public partial class MainPage : UserControl
{
private double _increment = 2.0;
private BitmapImage _front = new BitmapImage(new Uri("Images/Front.jpg", UriKind.Relative));
private BitmapImage _back = new BitmapImage(new Uri("Images/Back.jpg", UriKind.Relative));
private DispatcherTimer _timer = new DispatcherTimer();
private double _angle = 0.0;
private bool _isfront = true;
public MainPage()
{
InitializeComponent();
this.Loaded += new RoutedEventHandler(MainPage_Loaded);
_timer.Interval = TimeSpan.FromMilliseconds(50);
_timer.Tick += new EventHandler(_timer_Tick);
}
void MainPage_Loaded(object sender, EventArgs e)
{
_timer.Start();
}
void _timer_Tick(object sender, EventArgs e)
{
_angle -= _increment;
if (_angle < 0.0)
_angle += 360.0;
if (_angle == 270.0)
{
imageFlip.Source = _isfront ? _back : _front;
_isfront = !_isfront;
_angle = 90.0;
}
Rotator.RotationY = _angle;
}
}
}
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media.Imaging;
using System.Windows.Threading;
namespace PlaneProjDemo
{
public partial class MainPage : UserControl
{
private double _increment = 2.0;
private BitmapImage _front = new BitmapImage(new Uri("Images/Front.jpg", UriKind.Relative));
private BitmapImage _back = new BitmapImage(new Uri("Images/Back.jpg", UriKind.Relative));
private DispatcherTimer _timer = new DispatcherTimer();
private double _angle = 0.0;
private bool _isfront = true;
public MainPage()
{
InitializeComponent();
this.Loaded += new RoutedEventHandler(MainPage_Loaded);
_timer.Interval = TimeSpan.FromMilliseconds(50);
_timer.Tick += new EventHandler(_timer_Tick);
}
void MainPage_Loaded(object sender, EventArgs e)
{
_timer.Start();
}
void _timer_Tick(object sender, EventArgs e)
{
_angle -= _increment;
if (_angle < 0.0)
_angle += 360.0;
if (_angle == 270.0)
{
imageFlip.Source = _isfront ? _back : _front;
_isfront = !_isfront;
_angle = 90.0;
}
Rotator.RotationY = _angle;
}
}
}
本效果的DEMO下载地址:
http://download.csdn.net/source/2350880
下面给个MSDN的控件连接把,里面每个控件的效果属性,都得到了很好的演示:
http://samples.msdn.microsoft.com/Silverlight/SampleBrowser/index.htm#/?sref=GlobalOffsetAnimation_1