前面說(shuō)的那么多控件都是“靜態(tài)”的，都是“啞吧”的，今天，你有沒(méi)有興趣研究一下，既能“有聲有色”又操作簡(jiǎn)單的控件嗎？如果有，請(qǐng)隨我來(lái)。

?

?

MediaElement播放多媒體文件。

?

首先，隆重介紹一下MediaElement，為什么要隆重呢？因?yàn)樗?jiǎn)單，真的，你一定會(huì)玩的，但是，MediaElement功能強(qiáng)大，它可以播放音頻和視頻，只要支持的格式就行了。

要設(shè)置播放的音頻或視頻文件，你只需要設(shè)置Source屬性即可，它其實(shí)就是一個(gè)URI，如果要播放你項(xiàng)目中的媒體文件，你先要把媒體文件添加到你的項(xiàng)目中，把它的生成操作設(shè)置為資源，不用我說(shuō)了，都會(huì)了吧。

你一定會(huì)問(wèn)，能播放網(wǎng)絡(luò)的URI指向的媒體文件嗎？呵，你試一試就知道了。

閑話(huà)不扯了，開(kāi)始做練習(xí)，首先自備一個(gè)3gp或MP4文件，你自己隨便找一個(gè)，當(dāng)然，其它格式也可以，呵呵，只要支持就行了，因?yàn)槲覀冊(cè)谀M器中觀看效果，所以最后用一些常用的格式，模擬器不是所有的媒體文件都能支持，具體請(qǐng)參考SDK文檔相關(guān)說(shuō)明。

MediaElement是非常易用的，我簡(jiǎn)單說(shuō)說(shuō)它的一些常用的屬性，相信你自己研究?jī)上戮投摹?br /> 1、Source：剛才說(shuō)了，就是你要播放的媒體文件；
2、AutoPlay：是否自動(dòng)播放，呵，這個(gè)估計(jì)你比我更懂了；
3、Balance：立體聲左右聲道的音量比，就是一個(gè)平衡值，從-1到1，0在中間，所以是默認(rèn)值；
4、Stretch：與Image控件一樣，如何拉伸，或者保持縱橫比；
5、Volume：音量，0-1范圍內(nèi)，默認(rèn)0.5.

好的，下面看看第一個(gè)練習(xí)的布局。

?

?

<phone:PhoneApplicationPage.Resources> <LinearGradientBrush x:Key="pathFill" StartPoint="0.5,0" EndPoint="0.5,1"> <GradientStop Color="LightGreen" Offset="0"/> <GradientStop Color="Orange" Offset="1"/> </LinearGradientBrush> <Style x:Key="btnStyle" TargetType="Button"> <Setter Property="Height" Value="80"/> <Setter Property="Width" Value="80"/> <Setter Property="HorizontalContentAlignment" Value="Stretch"/> <Setter Property="VerticalContentAlignment" Value="Stretch"/> <Setter Property="BorderThickness" Value="0"/> </Style> </phone:PhoneApplicationPage.Resources> <Grid> <Grid.ColumnDefinitions> <ColumnDefinition Width="*"/> <ColumnDefinition Width="auto"/> </Grid.ColumnDefinitions> <StackPanel Orientation="Vertical" Grid.Column="1"> <Button Name="btnPlay" Style="{StaticResource btnStyle}" Click="btnPlay_Click"> <Button.Content> <Path Data="M0,0 L0,40 L40,20 Z" Fill="{StaticResource pathFill}" HorizontalAlignment="Center" VerticalAlignment="Center" /> </Button.Content> </Button> <Button Name="btnPause" Style="{StaticResource btnStyle}" Click="btnPause_Click"> <Button.Content> <Path Data="M0,0 L0,40 L15,40 L15,0 Z M25,0 L25,40 L40,40 L40,0" Fill="{StaticResource pathFill}" HorizontalAlignment="Center" VerticalAlignment="Center" /> </Button.Content> </Button> <Button Name="btnStop" Style="{StaticResource btnStyle}" Click="btnStop_Click"> <Button.Content> <Path Data="M0,0 L0,40 L40,40 L40,0 Z" Fill="{StaticResource pathFill}" HorizontalAlignment="Center" VerticalAlignment="Center" /> </Button.Content> </Button> </StackPanel> <MediaElement x:Name="me" Grid.Column="0" Source="2.mp4" AutoPlay="False"/> </Grid>

?

?

說(shuō)明一下，每個(gè)按鈕上的圖形是我手畫(huà)上去的，Content屬性設(shè)置為Path對(duì)象就可以繪制和填充路徑，為了簡(jiǎn)明，我使用了路徑標(biāo)記法，不用急，我后面的文章會(huì)介紹。

