A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

我们在手机上面看到的手机动画,,当我们暂停的时候然后再开始的时候会出现两种效果:
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);
        }


    }   

运行时的效果

暂停时的效果

继续运行的效果(注意此时的二者的对比)



好了完成了!
















评分

参与人数 1技术分 +1 收起 理由
郑文 + 1

查看全部评分

1 个回复

倒序浏览
1,前台代码grid控件中用到了两个TextBlock 控件,一个Button 控件和一个媒体播放器控件;
2,后台代码用到一个构造函数,实现了初始化和两个方法的调用;
3,程序结构严谨,值得学习!

评分

参与人数 1技术分 +1 收起 理由
宋天琪 + 1

查看全部评分

回复 使用道具 举报
您需要登录后才可以回帖 登录 | 加入黑马