在上一講中（在Silverlight中使用SmoothStreamingMediaElement創(chuàng)建Smooth Streaming播放器 ）我向大家詳細(xì)介紹了在Silverlight3中如何使用SmoothStreamingMediaElement（SSME）控件編寫一個(gè)支持Smooth Streaming視頻流的播放器，正如你所看到的，那個(gè)播放器非常簡陋，除了沒有亮麗的外觀外，功能也很簡單，當(dāng)然，你可以繼續(xù)在界面上添加一些控件元素來豐富播放器的功能，例如前進(jìn)、后退、左右聲道、全屏等等，其實(shí)這些功能普通的MediaElement控件就已經(jīng)全部支持了，你只需要自己編寫簡單的邏輯加以控制就OK了，也比較簡單。本文要討論的重點(diǎn)并不是如何添加這些功能，而是如何實(shí)現(xiàn)Big Buck Bunny播放器中實(shí)時(shí)跟蹤Smooth Streaming視頻流播放狀態(tài)的浮動(dòng)面板，下面是我們要模仿的效果：

??　　大家可以看到播放器上有三個(gè)浮動(dòng)的面板，分別顯示了當(dāng)前視頻播放時(shí)的幀率、比特率，以及可以自定義視頻播放時(shí)的比特率。我們已經(jīng)了解了Smooth Streaming技術(shù)的原理，它可以根據(jù)客戶端請求的帶寬動(dòng)態(tài)傳輸不同質(zhì)量的視頻，當(dāng)網(wǎng)路狀態(tài)良好時(shí)播放的視頻質(zhì)量較高，當(dāng)網(wǎng)絡(luò)狀態(tài)較差時(shí)播放的視頻質(zhì)量就比較差，從而保證了視頻播放的流暢性。官方網(wǎng)站上有專門介紹Smooth Streaming技術(shù)的相關(guān)資料，同時(shí)你也可以在微軟的msdn上找到有關(guān)SSME控件的一些內(nèi)容，在開始這些之前你需要下載Smooth Streaming SDK。這些步驟我在前面的兩篇文章中都已經(jīng)詳細(xì)介紹過，感興趣的讀者可以參考下。

http://www.cnblogs.com/jaxu/archive/2010/01/08/1642143.html

http://www.cnblogs.com/jaxu/archive/2010/01/21/1653314.html

　　SDK中包含的內(nèi)容只適合做演示，并不包含示例播放器的源代碼，如果你打算重構(gòu)該播放器，只能自己動(dòng)手去模仿了，但其實(shí)我們有一些捷徑可以走。還記得我在前一篇文章中向大家介紹的Reflector反編譯工具嗎？里面的SilverlightBrowser插件，我們可以對(duì)SDK中的示例播放器進(jìn)行反編譯，以查看它是如何實(shí)現(xiàn)那三個(gè)浮動(dòng)面板的。

　　在對(duì)反編譯后的代碼進(jìn)行研究后發(fā)現(xiàn)，幀率和比特率的跟蹤面板其實(shí)都是Silverlight自定義控件，這樣我們只要在我們的工程中引入相應(yīng)的dll文件，就可以直接使用它們。至于比特率設(shè)置面板，其實(shí)就是兩個(gè)Silder控件，通過Value_Changed事件來對(duì)Smooth Streaming播放進(jìn)行控制。下面是我反編譯并經(jīng)過整理后的代碼，大家可以先下載下來研究一下。使用的時(shí)候客戶端引用xap時(shí)的參數(shù)可以參照skd中的示例。

SmoothStreamingTest.rar

　　這里有一個(gè)問題，那就是代碼中的mainPlayer是一個(gè)自定義控件，而且從反編譯的情況來看，要想重構(gòu)基本不可能（結(jié)構(gòu)比較復(fù)雜，類很多，重構(gòu)的代價(jià)太大）。其實(shí)這個(gè)自定義控件中不外乎用到了SSME，既然這樣的話，我們不如直接將其替換成SSME，然后將代碼稍微改動(dòng)一下就可以了。整個(gè)代碼應(yīng)該很簡單，因?yàn)槎际腔诜淳幾g的結(jié)果，自己只需要將一些有用的代碼整理一下就行了。我在這里稍做一下解釋。

