silverlight 乐动魔方 实战三 .

哈，··又来了~

1、创建一个按钮，content 写上Play Game （这个随你，你写，坑爹吖·· 也行！）

2、创建一个Canvas容器，显示那个一闪一闪的，，，（为啥不是Image，容器自由度比较大嘛···哈哈）

3、接着开始想那个一闪一闪的，又在Blend 画不就行了，呵呵·····没错··但这个一闪一闪的···要到后来玩的时候要用的，···都这样画上去显然不科学额，so，这个一闪···还是自己用代码敲上去比较合理，嗯， 其实应该还有更好的，··不过我菜。这能写成这样子了。

废话少说，。看下面的

建一个Common类，哈~~~

        /// <summary>
        /// 获取动画
        /// </summary>
        /// <param name="Index"></param>
        /// <param name="Max"></param>
        /// <param name="url"></param>
        /// <param name="style">1:循环 0:不循环</param>
        /// <returns></returns>
        public static ImageSource GetGif( ref int Index, ref int Max, ref bool isHit,string url,int style)
        {
            ImageSource source = null;
            if (Index < Max)
            {
                source = Common.GetImgSource(url);
                isHit = true;
                Index++;
            }
            else
            {
                if (style == 1)
                {
                    //循环
                    Index = 0; return null;
                }
                else
                {
                    //不循环 
                    isHit = false; return null;
                }
            }
            return source;
        }

        /// <summary>
        /// 获取图片来源
        /// </summary>
        /// <param name="url"></param>
        /// <returns></returns>
        public static ImageSource GetImgSource(string url)
        {
            ImageSource source = new BitmapImage(GetUri(url));
            return source;
        }

        /// <summary>
        /// 获取资源
        /// </summary>
        /// <param name="url"></param>
        /// <returns></returns>
        public static Uri GetUri(string url)
        {
            Uri uri = new Uri(url, UriKind.Relative);
            return uri;
        }

WPF，silverlight，读取东东都是资源额，···Uri ，so，要改变一下以前··直接Path路径思想，······（如果你直接用Path ···他会弹出拒绝访问··等错误信息额··)

 

5、在UserControls文件夹里面创建一个···命名为Hit 的用户控件， 嗯嗯，

6、设计这个Hit.xaml，其实没啥的··就是定义他的大小和添加一个Image元素。后台才是重点，

<UserControl x:Class="SilverlightMusicHit.Hit"
    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="135" d:DesignWidth="135">
    
<Image Grid.Column="1" Height="135"   HorizontalAlignment="Left" Name="imgHit" Stretch="Fill" VerticalAlignment="Top" Width="135" />
</UserControl>

7、编辑后台

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;

using System.Windows.Media.Imaging;

namespace SilverlightMusicHit
{
    public partial class Hit : UserControl
    {
        #region 变量
        /// <summary>
        /// Hit显示索引,0 bad,1 perfect
        /// </summary>
        public int hitDisIndex = 0;

        /// <summary>
        /// 显示类型，1 循环,0 不循环
        /// </summary>
        public int HitStyle = 0;

        /// <summary>
        /// Hit点击索引
        /// </summary>
        public bool isHit = false;

        /// <summary>
        /// Hit显示速度 /ms
        /// </summary>
        private int speed = 30;

        /// <summary>
        /// Hit显示图片数量
        /// </summary>
        private int hitMax = 6;

        /// <summary>
        /// Hit显示列表
        /// </summary>
        private string[] hitUrl = { "Image/PicHit/gauge_bad_", "Image/PicHit/gauge_perfect_" };

        /// <summary>
        /// 定时器
        /// </summary>
        private Storyboard _timer;

        /// <summary>
        /// Hit图片索引
        /// </summary>
        private int hitIndex = 0; 
        #endregion

        public Hit()
        {
            InitializeComponent();

            //创建定时器
            _timer = new Storyboard();
            _timer.Duration = new Duration(TimeSpan.FromMilliseconds(speed));
            _timer.Completed += new EventHandler(_timer_Completed);
            _timer.Begin();
        }

        void _timer_Completed(object sender, EventArgs e)
        {
            string url = string.Format("../{0}{1}{2}", hitUrl[hitDisIndex], hitIndex, ".png");
            imgHit.Source = Common.GetGif(ref hitIndex, ref hitMax, ref isHit, url, HitStyle);
            if (isHit)
                _timer.Begin();
            else
                _timer.Stop();
        }
    }
}

应该大部份都看得懂吧，···重点是···StoryBoard 这个故事板， 查看MSDN就会发现了，··哈··还是要善于看MSDN吖··很好很强大

StoryBoard

为容器的子动画提供对象和属性目标信息的容器时间线。

 

Duration

获取或设置此时间线播放的时间长度，而不是计数重复。这是一个依赖项属性。 （继承自 Timeline。）

 

 

Completed

当此时间线完全播放完毕时发生：它将不再进入其活动周期。 （继承自 Timeline。）

 

 

好了··HIT 一闪一闪完成了，··

 

按F5运行， 吖。 。 没有？

别着急，你没错，··其实还没做好的······ (*^__^*) 嘻嘻

 

8、回到MainPage编辑后台，在他构造函数里面··写上以下代码

        public MainPage()
        {
            InitializeComponent();

            //创建Hit
            Hit hit = new Hit();
            Random rand = new Random();
            hit.hitDisIndex = rand.Next(0, 1);
            hit.HitStyle = 1;
            this.Hit.Children.Add(hit);
        }

再按F5，额··还没有？ 呵呵，··没有图片，当然没有啦，···

 

9、在Image文件夹里面再创建个PicHit文件夹，添加以下图片

http://www.vdisk.cn/down/index/8805162A4337

 

 

呵呵··现在按F5，应该行了吧。嗯嗯··

 

name:5+x

 

参考文章与书籍：

WPF葵花宝典

silverlight2.0 开发技术与精粹