silverlight 樂動魔方 實戰十

 這次真的要··開始遊戲了···

 

迴歸上次Game.xaml

<UserControl x:Class="SilverlightMusicHit.Game"
    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="600" d:DesignWidth="800" KeyDown="UserControl_KeyDown">
    
    <Grid x:Name="LayoutRoot">
        <Grid.RowDefinitions>
            <RowDefinition Height="50"/>
            <RowDefinition Height="*"/>
            <RowDefinition Height="50"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="435"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <TextBlock Name="txtTitle" Grid.Row="0" Grid.Column="0"  Text="歌曲" FontSize="16"></TextBlock>
        <Button Name="btnBack" Grid.Row="2" Grid.Column="1"  Content="返回列表" Opacity="0.5" Click="btnBack_Click" MouseLeave="btn_MouseLeave" MouseMove="btn_MouseMove"></Button>
        <Grid Name="gcMusicHit" Grid.Row="1" Grid.Column="1" Height="435" Width="435" Opacity="0.9">
            <Grid.RowDefinitions>
                <RowDefinition/>
                <RowDefinition Height="10"/>
                <RowDefinition/>
                <RowDefinition Height="10"/>
                <RowDefinition/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition/>
                <ColumnDefinition Width="10"/>
                <ColumnDefinition/>
                <ColumnDefinition Width="10"/>
                <ColumnDefinition/>
            </Grid.ColumnDefinitions>
            <Canvas Background="White" Grid.Row="0" Grid.Column="1"/>
            <Canvas Background="White" Grid.Row="0" Grid.Column="3"/>
            <Canvas Background="White" Grid.Row="1" Grid.Column="0"/>
            <Canvas Background="White" Grid.Row="1" Grid.Column="1"/>
            <Canvas Background="White" Grid.Row="1" Grid.Column="2"/>
            <Canvas Background="White" Grid.Row="1" Grid.Column="3"/>
            <Canvas Background="White" Grid.Row="1" Grid.Column="4"/>
            <Canvas Background="White" Grid.Row="2" Grid.Column="1"/>
            <Canvas Background="White" Grid.Row="2" Grid.Column="3"/>
            <Canvas Background="White" Grid.Row="3" Grid.Column="0"/>
            <Canvas Background="White" Grid.Row="3" Grid.Column="1"/>
            <Canvas Background="White" Grid.Row="3" Grid.Column="2"/>
            <Canvas Background="White" Grid.Row="3" Grid.Column="3"/>
            <Canvas Background="White" Grid.Row="3" Grid.Column="4"/>
            <Canvas Background="White" Grid.Row="4" Grid.Column="1"/>
            <Canvas Background="White" Grid.Row="4" Grid.Column="3"/>
            <Canvas Background="Black" Name="imgMusic7" Grid.Row="0" Grid.Column="0"/>
            <Canvas Background="Black" Name="imgMusic8" Grid.Row="0" Grid.Column="2"/>
            <Canvas Background="Black" Name="imgMusic9" Grid.Row="0" Grid.Column="4"/>
            <Canvas Background="Black" Name="imgMusic4" Grid.Row="2" Grid.Column="0"/>
            <Canvas Background="Black" Name="imgMusic5" Grid.Row="2" Grid.Column="2"/>
            <Canvas Background="Black" Name="imgMusic6" Grid.Row="2" Grid.Column="4"/>
            <Canvas Background="Black" Name="imgMusic1" Grid.Row="4" Grid.Column="0"/>
            <Canvas Background="Black" Name="imgMusic2" Grid.Row="4" Grid.Column="2"/>
            <Canvas Background="Black" Name="imgMusic3" Grid.Row="4" Grid.Column="4"/>
        </Grid>
        <TextBox Grid.Column="1" Name="txtScore" Text="0" FontSize="40" Opacity="0.5" Foreground="#FF97AFC4" FontFamily="Comic Sans MS" Margin="0,0,0,0" />
        <TextBox Grid.Column="2" Grid.Row="1" HorizontalAlignment="Left" Text="Hit" Width="182" Name="txtHit" FontFamily="Comic Sans MS" FontSize="32" FontWeight="Bold" Foreground="#FF2626B7" BorderBrush="#FF1747DE" Margin="0,200,0,200" Visibility="Collapsed" />
    </Grid>