　　1. MainPage.xaml和App.xaml文件中有一些需要的樣式要添加到你工程中對(duì)應(yīng)的文件里。

　　2. MainPage.xaml文件里有關(guān)三個(gè)面板的布局代碼需要添加到你工程中相應(yīng)的地方。

　　3. 后臺(tái)代碼可以直接用我提供的。包括一些私有成員變量的定義，UpdateControlReferences方法，FindVisualElementFrom方法，LimitMaxBitrateSlider_ValueChanged事件，OnTimerCompleted事件，和對(duì)SmoothPlayer_MediaOpened事件的補(bǔ)充。

　　基本上就是這幾塊，其它的部分都是在前一篇文章中講解SSME的用法時(shí)用過的，沒有做任何更改。程序的結(jié)構(gòu)就是首先定義了一個(gè)動(dòng)畫，用來控制幀率跟蹤面板和比特率跟蹤面板里路徑的變化，當(dāng)視頻被成功打開后初始化三個(gè)面板的相關(guān)參數(shù)讓面板中的內(nèi)容顯示出來，然后執(zhí)行動(dòng)畫，當(dāng)動(dòng)畫執(zhí)行完成后根據(jù)SSME當(dāng)前的播放狀態(tài)更新面板的值同時(shí)修改面板中的路徑，然后重新執(zhí)行動(dòng)畫。基本過程就是這樣的。下面是我給出的代碼。

SmoothStreamingPlayer.rar

　　以下是成功運(yùn)行后的截圖：

?　　當(dāng)然，你可以自己添加一個(gè)ToogleButton用來控制顯示或隱藏面板，這個(gè)可以直接控制OverlaySpacingGrid控件的Visibility屬性即可。

　　有一個(gè)問題你可能需要注意一下，那就是當(dāng)你發(fā)現(xiàn)你在播放視頻的時(shí)候比特率的跟蹤信息一直顯示的是最下面一檔，而且Now Downloading Bite Rate面板中的進(jìn)度條也一直處在最左邊的位置，這時(shí)你可能需要重新查看一下你的SSME的尺寸和你所轉(zhuǎn)換的Smooth Streaming視頻文件的尺寸了，你可以在轉(zhuǎn)換視頻的時(shí)候手動(dòng)調(diào)整一下視頻文件的尺寸（大小和你的SSME控件的大小相一致），然后再重新嘗試。這是我在應(yīng)用的過程中所碰到的一個(gè)問題，我當(dāng)時(shí)所寫的一個(gè)視頻播放器是嵌入在一個(gè)Silverlight插件里面的，所占的地方比較小，于是就出現(xiàn)了上面所述的問題，明明可以看到視頻的質(zhì)量明顯發(fā)生了變化，但是比特率的跟蹤信息就是不變，弄了很長時(shí)間，剛開始一直以為是代碼本身的問題，后來偶然修改了一下視頻源文件的尺寸就解決了。寫在這里提醒大家一下。當(dāng)然，如果你在使用的過程中沒有遇到這種問題就不需要去調(diào)整大小了。

　　對(duì)于Smooth Streaming的技術(shù)目前尚處于摸索階段，實(shí)際應(yīng)用的例子基本上都來自于官網(wǎng)的Big Buck Bunny播放器，目前我們已經(jīng)可以成功地在自己的機(jī)器上借助于IIS7架設(shè)Smooth Streaming服務(wù)器了，然后通過SSME在Silverlight3中快速地創(chuàng)建Smooth Streaming視頻播放器，在本文中，我們通過研究官網(wǎng)提供的例子，也學(xué)會(huì)了如何給SSME添加播放跟蹤信息。

轉(zhuǎn)載于:https://www.cnblogs.com/jaxu/archive/2010/02/02/1661580.html

總結(jié)

以上是生活随笔為你收集整理的在Silverlight3中使用SSME重现Big Buck Bunny播放器的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。