我们在手机上面看到的手机动画,,当我们暂停的时候然后再开始的时候会出现两种效果:
1,动画沿着刚刚静止的画面继续播放、
2,动画随着时间而变化,跳过刚刚的暂停的部分
这犹如我们在电视上面看直播和在网络上面看重播一样(写的不好大家多多原谅哈 )
下面我将用一个小程序在windows phone上来演示一下(我是.net 3期的哈!)
首先是前台代码,我们将整个的Grid分成四个部分,并且在每一个部分中都要添加一些控件
我用两个textblock 控件来实现动画的基础,就是说它们是动的,动画的主角
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"> 效果图
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<TextBlock Grid.Row="0"
Text="Frame-based"
FontSize="{StaticResource PhoneFontSizeLarge}"
HorizontalAlignment="Center"
VerticalAlignment="Center"
RenderTransformOrigin="0.5 0.5">
<TextBlock.RenderTransform>
<RotateTransform x:Name="rotate1"/>
</TextBlock.RenderTransform>
</TextBlock>
<TextBlock Grid.Row="1"
Text="Frame-based"
FontSize="{StaticResource PhoneFontSizeLarge}"
HorizontalAlignment="Center"
VerticalAlignment="Center"
RenderTransformOrigin="0.5 0.5">
<TextBlock.RenderTransform>
<RotateTransform x:Name="rotate2"/>
</TextBlock.RenderTransform>
</TextBlock>
<Button Grid.Row="2"
Content="start"
Width="300"
Height="120"
HorizontalAlignment="Center" Click="Button_Click" />
<MediaElement Name="ww" Grid.Row="3"
Height="200" Width="200" Source="Video/Wildlife.wmv"
HorizontalAlignment="Center"
AutoPlay="True"
VerticalAlignment="Center"/>
</Grid>
</Grid>
前台设计好以后我们将开始写后台,写的不好大家多多原谅哈
要知道如果像重播那样的话那是依靠帧来实现的
而中间不因为是停止而暂停的是依靠 时间的间隔来实现的(TimeSpan)来实现的,
点击start 暂停(我设置的了暂停5秒,然后继续自动播放)
public partial class MainPage : PhoneApplicationPage
{
DateTime startTime;
// 构造函数
public MainPage()
{
InitializeComponent();
startTime = DateTime.Now;
CompositionTarget.Rendering += OnCompositionTargetrendering;
CompositionTarget.Rendering += Oncommand;
}
public void Oncommand(Object sender, EventArgs e)
{
rotate1.Angle = (rotate1.Angle + 0.2) % 360;
//第二个以时间来确定角度
TimeSpan span = DateTime.Now - startTime;//利用现在时间减去刚刚开始的时间
rotate2.Angle = (span.TotalMinutes * 360) % 360;
}
public void OnCompositionTargetrendering(Object sender, EventArgs e)
{
rotate1.Angle = (rotate1.Angle + 0.2) % 360;//利用帧数来实现
TimeSpan elapsedTime = DateTime.Now - startTime;
rotate2.Angle = (elapsedTime.TotalMinutes * 360) % 360;
}
private void Button_Click(object sender, RoutedEventArgs e)
{
Thread.Sleep(5000);
}
}
运行时的效果
暂停时的效果
继续运行的效果(注意此时的二者的对比)
好了完成了!
|