繼續(xù)把后臺(tái)的代碼寫(xiě)完，更簡(jiǎn)單了，就幾個(gè)方法的調(diào)用。

?

private void btnPlay_Click(object sender, RoutedEventArgs e) { this.me.Play(); } private void btnPause_Click(object sender, RoutedEventArgs e) { this.me.Pause(); } private void btnStop_Click(object sender, RoutedEventArgs e) { this.me.Stop(); }

?

?

?

?

把MediaElement和VideoBrush結(jié)合使用。

?

這是我們的第二個(gè)練習(xí)，VideoBrush也是一種畫(huà)刷，但它很特殊，它不用單色，不用漸變顏色，它用視頻來(lái)充填對(duì)象的表面，如元素的背景畫(huà)刷，前景畫(huà)刷等。

VideoBrush只要把SourceName的屬性值設(shè)置為MediaElement的名字即可，也就是說(shuō)，VideoBrush的源是來(lái)自MediaElement對(duì)象，你既可以?xún)蓚€(gè)同時(shí)使用，當(dāng)然，如果你只希望用VideoBrush，那就把MediaElement的Visibility屬性設(shè)置為Collapsed。

有一點(diǎn)要說(shuō)明，盡管在你的頁(yè)面中同時(shí)用到了MediaElement和VideoBrush，但是，在其內(nèi)部，其實(shí)只讀取一次數(shù)據(jù)，所以，引用多少個(gè)媒體文件只取決于MediaElement類(lèi)，無(wú)論你在頁(yè)面使用多少個(gè)VideoBrush，對(duì)性能是沒(méi)有任何影響的，前面我們說(shuō)過(guò)資源，相信大家還記得，資源就是提高可重用率，不必要每次都要?jiǎng)?chuàng)建資源，不然會(huì)大大有損性能，項(xiàng)目中的文件，上面說(shuō)了，你只要把的生成操作設(shè)為資源，它就可以重復(fù)使用，而不會(huì)說(shuō)我每增加一個(gè)引用就分配一個(gè)新實(shí)例，這不需要，資源實(shí)例只需創(chuàng)建一次即可，可以供多處重復(fù)引用。

如果不使用資源，你想象一下是多么恐怖的事，假如一段MP3有2000個(gè)字節(jié)，如果你每用到它都要在內(nèi)存中new一個(gè)，如果我同時(shí)使用100個(gè)這個(gè)對(duì)象，就是100 * 2000 ＝ 200000字節(jié)，這樣內(nèi)存都被你耗盡了，然而如果是資源呢？只要它被創(chuàng)建，一直就是同一個(gè)引用，內(nèi)存只為它分配2000個(gè)字節(jié)，無(wú)論你同時(shí)有1000個(gè)地方在引用它，指向的都是同一塊內(nèi)存區(qū)域，哈，不知道這樣解釋，夠不夠通俗易懂呢？

OK，就吹到這兒，下面我們?cè)倬氁焕?#xff0c;在TextBlock上顯示Hello，但我希望這個(gè)TextBlock的前景不是使用顏色來(lái)填充，而是用視頻來(lái)填充，這樣一來(lái)，這段文字看起來(lái)就有聲有色了，是啊，你有沒(méi)有想起Flash里面的濾罩層？但現(xiàn)在你可以通過(guò)VideoBrush類(lèi)輕松地實(shí)現(xiàn)。

?

<Grid> <MediaElement x:Name="me" Source="2.mp4" Visibility="Collapsed"/> <TextBlock x:Name="txt" Text="Hello" HorizontalAlignment="Center" FontFamily="Arial Black" FontSize="250" TextWrapping="Wrap"> <TextBlock.Foreground> <VideoBrush AlignmentX="Center" AlignmentY="Center" Stretch="Uniform" SourceName="me"/> </TextBlock.Foreground> </TextBlock> </Grid>

?

?

還記得前兩節(jié)課說(shuō)過(guò)的變換和三維透視嗎？你不妨自己試試，知識(shí)就是通過(guò)“滾雪球”方式一點(diǎn)一點(diǎn)累積起來(lái)，所以，我強(qiáng)烈建議你去改一下上面的代碼，把上兩節(jié)的內(nèi)容和本節(jié)的內(nèi)容結(jié)合，看看能不能做出很美觀的特效出來(lái)。

總結(jié)

以上是生活随笔為你收集整理的Windows Phone开发（20）：当MediaElement和VideoBrush合作的时候的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

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