</UserControl>

再進入Game.cs

        #region 變量
        /// <summary>
        /// 背景顯示速度 /ms
        /// </summary>
        private int speed = 80;

        /// <summary>
        /// 背景顯示圖片數量
        /// </summary>
        private int imgMax = 30;

        /// <summary>
        /// 背景圖片索引
        /// </summary>
        private int Index = 0;

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

        /// <summary>
        /// 背景畫刷
        /// </summary>
        private ImageBrush _imgBrush;

        /// <summary>
        /// 播放聲音
        /// </summary>
        private MediaElement _mediaSound;

        /// <summary>
        /// 播放音樂
        /// </summary>
        private MediaElement _mediaMusic;

        /// <summary>
        /// Hit定時器
        /// </summary>
        private Storyboard _tmGame;

        /// <summary>
        /// 遊戲時間進度 /ms
        /// </summary>
        private int gamestep = 100;

        /// <summary>
        /// 音樂對象索引
        /// </summary>
        private int musicIndex = 0;

        /// <summary>
        /// 節奏對象
        /// </summary>
        private XML.MusicHitValue _musicHitValue;

        /// <summary>
        /// MusichHit顯示索引
        /// </summary>
        private int gmIndex = 0;

        /// <summary>
        /// MusicHit時間進度
        /// </summary>
        private int gmStep = 0;

        /// <summary>
        /// 連擊數
        /// </summary>
        private int downHits = 0;

        /// <summary>
        /// 總分
        /// </summary>
        private int score = 0;

        /// <summary>
        /// 音樂鍵
        /// </summary>
        private static List<MusicHit> _musicHit;

        /// <summary>
        /// 音樂加載
        /// </summary>
        private static ChildMusicLoading _MusicLoading;
        #endregion

2、好了··接着開始想怎樣實現了······· 不過有之前的鋪墊，應該也不難理解的

        public Game(int _musicIndex)
        {
            InitializeComponent();

            //讀取音樂索引
            musicIndex = _musicIndex;

            //創建背景畫刷
            _imgBrush = new ImageBrush();

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

            //添加播放器
            _mediaSound = new MediaElement();
            _mediaMusic = new MediaElement();
            this.LayoutRoot.Children.Add(_mediaSound);
            this.LayoutRoot.Children.Add(_mediaMusic);

            //創建9個音樂鍵
            _musicHit = new List<MusicHit>();
            _musicHit.Clear();
            for (int i = 0; i < 9; i++)
                _musicHit.Add(new MusicHit());

            //加載音樂
            _MusicLoading = new ChildMusicLoading(musicIndex);
            _MusicLoading.Show();

            //新增音樂單擊事件
            foreach (Canvas cvs in gcMusicHit.Children)
                cvs.MouseLeftButtonDown += new MouseButtonEventHandler(cvs_MouseLeftButtonDown);
        }

以下是背景效果

        void _timer_Completed(object sender, EventArgs e)
        {
            if (_MusicLoading.DialogResult == true)
            {
                GameStart();
                _MusicLoading.DialogResult = false;
            }

            bool isHit = false;
            string url = string.Format("{0}{1}{2}", "Image/picBackGround/background", Index, ".jpg");
            _imgBrush.ImageSource = Common.GetGif(ref Index, ref imgMax, ref isHit, url, 1);
            this.LayoutRoot.Background = _imgBrush;
            _timer.Begin();
        }

_MusicLoading.DialogResult 這個是不是很面熟？  沒錯，這個是加載歌曲進度窗體的返回值，終於發現爲啥··要無端端返回個True給他吧····呵呵

 

接着進入GameStrat（）了

