国产一级a片免费看高清,亚洲熟女中文字幕在线视频,黄三级高清在线播放,免费黄色视频在线看

打開APP
userphoto
未登錄

開通VIP,暢享免費(fèi)電子書等14項(xiàng)超值服

開通VIP
C#開發(fā)WPF/Silverlight動(dòng)畫及游戲系列教程(Game Tutorial):(...

    通過第十四節(jié)、第十五節(jié)的學(xué)習(xí),我們掌握了如何創(chuàng)建一個(gè)初具雛形的精靈控件。目前我已經(jīng)賦予了它少量的屬性,但是離完美還有很長的距離。因此,我打算在后面的章節(jié)中以輔助游戲設(shè)計(jì)為前提,對該精靈控件進(jìn)行全方位的包裝,使之更加趨于完美與和諧(^-^||)。

    在前面所有章節(jié)的示例中,角色均只有一個(gè)方向,且動(dòng)作均為跑步狀態(tài),因此很多朋友都問我該如何實(shí)現(xiàn)角色的全方向及全動(dòng)作。盡管我在文中已經(jīng)提級(jí)了相關(guān)的解決方案;但是,對于初次接觸WPF/Silverlight游戲制作的朋友在邏輯上或許還是有較大難度的。那么本節(jié)將實(shí)現(xiàn)主角8方向(在下文中凡涉及到角色方向時(shí),我均會(huì)以時(shí)鐘0點(diǎn)的位置為0,然后順時(shí)針方向依次為1、2、3、45、6、7,通俗來講即方向代號(hào)0代表角色面朝、1代表東北2代表、3代表東南、4代表5代表西南、6代表西、7代表西北)如下圖:

    5大基本動(dòng)作(每個(gè)動(dòng)作均由若干幀組成,就拿本教程后面都要用到的主角圖片為例,其中站立動(dòng)作由5張圖片連續(xù)播放形成、跑動(dòng)8張、攻擊7張、施法6張、翹辮子8張。當(dāng)然,在高質(zhì)量的游戲中一個(gè)角色并不只這5個(gè)動(dòng)作,還有例如受傷、眩暈、上馬下馬等等動(dòng)作,本教程以教會(huì)大家如何去基礎(chǔ)使用與常規(guī)制作為目的,關(guān)于更精細(xì)的活還得靠大家自行發(fā)揮與創(chuàng)新。至于你問我這些動(dòng)作的幀數(shù)設(shè)置是否是最合理,我可以告訴大家肯定不是(圖片為破天一劍的,我保留了原先的幀配置未做大的改動(dòng))。如果你打算開發(fā)的是Silverlight游戲,我建議盡量讓每個(gè)動(dòng)作幀數(shù)不要超過5幀,實(shí)踐證明這在網(wǎng)頁游戲中能達(dá)到性能與效果的黃金分割;至于在WPF這樣帶客戶端的游戲中,你大可將所有的動(dòng)作均設(shè)置為10+幀都無所謂,在后面的教程中我將給大家見識(shí)一下劍俠世界中的16幀動(dòng)作)如下圖:

    全面講解即將開始,一定要認(rèn)真聽哦!坐正啦!

    首先我們需要通過3DMAX等工具制作出一個(gè)擁有這5個(gè)動(dòng)作的3D動(dòng)畫角色,然后將之導(dǎo)出為8個(gè)方向5個(gè)動(dòng)作的系列幀圖片(大家如果只是做練習(xí)用,可以從網(wǎng)上下載相關(guān)素材或通過提取工具來提取,但是請勿用于商業(yè)用途,否則是需要承擔(dān)法律責(zé)任的)。這個(gè)過程不在本教程范圍內(nèi),所以就不詳細(xì)講解了。接下來為了節(jié)省時(shí)間,我就不再重新提取素材了,我將以QXGame(WPF GAME ENGINE)游戲引擎中的主角為例進(jìn)行相關(guān)解說。

    如果素材是通過3D渲染2D的方式得到的,那么素材均為統(tǒng)一標(biāo)準(zhǔn)尺寸的連續(xù)單幅圖片(不是的話找美工的麻煩);但是如果是從網(wǎng)上下載或提取的話,每幀圖片的尺寸并不統(tǒng)一。因此,我們首要做的是將這些圖片通過Photoshop中的“動(dòng)作”功能進(jìn)行批量處理,使所有幀圖片尺寸規(guī)格統(tǒng)一。就以本節(jié)中的主角為例,我將它的所有幀圖片規(guī)格均統(tǒng)一為150*150像素,并且主角在圖片中的水平及垂直方向均居中,如下圖(該圖為局部,一共有8*34=272張)。

 

    尺寸規(guī)格統(tǒng)一好以后,接下來還需要對所有圖片進(jìn)行微調(diào)(可想而知,游戲制作中對美工人數(shù)的需求是極其龐大的。就如我在前面章節(jié)中說到的,游戲開發(fā)的成功,極大幅度取決于美工,程序邏輯方面僅位列游戲需求分析、界面地圖美術(shù)設(shè)計(jì)之后排在第三)。所謂微調(diào),就是將角色的各幀圖片通過測試工具讓它運(yùn)動(dòng)起來(如第四節(jié)第五節(jié)中的方法),然后觀察每幀圖片重疊起來位置是否吻合,不吻合的則需要通過Photoshop進(jìn)行微調(diào),使它上面的角色處于圖片正確的位置上(如下圖則為錯(cuò)誤的疊加,我們必須將所有幀圖片完全對齊,這樣連續(xù)切換的時(shí)候才能不漏破綻):

    至此就完成了素材準(zhǔn)備階段。一切就緒后,接下來的工作就是將主角8方向5動(dòng)作的所有幀圖片(本例子中的272張)進(jìn)行處理,最終合成一張將這所有圖片按一定規(guī)律排列的8方向5動(dòng)作整合圖。就以這272張圖片為例,如何使用WPF類庫中的方法將它們合并為一張圖片呢?來看本節(jié)的第一個(gè)精華ComposeImage()方法:

        /// <summary>

        /// N幀圖片合成一張8方向角色各動(dòng)作分布圖

        /// </summary>

        /// <param name="SourcePath">源文件路徑</param>

        /// <param name="SavaToPath">保存文件到目標(biāo)路徑</param>

        /// <param name="imgnum">源圖片數(shù)量</param>

        /// <param name="imgwidth">單位圖片寬</param>

        /// <param name="imgheight">單位圖片高</param>

        public static void ComposeImage(string SourcePath, string SavaToPath, int imgNum, int imgWidth, int imgHeight) {

            System.IO.FileStream fileStream = new System.IO.FileStream(SavaToPath, System.IO.FileMode.Create);

            DrawingVisual drawingVisual = new DrawingVisual();

            DrawingContext drawingContext = drawingVisual.RenderOpen();

            int count = 1;

            for (int i = 0; i < 8; i++) {

                for (int j = 0; j < imgNum / 8; j++) {

                    drawingContext.DrawImage(new BitmapImage(new Uri(SourcePath + count + "-1.png")), new Rect(j * imgWidth, i * imgHeight, imgWidth, imgHeight));

                    count += 1;

                }

            }

            drawingContext.Close();

            RenderTargetBitmap renderTargetBitmap = new RenderTargetBitmap((imgNum / 8) * imgWidth, 8 * imgHeight, 0, 0, PixelFormats.Pbgra32);

            renderTargetBitmap.Render(drawingVisual);

            PngBitmapEncoder encoder = new PngBitmapEncoder();

            encoder.Frames.Add(BitmapFrame.Create(renderTargetBitmap));

            encoder.Save(fileStream);

            fileStream.Close();

        }

    我將該方法寫在一個(gè)名叫Super的靜態(tài)類中,關(guān)于它的參數(shù)意思在注釋中已經(jīng)寫得很清楚了,至于它是如何實(shí)現(xiàn)將這272張圖片有規(guī)律的合成為1張我們能夠在后面使用的合成圖,大家只需要注意我用黃色突出的代碼,這是主要的算法邏輯(單張圖片的文件名格式如前文中的格式圖上的一樣,例如1-1.png、2-1.png3-1.png、4-1.png、5-1.png、6-1.png……等等,如果你的圖片是1.png、2.png、3.png、4.png5.png、6.png、7.png、8.png……等等這樣的取名格式,那么只需要將"-1.png"換成".png"即可)。至于其它的部分大家稍微看一下就可以輕松理解了。

    上圖上部分即為我調(diào)用Super.ComposeImage(@"E:\Body\", "Body0.png", 272, 150, 150);方法合成的主角8方向5動(dòng)作的一張寬150*34=510034=5+8+7+6+8)像素、高150*8=12008=8個(gè)方向,按照上文中的順序)像素的整合圖。(由于該圖尺寸過大(5100*1200像素),所以我將之縮小為原尺寸的15%左右以供給大家展示)

    從上圖下部分中(上部分的局部放大圖),大家可以很清晰的發(fā)現(xiàn)圖片排列的規(guī)律:即834列;從行看,由上至下的8行分別為代號(hào)0-78個(gè)方向的所有圖片;從列看1-5列為站立幀圖片,6-13列為跑動(dòng)幀圖片,14-20列為攻擊幀圖片,21-26列為施法幀圖片,27-34列為死亡幀圖片。理清了規(guī)律后,如何對它進(jìn)行局部單圖截取?嘿嘿,且聽下回分解。

作者:深藍(lán)色右手
出處:http://alamiye010.cnblogs.com
教程目錄及源碼下載:點(diǎn)擊進(jìn)入(歡迎加入WPF/Silverlight小組 WPF/Silverlight博客團(tuán)隊(duì))
本文版權(quán)歸作者和博客園共有,歡迎轉(zhuǎn)載。但未經(jīng)作者同意必須保留此段聲明,且在文章頁面顯著位置給出原文連接,否則保留追究法律責(zé)任的權(quán)利。
本站僅提供存儲(chǔ)服務(wù),所有內(nèi)容均由用戶發(fā)布,如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,請點(diǎn)擊舉報(bào)。
打開APP,閱讀全文并永久保存 查看更多類似文章
猜你喜歡
類似文章
Silverlight與WPF開發(fā)人員入門應(yīng)該知道的十件事
Silverlight/WPF 系列匯總
WCF、WPF、Silverlight和區(qū)別(轉(zhuǎn))
wpf/silverlight微軟自帶toolkit中chart的改造
Microsoft Silverlight (WPF/E) 微軟的“Flash”
C#開發(fā)WPF/Silverlight動(dòng)畫及游戲系列教程(Game Tutorial):(十一)地圖遮罩層的實(shí)現(xiàn)
更多類似文章 >>
生活服務(wù)
分享 收藏 導(dǎo)長圖 關(guān)注 下載文章
綁定賬號(hào)成功
后續(xù)可登錄賬號(hào)暢享VIP特權(quán)!
如果VIP功能使用有故障,
可點(diǎn)擊這里聯(lián)系客服!

聯(lián)系客服