现在的位置: 首页 > 综合 > 正文

silverlight 乐动魔方 实战六

2012年02月08日 ⁄ 综合 ⁄ 共 4204字 ⁄ 字号 评论关闭

上次讲到绑定··XML数据

 

嗯,相册当然要有图片啦,··so··先添加图片

图片下载地址:

http://www.vdisk.cn/down/index/8817993A2474(PicBtn)

http://www.vdisk.cn/down/index/8817997A9289(PicMusic)

 

接着一看···Music.Xaml 按钮有图片了,··呵呵

进入Music.cs 继续做相册效果。

 

1、定义两个变量

View Code

        /// <summary>
        /// 当前位置
        /// </summary>
        private int CurPos = 0;

        /// <summary>
        /// Music图片数量
        /// </summary>
        private int PicMax = 0;

修改构造方法

View Code

        public Music()
        {
            InitializeComponent();
            this.Loaded += new RoutedEventHandler(OpenPage3D_Loaded);

            //读取音乐信息
              Common._MusicValue = Reader.GetValues("MusicSet.xml");
            PicMax = Common._MusicValue.Count;//ADD这个
        }

2、编写相册效果相关的

View Code

private void OpenPage3D_Loaded(object sender, RoutedEventArgs e)
        {
            //初始化位置
            CurPos = 0;
            this.SetEasingFunction();
        }

        private void AddNum()
        {
            if (CurPos < PicMax-3)
            {
                CurPos++;
            }
            else
            {
                CurPos = -2;
            }
        }

        private void DelNum()
        {
            if (CurPos < -1)
            {
                CurPos = PicMax - 3;
            }
            else
            {
                CurPos--;
            }
        }
View Code

/// <summary>
        /// 播放事件的方法
        /// </summary>
        /// <param name="type">0,Back 1,Next</param>
        private void PlayStory(int type)
        {
            switch (type)
            {
                //Next
                case 1:
                    this.AddNum();
                    this.NextSource();
                    this.myStoryboard.Begin();
                    break;
                //Back
                case 0:
                    this.DelNum();
                    this.NextSource();
                    this.myStoryboard.Begin();
                    break;
            }
        }

        /// <summary>
        /// 使用Silverlight 3的EasingFunction动画
        /// </summary>
        private void SetEasingFunction()
        {
            //创建EasingFunction动画中的CircleEase对象
            CircleEase ce = new CircleEase();
            ce.EasingMode = EasingMode.EaseOut;
            //遍历故事板中的所有动画
            for (int i = 0; i < myStoryboard.Children.Count; i++)
            {
                DoubleAnimation da = myStoryboard.Children[i]
                    as DoubleAnimation;
                if (null != da)
                {
                    //设置DoubleAnimation的EasingFunction属性
                    da.EasingFunction = ce;
                }
            }
        }

        /// <summary>
        /// 设置当前位置的图片源
        /// </summary>
        private void NextSource()
        {
            //img0.ImageSource = Common.GetImgSource(this.GetUrl(CurPos));
            img1.ImageSource = Common.GetImgSource(this.GetUrl(CurPos + 1));
            img1.Opacity = 0.5;
            img2.ImageSource = Common.GetImgSource(this.GetUrl(CurPos + 2));
            img3.ImageSource = Common.GetImgSource(this.GetUrl(CurPos + 3)); 
            img3.Opacity = 0.5;
        }

        /// <summary>
        /// 获取图片路径
        /// </summary>
        /// <param name="CurPos"></param>
        /// <returns></returns>
        private string GetUrl(int CurPos)
        {
            string temp = string.Empty;
            try
            {
                temp = string.Format("../{0}", Common._MusicValue[CurPos].MusicImg);
            }
            catch { }
            return temp;
        }
 
        private void btnNext_Click(object sender, RoutedEventArgs e)
        {
            this.PlayStory(1);
        }

        private void btnBack_Click(object sender, RoutedEventArgs e)
        {
            this.PlayStory(0); 
        }
View Code

        private void r2_MouseMove(object sender, MouseEventArgs e)
        {
            this.r2.BorderThickness = new Thickness { Bottom = 5, Top = 5, Left = 5, Right = 5 };
            this.LayoutRoot.Background = new ImageBrush { ImageSource = img2.ImageSource };
        }

        private void r2_MouseLeave(object sender, MouseEventArgs e)
        {
            r2.BorderThickness = new Thickness { Bottom = 0, Top = 0, Left = 0, Right = 0 };
            this.LayoutRoot.Background = new SolidColorBrush(Colors.Black);
            _mediaElement.Stop();
        }

代码应该挺容易理解的, 相比 银光志,新增了后退按钮,和背景与选择的图片相同。img1 img2 img3 分别是 左中右 ,

呵呵,具体··还是那句话··翻开MSDN查看

 

3、噢··还有个全屏按钮

View Code

        private void btnFull_Click(object sender, RoutedEventArgs e)
        {
            //获取当前应用程序SilverlightHost内容对象
            Content contentObject = Application.Current.Host.Content;
            //修改当前应用程序的全屏属性
            contentObject.IsFullScreen = !contentObject.IsFullScreen;
        }

还有,一些按钮效果

View Code

        /// <summary>
        /// 鼠标移过按钮高亮
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        private void btn_MouseMove(object sender, MouseEventArgs e)
        {
            ((Button)sender).Opacity = 1;
        }

        /// <summary>
        /// 鼠标离开按钮恢复
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        private void btn_MouseLeave(object sender, MouseEventArgs e)
        {
            ((Button)sender).Opacity = 0.5;
        }

4、好了,·只能鼠标按··看起来挺不爽的,增加一些快捷键吧。

选择Music .XAML

View Code

<UserControl x:Class="SilverlightMusicHit.Music"
    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="500" d:DesignWidth="800" xmlns:dataInput="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data.Input" KeyDown="UserControl_KeyDown" Background="Black">

发现没有··,新增了一个KeyDown 事件,

回到Music.cs

View Code

        private void UserControl_KeyDown(object sender, KeyEventArgs e)
        {
            switch (e.Key)
            {
                case Key.Right: btnBack_Click(null, null); break;
                case Key.Left: btnNext_Click(null, null); break;
            }
            ModifierKeys keys = Keyboard.Modifiers;
            if ((e.Key == Key.G) && keys == ModifierKeys.Control)
                btnFull_Click(null,null);
        }

噢,差不多了。

按F5试试吧。;···

这两章是有点麻烦,,呵呵,进入  《开始篇》 那个演示地址,看着办呗!

嗯,下章就会开始讲播放音乐部份,和之前的总结。

 

name:5+x

 

参考文章与书籍:

silverlight银光志

抱歉!评论已关闭.