/// <summary>
        /// 遊戲開始
        /// </summary>
        private void GameStart()
        {
            //音樂名
            txtTitle.Text = Common._MusicValue[musicIndex].MusicName;

            //播放聲音
            Common.SoundUrl(ref _mediaSound, "Music/Btn/readyGo.mp3");
            _mediaSound.Play();
            Common.SoundUrl(ref _mediaMusic, Common._MusicValue[musicIndex].MusicPath);
            _mediaMusic.Play();

            //獲取音樂節奏
            XML.Reader _reader = new XML.Reader();
            _musicHitValue = _reader.GetHisValue(Common._MusicValue[musicIndex].MusicHit);

            //創建定時器
            _tmGame = new Storyboard();
            _tmGame.Duration = new Duration(TimeSpan.FromMilliseconds(gamestep));
            _tmGame.Completed += new EventHandler(_tmGame_Completed);
            _tmGame.Begin();
        }

以下是節奏圖效果

        void _tmGame_Completed(object sender, EventArgs e)
        {
            try
            {
                if (gmStep.Equals(_musicHitValue.MusicTimer[gmIndex]))
                {
                    MusicHit musicHit = new MusicHit();
                    int Index = _musicHitValue.MusicHits[gmIndex];
                    Canvas cvs = (Canvas)this.gcMusicHit.Children.First<UIElement>(x => (x as FrameworkElement).Name.StartsWith("imgMusic" + Index.ToString()));
                    cvs.Children.Add(musicHit);
                    _musicHit[Index - 1] = musicHit;

                    gmIndex++;
                }
            }
            catch { }
            gmStep++;
            _tmGame.Begin();
        }

應該是這句比較麻煩了····

Canvas cvs = (Canvas)this.gcMusicHit.Children.First<UIElement>(x => (x as FrameworkElement).Name.StartsWith("imgMusic" + Index.ToString()));

額··這個如果之前有聽我意見，看一下LINQ··，就會知道大概了··· 找出滿足條件的頭元素（裏面就是條件了）額。···查MSDN····去

 

按鈕

        /// <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;
        }

        private void btnBack_Click(object sender, RoutedEventArgs e)
        {
            ((App)(Application.Current)).RedirectTo(new Music());
        }

以下判斷點擊位置

/// <summary>
        /// 判斷點擊位置
        /// </summary>
        /// <param name="num"></param>
        private void selectMusicHitPos(int num)
        {
            Hit hit = new Hit();
            hit.HitStyle = 0;
            try
            {
                if (_musicHit[num - 1].isMusicHit)
                {
                    hit.hitDisIndex = 1;
                    downHits++;
                    txtHit.Visibility = System.Windows.Visibility.Visible;
                }
                else
                {
                    hit.hitDisIndex = 0;
                    downHits = 0;
                    txtHit.Visibility = System.Windows.Visibility.Collapsed;
                }
                Canvas cvs = (Canvas)this.gcMusicHit.Children.First<UIElement>(x => (x as FrameworkElement).Name.StartsWith("imgMusic" + num.ToString()));
                cvs.Children.Add(hit);

                score += downHits * 10;
                txtHit.Text = "Hit:" + downHits.ToString();
                txtScore.Text = score.ToString();
            }
            catch { }
        }

鍵盤來玩

private void UserControl_KeyDown(object sender, KeyEventArgs e)
        {
            string stringKey = e.Key.ToString();
            if (stringKey.Contains("NumPad"))
            {
                selectMusicHitPos(int.Parse(stringKey.Replace("NumPad", "")));
            }
        }

鼠標來玩      

 void cvs_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
        {
            try
            {
                int number = int.Parse(((Canvas)sender).Name.Replace("imgMusic", ""));
                selectMusicHitPos(number);
            }
            catch { }
        }

差不多了····現在試試吧，哈。

 

估計silverlight樂動魔方 就在這裏結束了

····

下章？

還有下章， 哈·····演唱會也有加場，。···何況 教程···嘻嘻！

下章將會附加 樂動魔方 編曲器~~

 

name:5+x

參與文章與書籍：

WPF葵花寶典