Silverlight.XNA(C#)跨平台3D遊戲研發手記:(四)SLG無限自由之過場動畫

來源:互聯網
上載者:User

最初迷戀《火紋》,便是因為戰鬥時的情境切換(戰鬥特寫);《夢幻類比戰》、《高達》、《進階大戰爭》亦如是。特別喜歡這些電子公仔上演一幕幕華麗的戰局,如果要說一款戰棋類SLG的精髓在哪?毫無疑問:沒有戰鬥特寫的SLG永遠無法成為經典與永恒。

戰鬥特寫,即SLG中角色對戰時對戰鬥情境的放大,讓玩家身臨其境的感受戰鬥的激烈與樂趣,細膩而暢快。


在遊戲設計設方面,戰鬥特寫無外乎是兩個Scene的切換,一個隱藏,一個顯示,這並不困難;而最華麗又最能吸引眼球的關鍵其實便是夾於其中的過場切換動畫:

有的一掃而過,有的發散放大,有的肢離破碎,亦有漸隱漸現,旋轉、波紋無不天馬行空,成為每款SLG所獨具韻味之地。

看似複雜的效果,其實我們只需藉助一張紋路圖片配以相應的HLSL解析便可完成。

乍一看,這些都是神馬?3D地形材質?確實有些異曲同工之妙。通過HLSL編寫對像素邊緣的尋找,再以動畫形式處理其中的Progress參數,見證奇蹟的時刻:

過場動畫

                container.Visibility = Visibility.Collapsed;
                transition.Visibility = Visibility.Visible;
                double progress = 0;
                //戰鬥
                transition.Source = Global.GetImage(string.Format("Battle/{0}.jpg", Global.RandomSeed.Next(5)));
                //實景
                ImageBrush real = new ImageBrush() { ImageSource = Screenshot() };
                //切換
                ImageBrush cutover = new ImageBrush() { ImageSource = Global.GetImage(string.Format("Transition/{0}.jpg", Convert.ToInt32(((ComboBoxItem)comboBox4.SelectedItem).Tag))) };
                switch (Convert.ToInt32(((ComboBoxItem)comboBox5.SelectedItem).Tag)) {
                    case 0:
                        effect = new Transition_RadialWiggle() { RandomSeed = 0, Texture2 = real, TextureMap = cutover };
                        progress = 100;
                        break;
                    case 1:
                        effect = new Transition_CloudReveal() { Texture2 = real, TextureMap = cutover };
                        progress = 50;
                        break;
                    case 2:
                        effect = new Transition_RotateCrumble() { RandomSeed = 0, Texture2 = real, TextureMap = cutover };
                        progress = 100;
                        break;
                    case 3:
                        effect = new Transition_Blood() { RandomSeed = 0, Texture2 = real, TextureMap = cutover };
                        progress = 100;
                        break;
                }
                transition.Effect = effect;
                Storyboard storyboard = new Storyboard();
                int easing = Convert.ToInt32(((ComboBoxItem)comboBox6.SelectedItem).Tag);
                storyboard.Children.Add(Global.CreateDoubleAnimation(effect, "Progress", 0, progress, TimeSpan.FromMilliseconds(slider1.Value), (easing == 2 ? null:new PowerEase() { EasingMode =  (EasingMode)easing })));
                storyboard.Completed += delegate {
                    Global.SetTimeout(delegate {
                        container.Visibility = Visibility.Visible;
                        storyboard = new Storyboard();
                        storyboard.Children.Add(Global.CreateDoubleAnimation(transition, "Opacity", 1, 0, TimeSpan.FromMilliseconds(600), new PowerEase() { EasingMode = EasingMode.EaseOut }));
                        storyboard.Completed += delegate {
                            transition.Opacity = 1;
                            transition.Visibility = Visibility.Collapsed;
                        };
                        storyboard.Begin();
                    }, 600);
                };
                storyboard.Begin();
            };

本節,我為大家準備了4種動畫形式,並傾囊所出,為大家提供了近百張過場紋路素材,嘿嘿~無限自由拓展,你感動了嗎?

這是一款基於Silverlight的SLG遊戲引擎的一部分,線上示範Demo如下(點擊下載該Demo源碼):


其實,將此類過場動畫運用到Silverlight企業專案中,效果同樣增色不少,使用者體驗大幅提升直接影響軟體好評,何樂不為?

一切都快了,人們高節奏的生活習慣讓複雜而緩慢的戰棋SLG逐年衰退,雖然頁遊方面在努力彌補,但具有純正血統戰鬥特寫的幾乎沒有,這也是為什麼至今我們這些電玩人依舊每天期盼著《火紋》新作。我不想用預防老年癡呆這個理由來挽救戰棋SLG,在利益與理想面前,大家通常會選擇背棄,突然有一天或許你發現,原來人生的意義並不僅僅是擷取。

後媽Adobe斷臂Flash和FLEX,HTML5除了幫你泡妞,帶來任何金錢了嗎?Silverlight 5 的3D效能突飛猛進,WP7的蓄勢待發,強大的勢力正在席捲全球,Silverlight 6 !  一個必將改變世界的力量,今天的你,還在迷失嗎?

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.